Skip to content
Snippets Groups Projects
Commit 61889809 authored by Jonas Leder's avatar Jonas Leder
Browse files

fix basiclightbox

parent 45ab2d03
Branches
No related tags found
No related merge requests found
Pipeline #2004 passed
// Vars ---------------------------------------------------------------- //
$basicLightbox__background= rgba(0, 0, 0, .8);
$basicLightbox__zIndex= 1000 !default;
$basicLightbox__duration= .4s !default;
$basicLightbox__timing= ease !default;
// basicLightbox ------------------------------------------------------- //
.basicLightbox {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: $basicLightbox__background;
opacity: .01; // Start with .01 to avoid the repaint that happens from 0 to .01
transition: opacity $basicLightbox__duration $basicLightbox__timing;
z-index: $basicLightbox__zIndex;
will-change: opacity;
&--visible {
opacity: 1;
}
&__placeholder {
max-width: 100%;
transform: scale(.9);
transition: transform $basicLightbox__duration $basicLightbox__timing;
z-index: 1;
will-change: transform;
> img:first-child:last-child,
> video:first-child:last-child,
> iframe:first-child:last-child {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
max-width: 95%;
max-height: 95%;
}
> video:first-child:last-child,
> iframe:first-child:last-child {
pointer-events: auto;
}
> img:first-child:last-child,
> video:first-child:last-child {
width: auto;
height: auto;
}
}
&--img &__placeholder,
&--video &__placeholder,
&--iframe &__placeholder {
width: 100%;
height: 100%;
pointer-events: none;
}
&--visible &__placeholder {
transform: scale(1);
}
}
\ No newline at end of file
...@@ -16,5 +16,4 @@ ...@@ -16,5 +16,4 @@
@import "lib/_prism"; @import "lib/_prism";
@import "lib/_sellingTable"; @import "lib/_sellingTable";
@import "lib/_skills"; @import "lib/_skills";
@import "lib/_basicLightbox"
@import "../node_modules/basiclightbox/dist/basicLightbox.min.css"; \ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment