108 lines
1.6 KiB
Stylus
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) |