53 lines
1.9 KiB
Stylus
53 lines
1.9 KiB
Stylus
@import '../constants'
|
|
|
|
:local(.container)
|
|
margin : SPACE
|
|
padding : SPACE (SPACE * 1.5)
|
|
background-color : WHITE
|
|
border-radius : (SPACE / 5)
|
|
box-shadow : ZDEPTH_SHADOW_5
|
|
transition-property : opacity, transform
|
|
transition-duration : ANIMATION_DURATION
|
|
transition-timing-function : ANIMATION_EASE
|
|
transition-delay : ANIMATION_DELAY
|
|
> h1
|
|
margin-bottom : SPACE
|
|
> nav
|
|
margin-top : SPACE
|
|
text-align : right
|
|
> .raised
|
|
margin-left : SPACE
|
|
|
|
:local(.root)
|
|
z-index : 3
|
|
position : fixed
|
|
left : 0
|
|
top : 0
|
|
width : 100vw
|
|
height : 100vh
|
|
background-color : rgba(0,0,0,0.5)
|
|
transition-property : opacity
|
|
transition-duration : (ANIMATION_DURATION / 2)
|
|
transition-timing-function : ANIMATION_EASE
|
|
|
|
&:not(.active)
|
|
pointer-events : none
|
|
opacity : 0
|
|
transition-delay : (ANIMATION_DELAY * 2)
|
|
> :local(.container)
|
|
opacity : 0
|
|
transform : translateY(-(UNIT))
|
|
&.active
|
|
opacity : 1
|
|
> :local(.container)
|
|
opacity : 1
|
|
transform : translateY(0%)
|
|
|
|
// -- Overrides
|
|
:local(.container).small
|
|
width : 33vw
|
|
:local(.container).normal
|
|
width : 50vw
|
|
:local(.container).large
|
|
width : 96vw
|