fix styling for breadcrum with current route

bcgov · Nov 2, 2023 · 069f47f · 069f47f
1 parent ac01b6c
commit 069f47f
Showing 1 changed file with 36 additions and 27 deletions.
diff --git a/style-sheets/primevue-components-overrides.scss b/style-sheets/primevue-components-overrides.scss
@@ -1002,65 +1002,74 @@ label {
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    .#{variables.$primevue-prefix}-menuitem {
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem {
     display: inline-flex !important;
     align-items: center;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    .#{variables.$primevue-prefix}-menuitem
-    .#{variables.$primevue-prefix}-menuitem-link {
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem
+.#{variables.$primevue-prefix}-menuitem-link {
     padding: 0.2rem;
     border-radius: 0;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    .#{variables.$primevue-prefix}-menuitem
-    .#{variables.$primevue-prefix}-menuitem-link:focus {
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem
+.#{variables.$primevue-prefix}-menuitem-link:focus {
     box-shadow: inset 0 0px 0px 0.063rem
-        map.get(lightTheme.$light-theme, 'focus') !important;
+        map.get(lightTheme.$light-theme,'focus') !important;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    .#{variables.$primevue-prefix}-menuitem
-    .#{variables.$primevue-prefix}-menuitem-link
-    .#{variables.$primevue-prefix}-menuitem-text:hover {
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem:last-child
+.#{variables.$primevue-prefix}-menuitem-link {
+    box-shadow:none !important;
+    pointer-events: none;
+}
+
+.#{variables.$primevue-prefix}-breadcrumb
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem
+.#{variables.$primevue-prefix}-menuitem-link
+.#{variables.$primevue-prefix}-menuitem-text:hover {
     color: map.get(lightTheme.$light-theme, 'link-primary-hover') !important;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    .#{variables.$primevue-prefix}-menuitem::after {
+.#{variables.$primevue-prefix}-breadcrumb-list
+.#{variables.$primevue-prefix}-menuitem:not(:last-child)::after {
     color: map.get(lightTheme.$light-theme, 'text-primary');
     content: '/';
     margin: 0 0.5rem;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    li
-    .#{variables.$primevue-prefix}-menuitem-text,
-.#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    li:last-child
-    .#{variables.$primevue-prefix}-menuitem-text {
+.#{variables.$primevue-prefix}-breadcrumb-list li
+.#{variables.$primevue-prefix}-menuitem-text {
     color: map.get(lightTheme.$light-theme, 'link-primary') !important;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    li.#{variables.$primevue-prefix}-menuitem-separator {
+.#{variables.$primevue-prefix}-breadcrumb-list li:last-child
+.#{variables.$primevue-prefix}-menuitem-text {
+    color: map.get(lightTheme.$light-theme, 'text-primary') !important;
+}
+
+.#{variables.$primevue-prefix}-breadcrumb
+.#{variables.$primevue-prefix}-breadcrumb-list
+li.#{variables.$primevue-prefix}-menuitem-separator {
     margin: 0;
 }
 
 .#{variables.$primevue-prefix}-breadcrumb
-    .#{variables.$primevue-prefix}-breadcrumb-list
-    li.#{variables.$primevue-prefix}-menuitem-separator
-    svg {
+.#{variables.$primevue-prefix}-breadcrumb-list
+li.#{variables.$primevue-prefix}-menuitem-separator
+svg {
     display: none;
 }