2024-01-17 00:27:48 +08:00
|
|
|
.nav-area .menu
|
|
|
|
|
width: 100%
|
|
|
|
|
display: grid
|
|
|
|
|
margin: 8px 0
|
2024-01-17 23:39:14 +08:00
|
|
|
grid-template-columns: repeat(hexo-config('menubar.columns'), 1fr)
|
2024-01-17 00:27:48 +08:00
|
|
|
grid-gap: 8px
|
|
|
|
|
&::-webkit-scrollbar
|
|
|
|
|
display: none
|
|
|
|
|
&::-webkit-scrollbar-track-piece
|
|
|
|
|
background: transparent
|
|
|
|
|
&::-webkit-scrollbar-thumb
|
|
|
|
|
display: none
|
|
|
|
|
|
|
|
|
|
.nav-item
|
|
|
|
|
box-sizing: border-box
|
|
|
|
|
width: 100%
|
2024-01-17 14:07:30 +08:00
|
|
|
min-height: 40px
|
2024-01-17 00:27:48 +08:00
|
|
|
border-radius: $border-bar
|
|
|
|
|
font-size: $fs-15
|
|
|
|
|
font-weight: 500
|
|
|
|
|
color: var(--text-p3)
|
|
|
|
|
text-align: center
|
|
|
|
|
background: var(--alpha50)
|
|
|
|
|
trans1 background
|
|
|
|
|
position: relative
|
2024-01-17 14:07:30 +08:00
|
|
|
display: flex
|
|
|
|
|
flex-direction: column
|
|
|
|
|
align-items: center
|
|
|
|
|
justify-content: center
|
2024-01-17 22:57:52 +08:00
|
|
|
img,svg
|
|
|
|
|
height: 28px
|
2024-01-17 14:07:30 +08:00
|
|
|
object-fit: contain
|
2024-01-17 22:57:52 +08:00
|
|
|
filter: grayscale(100%) brightness(0.8) opacity(0.8)
|
2024-01-17 14:07:30 +08:00
|
|
|
trans1 all
|
|
|
|
|
span
|
|
|
|
|
text-overflow: ellipsis
|
|
|
|
|
word-break: keep-all
|
2024-01-17 00:27:48 +08:00
|
|
|
&.active, &:hover
|
|
|
|
|
color: var(--text-p1)
|
|
|
|
|
background: var(--alpha100)
|
2024-01-17 22:57:52 +08:00
|
|
|
img,svg
|
2024-01-17 14:07:30 +08:00
|
|
|
filter: unset
|
2024-01-17 00:27:48 +08:00
|
|
|
&.active:after
|
|
|
|
|
content: ''
|
|
|
|
|
position absolute
|
|
|
|
|
width: 16px
|
|
|
|
|
height: 2px
|
|
|
|
|
left: 50%
|
|
|
|
|
transform: translateX(-50%)
|
|
|
|
|
border-radius: 2px
|
|
|
|
|
bottom: 2px
|
|
|
|
|
background: var(--text-p1)
|
|
|
|
|
|
