53 lines
1.7 KiB
Sass
53 lines
1.7 KiB
Sass
@mixin breadcrumb
|
|
padding: 1em 0
|
|
ul
|
|
display: flex
|
|
background: #eee
|
|
box-shadow: inset 0 0 .3em #ccc, 0 0 .5em #ddd
|
|
padding: .3em
|
|
border: 0.05em solid #fff
|
|
border-radius: .3em
|
|
list-style-type: none
|
|
li
|
|
a
|
|
position: relative
|
|
display: inline-flex
|
|
vertical-align: middle
|
|
text-align: center
|
|
align-items: center
|
|
text-decoration: none
|
|
color: #fff
|
|
background: #ccc
|
|
height: 2em
|
|
padding: .5em .5em
|
|
&::after
|
|
content: ''
|
|
position: absolute
|
|
top: 0
|
|
left: 100%
|
|
border-top: 1em solid transparent
|
|
border-bottom: 1em solid transparent
|
|
border-left: 1em solid #ccc
|
|
|
|
z-index: 2
|
|
&:hover
|
|
background-color: #777
|
|
&::after
|
|
border-left: 1em solid #777
|
|
&:first-child a
|
|
border-top-left-radius: .3em
|
|
border-bottom-left-radius: .3em
|
|
|
|
&:not(:first-child) a
|
|
margin-left: .2em
|
|
padding-left: 1.5em
|
|
&::before
|
|
z-index: 1
|
|
content: ''
|
|
position: absolute
|
|
top: 0
|
|
left: 0%
|
|
border-top: 1em solid transparent
|
|
border-bottom: 1em solid transparent
|
|
border-left: 1em solid #eee
|