99 lines
2.0 KiB
SCSS
99 lines
2.0 KiB
SCSS
@use "sass:meta";
|
|
|
|
@mixin RV-Spacing__Outer--small {
|
|
margin: $-spacing-small;
|
|
}
|
|
|
|
@mixin RV-Spacing__Outer--medium {
|
|
margin: $-spacing-medium;
|
|
}
|
|
|
|
@mixin RV-Spacing__Outer--large {
|
|
margin: $-spacing-large;
|
|
}
|
|
|
|
@mixin _flexrow_breakpoint_min_width($-gap) {
|
|
|
|
@include RV-Utils__Hook--catch {
|
|
$-breakpoint: get-hook-value('breakPoint');
|
|
|
|
@include RV-Utils__ElementAmount using($-index) {
|
|
min-width: calc((#{$-breakpoint} - (#{$-gap} * (#{$-index} - 1))) / #{$-index} - (2 * #{$-gap}));
|
|
|
|
* {
|
|
min-width: initial;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin _flexgrid_masonry_column_gap($-gap) {
|
|
|
|
@include RV-Utils__Hook--catch {
|
|
* {
|
|
margin: $-gap/2 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@mixin RV-Spacing__Inner--small() {
|
|
padding: $-spacing-small;
|
|
gap: $-spacing-small;
|
|
column-gap: $-spacing-small;
|
|
|
|
@include _flexrow_breakpoint_min_width($-spacing-small);
|
|
@include _flexgrid_masonry_column_gap($-spacing-small);
|
|
}
|
|
|
|
@mixin RV-Spacing__Inner--medium() {
|
|
padding: $-spacing-medium;
|
|
gap: $-spacing-medium;
|
|
column-gap: $-spacing-medium;
|
|
|
|
@include _flexrow_breakpoint_min_width($-spacing-medium);
|
|
@include _flexgrid_masonry_column_gap($-spacing-medium);
|
|
}
|
|
|
|
@mixin RV-Spacing__Inner--large() {
|
|
padding: $-spacing-large;
|
|
gap: $-spacing-large;
|
|
column-gap: $-spacing-large;
|
|
|
|
@include _flexrow_breakpoint_min_width($-spacing-large);
|
|
@include _flexgrid_masonry_column_gap($-spacing-medium);
|
|
}
|
|
|
|
@mixin RV-Spacing {
|
|
&__Outer {
|
|
&--small {
|
|
@include RV-Spacing__Outer--small;
|
|
}
|
|
|
|
&--medium {
|
|
@include RV-Spacing__Outer--medium;
|
|
}
|
|
|
|
&--large {
|
|
@include RV-Spacing__Outer--large;
|
|
}
|
|
}
|
|
|
|
&__Inner {
|
|
&--small {
|
|
@include RV-Spacing__Inner--small;
|
|
}
|
|
|
|
&--medium {
|
|
@include RV-Spacing__Inner--medium;
|
|
}
|
|
|
|
&--large {
|
|
@include RV-Spacing__Inner--large;
|
|
}
|
|
}
|
|
}
|
|
|
|
.RV-Spacing {
|
|
@include RV-Spacing;
|
|
} |