hexo-theme-ayer/source-src/css/_partial/layout.styl
2020-12-31 16:10:38 +08:00

108 lines
1.6 KiB
Stylus

// Layout
#app
height 100%
width 100%
position relative
overflow hidden
.cover
position relative
padding 0
margin-bottom 3rem
text-align center
.forkMe
position absolute
z-index 999
top 0
right 0
.content, .sidebar
&.anim
transition(transition-base)
.content
position relative
z-index 1
margin-left 0
height 100%
width 100%
overflow-y scroll
overflow-x: hidden
-webkit-overflow-scrolling touch
&.on
margin-left 0 !important
.sidebar
position fixed
z-index 9
left - aside-width
bottom 0
width aside-width
height 100%
background-color rgba(0,0,0,.8)
&.on
left 0
.navbar-toggle
position absolute
top gutter-width
left: gutter-width + aside-width
border none
height 4rem
width 4rem
border-radius 50%
background-color rgba(black, .5)
color white
transition(transition-base)
opacity .5
&:hover
opacity 1
&::before
content '\ee09'
font-family remixicon
font-size larger
.wrap, .outer
position relative
width 100%
padding-right gutter-width
padding-left gutter-width
margin auto
min-height calc( 100% - 157px )
clearfix()
.local-search
width 100%
#main
position relative
// Media Query
@media (min-width: 768px)
.cover
margin-bottom 0
height 100%
.wrap, .outer
width wrap-width
padding-right 0
padding-left 0
.local-search
width wrap-width
.content
&.on
transform: none
@media (max-width: 768px)
.cover
.forkMe
display none
.content
&.on
margin-left -1px !important
.sidebar
background-color body-color
.navbar-toggle
transform: scale(1.1)