You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
div.gallery
|
|
|
|
margin: $gap-row 0
|
|
|
|
overflow: hidden
|
|
|
|
$sp = 1px
|
|
|
|
>.fancybox,>p>.fancybox
|
|
|
|
margin: $sp
|
|
|
|
padding: 0
|
|
|
|
position: relative
|
|
|
|
.image-caption
|
|
|
|
opacity: 0
|
|
|
|
transform: translateY(100%)
|
|
|
|
transition: all 0.3s ease
|
|
|
|
pointer-events: none
|
|
|
|
position: absolute
|
|
|
|
width: 100%
|
|
|
|
bottom: 0
|
|
|
|
text-align: center
|
|
|
|
background: rgba(0, 0, 0, 0.3)
|
|
|
|
color: #fff
|
|
|
|
&:empty
|
|
|
|
display:none
|
|
|
|
&:hover
|
|
|
|
.image-caption
|
|
|
|
opacity: 1
|
|
|
|
transform: translateY(0)
|
|
|
|
&,>p
|
|
|
|
display: flex
|
|
|
|
justify-content: center
|
|
|
|
align-items: center
|
|
|
|
flex-wrap: nowrap
|
|
|
|
padding: 0 !important
|
|
|
|
align-items: stretch
|
|
|
|
&[col]>p
|
|
|
|
flex-wrap: wrap
|
|
|
|
justify-content: flex-start
|
|
|
|
&[col='2']>p>.fancybox
|
|
|
|
width: "calc(50% - 2 * %s)" % $sp
|
|
|
|
&[col='3']>p>.fancybox
|
|
|
|
width: "calc(33.33% - 2 * %s)" % $sp
|
|
|
|
&[col='4']>p>.fancybox
|
|
|
|
width: "calc(25% - 2 * %s)" % $sp
|
|
|
|
&[col='5']>p>.fancybox
|
|
|
|
width: "calc(20% - 2 * %s)" % $sp
|
|
|
|
&[col='6']>p>.fancybox
|
|
|
|
width: "calc(16.66% - 2 * %s)" % $sp
|
|
|
|
&[col='7']>p>.fancybox
|
|
|
|
width: "calc(14.2857% - 2 * %s)" % $sp
|
|
|
|
&[col='8']>p>.fancybox
|
|
|
|
width: "calc(12.5% - 2 * %s)" % $sp
|
|
|
|
>p
|
|
|
|
margin: 0
|
|
|
|
&.left,&.left>p
|
|
|
|
justify-content: flex-start
|
|
|
|
&.center,&.center>p
|
|
|
|
justify-content: center
|
|
|
|
&.right,&.right>p
|
|
|
|
justify-content: flex-end
|
|
|
|
&.stretch,&.stretch>p
|
|
|
|
align-items: stretch
|
|
|
|
img
|
|
|
|
transform: scale(1.5)
|
|
|
|
|
|
|
|
.fancybox-container
|
|
|
|
.fancybox-stage
|
|
|
|
cursor: zoom-out
|
|
|
|
|
|
|
|
.fancybox
|
|
|
|
display: flex
|
|
|
|
flex-direction: column
|
|
|
|
justify-content: center
|
|
|
|
align-items: center
|
|
|
|
flex-wrap: nowrap
|
|
|
|
padding: 0 !important
|
|
|
|
overflow: hidden
|
|
|
|
border-radius: 2px
|
|
|
|
@media screen and (max-width: $device-mobile)
|
|
|
|
border-radius: 1px
|
|
|
|
a
|
|
|
|
line-height: 0
|
|
|
|
margin: 0
|
|
|
|
align-items: stretch
|
|
|
|
cursor: zoom-in
|
|
|
|
.gallery
|
|
|
|
overflow: hidden
|
|
|
|
.image-caption
|
|
|
|
font-size: $fontsize-code
|
|
|
|
padding-top: $gap-row
|
|
|
|
padding-bottom: $gap-row
|
|
|
|
color: $color-meta
|