2023-03-08 13:36:35 +00:00
|
|
|
.image-fullscreen
|
|
|
|
|
margin: 0
|
|
|
|
|
padding: 0 0 0 3.5rem
|
|
|
|
|
|
|
|
|
|
width: 100%
|
2023-03-14 22:07:17 +00:00
|
|
|
height: 100%
|
2023-03-08 13:36:35 +00:00
|
|
|
height: 100dvh
|
|
|
|
|
|
|
|
|
|
position: fixed
|
2023-03-10 12:32:23 +00:00
|
|
|
top: 0
|
2023-03-08 13:36:35 +00:00
|
|
|
left: 0
|
|
|
|
|
|
2023-03-10 12:32:23 +00:00
|
|
|
display: none
|
2023-03-08 13:36:35 +00:00
|
|
|
opacity: 0 // hide
|
|
|
|
|
|
|
|
|
|
background-color: rgba($black, 0.8)
|
|
|
|
|
z-index: 21
|
|
|
|
|
|
|
|
|
|
box-sizing: border-box
|
|
|
|
|
|
2023-03-10 12:32:23 +00:00
|
|
|
transition: opacity 0.2s cubic-bezier(.79, .14, .15, .86)
|
|
|
|
|
|
2023-03-08 13:36:35 +00:00
|
|
|
img
|
|
|
|
|
margin: auto
|
|
|
|
|
padding: 0
|
|
|
|
|
|
|
|
|
|
width: auto
|
|
|
|
|
height: auto
|
|
|
|
|
max-width: 100%
|
|
|
|
|
max-height: 100%
|
|
|
|
|
|
|
|
|
|
object-fit: contain
|
|
|
|
|
object-position: center
|
|
|
|
|
|
|
|
|
|
transform: scale(0.8)
|
|
|
|
|
transition: transform 0.2s cubic-bezier(.68,-0.55,.27,1.55)
|
|
|
|
|
|
2023-03-10 12:32:23 +00:00
|
|
|
&.active
|
|
|
|
|
opacity: 1 // show
|
2023-03-08 13:36:35 +00:00
|
|
|
|
2023-03-10 12:32:23 +00:00
|
|
|
img
|
|
|
|
|
transform: scale(1)
|
