aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/components/LdBreadcrumb.vue
diff options
context:
space:
mode:
authorpacien2021-07-04 17:35:17 +0200
committerpacien2021-07-04 17:35:17 +0200
commitd48a9eb9a75d8e55f78964e884bb94efd23fcd9b (patch)
tree6058cc246b6546ed57b3ac7821a6ae775caf1fd5 /viewer/src/components/LdBreadcrumb.vue
parent34fc1501f74f29d29737164e47977b7412c84ceb (diff)
parentdfa1c6e2f2977c32f75c1d93d9e7eb44fbed28c0 (diff)
downloadldgallery-d48a9eb9a75d8e55f78964e884bb94efd23fcd9b.tar.gz
Merge branch 'oz-css-modules' into develop
Reviewed-by: pacien <pacien.trangirard@pacien.net> GitHub: closes #306
Diffstat (limited to 'viewer/src/components/LdBreadcrumb.vue')
-rw-r--r--viewer/src/components/LdBreadcrumb.vue15
1 files changed, 8 insertions, 7 deletions
diff --git a/viewer/src/components/LdBreadcrumb.vue b/viewer/src/components/LdBreadcrumb.vue
index 2c17554..d518365 100644
--- a/viewer/src/components/LdBreadcrumb.vue
+++ b/viewer/src/components/LdBreadcrumb.vue
@@ -21,14 +21,15 @@
21 <div 21 <div
22 ref="breadcrumb" 22 ref="breadcrumb"
23 v-dragscroll 23 v-dragscroll
24 class="ld-breadcrumb flex scrollbar" 24 class="flex scrollbar"
25 :class="$style.ldBreadcrumb"
25 @click.capture="e => dragScrollClickFix.onClickCapture(e)" 26 @click.capture="e => dragScrollClickFix.onClickCapture(e)"
26 @dragscrollstart="dragScrollClickFix.onDragScrollStart()" 27 @dragscrollstart="dragScrollClickFix.onDragScrollStart()"
27 @dragscrollend="dragScrollClickFix.onDragScrollEnd()" 28 @dragscrollend="dragScrollClickFix.onDragScrollEnd()"
28 @dragscrollmove="checkForOverflowMask" 29 @dragscrollmove="checkForOverflowMask"
29 > 30 >
30 <div v-show="overflowMask" class="ld-breadcrumb-overflow-mask"></div> 31 <div v-show="overflowMask" :class="$style.ldBreadcrumbOverflowMask"></div>
31 <ul class="ld-breadcrumb"> 32 <ul>
32 <li v-for="(item, idx) in currentItemPath" :key="item.path"> 33 <li v-for="(item, idx) in currentItemPath" :key="item.path">
33 <fa-icon v-if="idx > 0" icon="angle-right" class="disabled" /> 34 <fa-icon v-if="idx > 0" icon="angle-right" class="disabled" />
34 <router-link :to="item.path" class="link"> 35 <router-link :to="item.path" class="link">
@@ -89,10 +90,10 @@ export default class LdBreadcrumb extends Vue {
89} 90}
90</script> 91</script>
91 92
92<style lang="scss"> 93<style lang="scss" module>
93@import "~@/assets/scss/theme.scss"; 94@import "~@/assets/scss/theme.scss";
94 95
95.ld-breadcrumb-overflow-mask { 96.ldBreadcrumbOverflowMask {
96 position: absolute; 97 position: absolute;
97 width: 100%; 98 width: 100%;
98 height: 100%; 99 height: 100%;
@@ -104,7 +105,7 @@ export default class LdBreadcrumb extends Vue {
104 pointer-events: none; 105 pointer-events: none;
105} 106}
106 107
107.ld-breadcrumb { 108.ldBreadcrumb {
108 ul { 109 ul {
109 display: flex; 110 display: flex;
110 white-space: nowrap; 111 white-space: nowrap;
@@ -117,7 +118,7 @@ export default class LdBreadcrumb extends Vue {
117 align-self: center; 118 align-self: center;
118 margin-right: $breadcrumb-margins; 119 margin-right: $breadcrumb-margins;
119 } 120 }
120 &.scrollbar { 121 &:global(.scrollbar) {
121 overflow-y: hidden; 122 overflow-y: hidden;
122 scrollbar-width: none; 123 scrollbar-width: none;
123 &::-webkit-scrollbar { 124 &::-webkit-scrollbar {