hexo-theme-stellar/source/css/_layout/sidebar/sidebar.styl

32 lines
944 B
Stylus

.l_left
margin: 8px
height: 'calc(%s - 16px)' % 100vh
border-radius: $border-card
overflow: hidden
.header
margin: var(--gap-l) var(--gap-l) 0
margin-top: "calc(2 * %s)" % var(--gap-l)
@media screen and (min-width: $device-mobile-max)
>.widgets:first-child>.widget-wrapper:first-child
margin-top: "calc(2 * %s)" % var(--gap-l)
.l_left
.sidebar-bg
position absolute
width: 100%
height: 100%
object-fit: cover
background: var(--text-meta)
.sidebar-container
height: 100%
--blur-px: 100px
--blur-bg: var(--sidebar-bg)
@supports ((-webkit-backdrop-filter:blur(var(--blur-px))) or (backdrop-filter:blur(var(--blur-px))))
background: var(--blur-bg)
backdrop-filter: saturate(240%) blur(var(--blur-px))
-webkit-backdrop-filter: saturate(240%) blur(var(--blur-px))
display: flex
flex-direction: column
word-break: break-all
text-align: justify