76 lines
1.1 KiB
Sass
76 lines
1.1 KiB
Sass
|
#page-overlay
|
||
|
|
background-color: rgba(black, .8)
|
||
|
|
position: fixed
|
||
|
|
top: 0
|
||
|
|
bottom: 0
|
||
|
|
right: 0
|
||
|
|
left: 0
|
||
|
|
z-index: $z-index-base + 15
|
||
|
|
visibility: hidden
|
||
|
|
opacity: 0
|
||
|
|
transition: opacity 150ms ease-in-out
|
||
|
|
|
||
|
|
display: flex
|
||
|
|
align-items: center
|
||
|
|
justify-content: center
|
||
|
|
|
||
|
|
img
|
||
|
|
user-select: none
|
||
|
|
display: block
|
||
|
|
max-height: 96%
|
||
|
|
max-width: 96%
|
||
|
|
z-index: 0
|
||
|
|
|
||
|
|
box-shadow: 0 0 15px rgba(black, .2), 0 0 100px rgba(black, .5)
|
||
|
|
p.caption
|
||
|
|
position: absolute
|
||
|
|
bottom: 1%
|
||
|
|
|
||
|
|
&.active
|
||
|
|
visibility: visible
|
||
|
|
opacity: 1
|
||
|
|
|
||
|
|
.no-preview
|
||
|
|
user-select: none
|
||
|
|
z-index: 0
|
||
|
|
color: $color-text-light-secondary
|
||
|
|
|
||
|
|
.nav-prev, .nav-next
|
||
|
|
display: block
|
||
|
|
font:
|
||
|
|
family: 'pillar-font'
|
||
|
|
size: 2em
|
||
|
|
height: 80%
|
||
|
|
width: 50px
|
||
|
|
cursor: pointer
|
||
|
|
color: $color-text-light-secondary
|
||
|
|
z-index: 1
|
||
|
|
+position-center-translate
|
||
|
|
|
||
|
|
&:hover
|
||
|
|
color: $color-text-light
|
||
|
|
|
||
|
|
&:before, &:after
|
||
|
|
+position-center-translate
|
||
|
|
|
||
|
|
.nav-prev
|
||
|
|
left: 50px
|
||
|
|
&:before
|
||
|
|
content: '\e839'
|
||
|
|
|
||
|
|
.nav-next
|
||
|
|
left: initial
|
||
|
|
right: 0
|
||
|
|
&:before
|
||
|
|
content: '\e83a'
|
||
|
|
|
||
|
|
|
||
|
|
&.video
|
||
|
|
.video-embed
|
||
|
|
+position-center-translate
|
||
|
|
position: fixed
|
||
|
|
|
||
|
|
iframe
|
||
|
|
width: 853px
|
||
|
|
height: 480px
|