blob: 7d2666b42dc9f93e8a0dbb7f3b86d34ce80cf702 [file] [log] [blame]
@charset "UTF-8";
//////////////////////////////////////////////////////////////////////////////////
//
// Element queries for _lightbox.scss, based on: https://github.com/Snugug/eq.js
//
//////////////////////////////////////////////////////////////////////////////////
@import "../variables";
@import "../functions";
.mdlext-lightboard {
@include eq-pts((
lightboard_medium_small: strip-unit($mdlext-lightboard-medium-small-breakpoint),
lightboard_medium: strip-unit($mdlext-lightboard-medium-breakpoint),
lightboard_medium_large: strip-unit($mdlext-lightboard-medium-large-breakpoint),
lightboard_large: strip-unit($mdlext-lightboard-large-breakpoint)
));
////// small - meduim-small //////
@include eq('lightboard_medium_small') {
padding: calc((#{$mdlext-lightboard-medium-small-margin} - #{$mdlext-lightboard-medium-small-gutter}) / 2);
.mdlext-lightboard__slide {
margin: calc(#{$mdlext-lightboard-medium-small-gutter} / 2);
width: calc(1 / #{$mdlext-lightboard-medium-small-columns} * 100% - #{$mdlext-lightboard-medium-small-gutter});
.mdlext-lightboard__slide__frame figure {
margin: $mdlext-lightboard-medium-small-frame-width;
}
}
&.mdlext-lightboard--no-spacing {
padding: 0;
.mdlext-lightboard__slide {
margin: 0;
width: calc(1 / #{$mdlext-lightboard-medium-small-columns} * 100%);
}
}
}
////// meduim-small - medium //////
@include eq('lightboard_medium') {
padding: calc((#{$mdlext-lightboard-medium-margin} - #{$mdlext-lightboard-medium-gutter}) / 2);
.mdlext-lightboard__slide {
margin: calc(#{$mdlext-lightboard-medium-gutter} / 2);
width: calc(1 / #{$mdlext-lightboard-medium-columns} * 100% - #{$mdlext-lightboard-medium-gutter});
.mdlext-lightboard__slide__frame figure {
margin: $mdlext-lightboard-medium-frame-width;
}
}
&.mdlext-lightboard--no-spacing {
padding: 0;
.mdlext-lightboard__slide {
margin: 0;
width: calc(1 / #{$mdlext-lightboard-medium-columns} * 100%);
}
}
}
////// meduim - medium-large //////
@include eq('lightboard_medium_large') {
padding: calc((#{$mdlext-lightboard-medium-large-margin} - #{$mdlext-lightboard-medium-large-gutter}) / 2);
.mdlext-lightboard__slide {
margin: calc(#{$mdlext-lightboard-medium-large-gutter} / 2);
width: calc(1 / #{$mdlext-lightboard-medium-large-columns} * 100% - #{$mdlext-lightboard-medium-large-gutter});
.mdlext-lightboard__slide__frame figure {
margin: $mdlext-lightboard-medium-large-frame-width;
}
}
&.mdlext-lightboard--no-spacing {
padding: 0;
.mdlext-lightboard__slide {
margin: 0;
width: calc(1 / #{$mdlext-lightboard-medium-large-columns} * 100%);
}
}
}
////// meduim-large - large //////
@include eq('lightboard_large') {
padding: calc((#{$mdlext-lightboard-large-margin} - #{$mdlext-lightboard-large-gutter}) / 2);
.mdlext-lightboard__slide {
margin: calc(#{$mdlext-lightboard-large-gutter} / 2);
width: calc(1 / #{$mdlext-lightboard-large-columns} * 100% - #{$mdlext-lightboard-large-gutter});
.mdlext-lightboard__slide__frame figure {
margin: $mdlext-lightboard-large-frame-width;
}
}
&.mdlext-lightboard--no-spacing {
padding: 0;
.mdlext-lightboard__slide {
margin: 0;
width: calc(1 / #{$mdlext-lightboard-large-columns} * 100%);
}
}
}
}
@include eq-selectors;