2021-02-20 13:09:41 +08:00
|
|
|
.nav-wrap
|
2021-02-19 23:33:19 +08:00
|
|
|
position: sticky
|
|
|
|
position: -webkit-sticky
|
2022-11-19 17:42:35 +08:00
|
|
|
margin-top: -0.5rem
|
2021-02-19 23:33:19 +08:00
|
|
|
top: -2px
|
|
|
|
background: var(--site-bg)
|
2021-07-08 22:23:55 +08:00
|
|
|
padding: 0 1rem
|
2021-07-10 12:57:48 +08:00
|
|
|
z-index: 8
|
2021-07-08 22:23:55 +08:00
|
|
|
margin-bottom: 1px
|
|
|
|
&:after
|
|
|
|
content: ''
|
|
|
|
width: 'calc(100% - 2 * %s)' % 1rem
|
|
|
|
height: 2px
|
|
|
|
border-radius: 2px
|
|
|
|
position: absolute
|
|
|
|
bottom: 0
|
|
|
|
left: 1rem
|
|
|
|
background: var(--block-hover)
|
2021-02-25 13:12:04 +08:00
|
|
|
|
2021-02-20 13:09:41 +08:00
|
|
|
nav.cap
|
|
|
|
display: flex
|
2021-07-08 22:23:55 +08:00
|
|
|
overflow: scroll visible
|
2021-02-19 23:33:19 +08:00
|
|
|
scrollbar(0, 0)
|
|
|
|
>p
|
|
|
|
margin: 0
|
|
|
|
a
|
2021-11-19 23:46:31 +08:00
|
|
|
padding: .25rem 1rem
|
2021-07-08 22:23:55 +08:00
|
|
|
margin: 10px 0 8px 0
|
|
|
|
line-height: 2
|
2021-02-19 23:33:19 +08:00
|
|
|
color: var(--text-p3)
|
|
|
|
border-radius: 4px
|
2021-03-05 21:37:28 +08:00
|
|
|
font-weight: 500
|
2021-02-19 23:33:19 +08:00
|
|
|
white-space: nowrap
|
2021-07-08 22:23:55 +08:00
|
|
|
position: relative
|
|
|
|
z-index: 1
|
|
|
|
&:after
|
|
|
|
height: 2px
|
|
|
|
position: absolute
|
|
|
|
bottom: -8px
|
2021-11-19 23:46:31 +08:00
|
|
|
left: 1rem
|
|
|
|
right: 1rem
|
2021-07-29 00:25:37 +08:00
|
|
|
background: $color-theme
|
|
|
|
border-radius: 2px
|
|
|
|
pointer-events: none
|
2021-07-08 22:23:55 +08:00
|
|
|
&:hover
|
2021-03-08 17:54:23 +08:00
|
|
|
background: var(--block-hover)
|
2021-07-08 22:23:55 +08:00
|
|
|
&.active, &:hover
|
2021-02-19 23:33:19 +08:00
|
|
|
color: var(--text-p1)
|
2021-07-09 21:18:14 +08:00
|
|
|
&.active
|
|
|
|
background: var(--card)
|
|
|
|
box-shadow: $boxshadow-button
|
2021-07-08 22:23:55 +08:00
|
|
|
&.active:after
|
2021-07-29 00:25:37 +08:00
|
|
|
content: ''
|
2021-07-09 21:18:14 +08:00
|
|
|
a+a
|
|
|
|
margin-left: 4px
|
2021-02-20 13:09:41 +08:00
|
|
|
|
2022-10-09 13:42:03 +08:00
|
|
|
@media screen and (max-width: $device-mobile-max)
|
2021-02-20 13:09:41 +08:00
|
|
|
.nav-wrap
|
2021-02-22 23:07:12 +08:00
|
|
|
margin-top: 0
|
2022-11-19 17:42:35 +08:00
|
|
|
padding-left: 0
|
|
|
|
padding-right: 0
|
|
|
|
nav
|
|
|
|
a:first-child
|
|
|
|
margin-left: 1rem
|
|
|
|
a:last-child
|
|
|
|
margin-right: 1rem
|