hexo-theme-stellar/source/css/_common/device.styl

76 lines
1.6 KiB
Stylus

.mobile-only
display: none
@media screen and (max-width: $device-mobile-max)
display: block !important
.mobile-hidden
@media screen and (max-width: $device-mobile-max)
display: none !important
.float-panel
position: sticky
grid-column-end: span 3
right: 0
bottom: 2rem
float: right
z-index: 10
display: flex
flex-direction: column
border-radius: 0.5rem
margin-left: auto
margin-right: 1rem
overflow: hidden
--blur-px: 16px
--blur-bg: alpha(#fff, .4)
trans1: all
if hexo-config('style.darkmode') == 'auto'
@media (prefers-color-scheme: dark)
--blur-bg: alpha(#000, .4)
if hexo-config('style.darkmode') == 'always'
--blur-bg: alpha(#000, .4)
//
.float-panel button
cursor: pointer
color: var(--text)
background: none
padding: 8px
line-height: 0
font-size: 28px
margin: 0
display: flex
>*
path#sep
trans1 transform
width: auto
height: 28px
//
.l_body[leftbar] .float-panel, .l_body[rightbar] .float-panel
box-shadow: 0 0 4px -2px $color-theme, 0 0 24px -12px $color-theme
.l_body[leftbar] .float-panel button
background: var(--card)
.l_body[leftbar] .float-panel button.leftbar-toggle
color: $color-theme
border-color: var(--block-border)
svg g
fill: currentColor
fill-opacity: 0.3
path#sep
transform: translateX(2px)
.l_body[rightbar] .float-panel button
background: var(--card)
.l_body[rightbar] .float-panel button.rightbar-toggle
color: $color-theme
border-color: var(--block-border)
svg g
fill: currentColor
fill-opacity: 0.3
path#sep
transform: translateX(2px)