hexo-theme-stellar/source/css/_components/partial/navbar.styl

77 lines
1.6 KiB
Stylus

.navbar
padding: 0 1rem
z-index: 8
top: 0
background: var(--site-bg)
if hexo-config('style.site') && hexo-config('style.site.background-image')
position inherit
background: none
else
position: sticky
position: -webkit-sticky
margin-bottom: 1px
margin-top: -8px
&:after
content: ''
height: 2px
border-radius: 2px
position: absolute
bottom: 0
left: 1rem
right: 1rem
background: var(--block-hover)
.navbar nav
display: flex
overflow: scroll visible
scrollbar(0, 0)
font-size: $fs-14
>p
margin: 0
a
padding: 2px 0.75rem
if hexo-config('style.site') && hexo-config('style.site.background-image')
margin: 10px 0.25rem 8px 0
else
margin: 10px 0.25rem 8px 0.25rem
line-height: 2
color: var(--text-p3)
border-radius: $border-button
font-weight: 500
white-space: nowrap
position: relative
z-index: 1
&:after
height: 2px
position: absolute
bottom: -8px
left: 0.75rem
right: 0.75rem
background: $color-theme
border-radius: 2px
pointer-events: none
&:hover
background: var(--block-hover)
&.active, &:hover
color: var(--text-p1)
&.active
background: var(--card)
box-shadow: $boxshadow-button
cursor default
pointer-events: none
&.active:after
content: ''
a+a
margin-left: 4px
@media screen and (max-width: $device-mobile-max)
.navbar.top
margin-top: 0
padding-left: 0
padding-right: 0
nav
a:first-child
margin-left: 1rem
a:last-child
margin-right: 1rem