breadcrumb.sass in bulma-rails-0.5.1

- old
+ new

@@ -1,5 +1,11 @@
+$breadcrumb-item-color: $text-light !default
+$breadcrumb-item-hover-color: $link-hover !default
+$breadcrumb-item-active-color: $text-strong !default
+
+$breadcrumb-item-separator-color: $text !default
+
 .breadcrumb
   +block
   +unselectable
   align-items: stretch
   display: flex
@@ -7,27 +13,27 @@
   overflow: hidden
   overflow-x: auto
   white-space: nowrap
   a
     align-items: center
-    color: $text-light
+    color: $breadcrumb-item-color
     display: flex
     justify-content: center
     padding: 0.5em 0.75em
     &:hover
-      color: $link-hover
+      color: $breadcrumb-item-hover-color
   li
     align-items: center
     display: flex
     &.is-active
       a
-        color: $text-strong
+        color: $breadcrumb-item-active-color
         cursor: default
         pointer-events: none
-    & + li:before
-      color: $text
-      content: '\0002f'
+    & + li::before
+      color: $breadcrumb-item-separator-color
+      content: "\0002f"
   ul, ol
     align-items: center
     display: flex
     flex-grow: 1
     flex-shrink: 0
@@ -51,16 +57,16 @@
     font-size: $size-medium
   &.is-large
     font-size: $size-large
   // Styles
   &.has-arrow-separator
-    li + li:before
-      content: '\02192'
+    li + li::before
+      content: "\02192"
   &.has-bullet-separator
-    li + li:before
-      content: '\02022'
+    li + li::before
+      content: "\02022"
   &.has-dot-separator
-    li + li:before
-      content: '\000b7'
+    li + li::before
+      content: "\000b7"
   &.has-succeeds-separator
-    li + li:before
-      content: '\0227B'
+    li + li::before
+      content: "\0227B"