chore: implement initial simple website

This commit is contained in:
2024-04-26 18:13:22 +02:00
parent abd6e47906
commit d8fb60f23c
91 changed files with 15291 additions and 2 deletions

View File

@ -0,0 +1,15 @@
/* Bulma Helpers */
@charset "utf-8";
@forward "aspect-ratio";
@forward "border";
@forward "color";
@forward "flexbox";
@forward "float";
@forward "gap";
@forward "overflow";
@forward "position";
@forward "spacing";
@forward "typography";
@forward "visibility";
@forward "other";

View File

@ -0,0 +1,10 @@
@use "../utilities/initial-variables" as iv;
@each $pair in iv.$aspect-ratios {
$w: nth($pair, 1);
$h: nth($pair, 2);
.#{iv.$helpers-prefix}aspect-ratio-#{$w}by#{$h} {
aspect-ratio: #{$w} / #{$h};
}
}

View File

@ -0,0 +1,15 @@
@use "../utilities/css-variables" as cv;
@use "../utilities/initial-variables" as iv;
$radii: (
"small": "radius-small",
"normal": "radius",
"large": "radius-large",
"rounded": "radius-rounded",
);
@each $name, $var in $radii {
.#{iv.$helpers-has-prefix}radius-#{$name} {
border-radius: cv.getVar($var);
}
}

View File

@ -0,0 +1,364 @@
@use "../utilities/css-variables" as cv;
@use "../utilities/derived-variables" as dv;
@use "../utilities/initial-variables" as iv;
$digits: (
"00",
"05",
"10",
"15",
"20",
"25",
"30",
"35",
"40",
"45",
"50",
"55",
"60",
"65",
"70",
"75",
"80",
"85",
"90",
"95",
"100"
);
.#{iv.$helpers-has-prefix}background {
background-color: cv.getVar("background");
}
@each $name, $color in dv.$colors {
$background: hsl(
#{cv.getVar($name, "", "-h")},
#{cv.getVar($name, "", "-s")},
calc(#{cv.getVar("background-l")} + #{cv.getVar("background-l-delta")})
);
$color: hsl(
#{cv.getVar($name, "", "-h")},
#{cv.getVar($name, "", "-s")},
calc(#{cv.getVar("color-l")} + #{cv.getVar("color-l-delta")})
);
[class*="#{iv.$helpers-prefix}color-#{$name}"],
[class*="#{iv.$helpers-has-prefix}text-#{$name}"] {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-l")},
"color-l-delta": 0%,
)
);
color: $color !important;
}
[class*="#{iv.$helpers-prefix}background-#{$name}"],
[class*="#{iv.$helpers-has-prefix}background-#{$name}"] {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-l")},
"background-l-delta": 0%,
)
);
background-color: $background !important;
}
// Invert
.#{iv.$helpers-prefix}color-#{$name}-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-invert-l")},
)
);
}
// On Scheme
.#{iv.$helpers-prefix}color-#{$name}-on-scheme,
.#{iv.$helpers-has-prefix}text-#{$name}-on-scheme {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-on-scheme-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-on-scheme,
.#{iv.$helpers-has-prefix}background-#{$name}-on-scheme {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-on-scheme-l")},
)
);
}
// Light
.#{iv.$helpers-prefix}color-#{$name}-light,
.#{iv.$helpers-has-prefix}text-#{$name}-light {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-light-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-light,
.#{iv.$helpers-has-prefix}background-#{$name}-light {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-light-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-light-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-light-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-light-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-light-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-light-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-light-invert-l")},
)
);
}
// Dark
.#{iv.$helpers-prefix}color-#{$name}-dark,
.#{iv.$helpers-has-prefix}text-#{$name}-dark {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-dark-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-dark,
.#{iv.$helpers-has-prefix}background-#{$name}-dark {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-dark-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-dark-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-dark-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-dark-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-dark-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-dark-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-dark-invert-l")},
)
);
}
// Soft/Bold
.#{iv.$helpers-prefix}color-#{$name}-soft,
.#{iv.$helpers-has-prefix}text-#{$name}-soft {
@include cv.register-vars(
(
"color-l": #{cv.getVar("soft-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-soft,
.#{iv.$helpers-has-prefix}background-#{$name}-soft {
@include cv.register-vars(
(
"background-l": #{cv.getVar("soft-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-bold,
.#{iv.$helpers-has-prefix}text-#{$name}-bold {
@include cv.register-vars(
(
"color-l": #{cv.getVar("bold-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-bold,
.#{iv.$helpers-has-prefix}background-#{$name}-bold {
@include cv.register-vars(
(
"background-l": #{cv.getVar("bold-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-soft-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-soft-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar("soft-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-soft-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-soft-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar("soft-invert-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-bold-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-bold-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar("bold-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-bold-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-bold-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar("bold-invert-l")},
)
);
}
@each $digit in $digits {
.#{iv.$helpers-prefix}color-#{$name}-#{$digit},
.#{iv.$helpers-has-prefix}text-#{$name}-#{$digit} {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-#{$digit}-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-#{$digit},
.#{iv.$helpers-has-prefix}background-#{$name}-#{$digit} {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-#{$digit}-l")},
)
);
}
.#{iv.$helpers-prefix}color-#{$name}-#{$digit}-invert,
.#{iv.$helpers-has-prefix}text-#{$name}-#{$digit}-invert {
@include cv.register-vars(
(
"color-l": #{cv.getVar($name, "", "-#{$digit}-invert-l")},
)
);
}
.#{iv.$helpers-prefix}background-#{$name}-#{$digit}-invert,
.#{iv.$helpers-has-prefix}background-#{$name}-#{$digit}-invert {
@include cv.register-vars(
(
"background-l": #{cv.getVar($name, "", "-#{$digit}-invert-l")},
)
);
}
}
// Hover
a.#{iv.$helpers-prefix}color-#{$name},
button.#{iv.$helpers-prefix}color-#{$name},
#{iv.$helpers-prefix}color-#{$name}.is-hoverable,
a.#{iv.$helpers-has-prefix}text-#{$name},
button.#{iv.$helpers-has-prefix}text-#{$name},
#{iv.$helpers-has-prefix}text-#{$name}.is-hoverable {
&:hover,
&:focus-visible {
@include cv.register-vars(
(
"color-l-delta": #{cv.getVar("hover-color-l-delta")},
)
);
}
&:active {
@include cv.register-vars(
(
"color-l-delta": #{cv.getVar("active-color-l-delta")},
)
);
}
}
a.#{iv.$helpers-prefix}background-#{$name},
button.#{iv.$helpers-prefix}background-#{$name},
#{iv.$helpers-prefix}background-#{$name}.is-hoverable,
a.#{iv.$helpers-has-prefix}background-#{$name},
button.#{iv.$helpers-has-prefix}background-#{$name},
#{iv.$helpers-has-prefix}background-#{$name}.is-hoverable {
&:hover,
&:focus-visible {
@include cv.register-vars(
(
"background-l-delta": #{cv.getVar("hover-background-l-delta")},
)
);
}
&:active {
@include cv.register-vars(
(
"background-l-delta": #{cv.getVar("active-background-l-delta")},
)
);
}
}
// Palettes
.#{iv.$helpers-prefix}palette-#{$name} {
--h: #{cv.getVar($name, "", "-h")};
--s: #{cv.getVar($name, "", "-s")};
--l: #{cv.getVar($name, "", "-l")};
--color: hsl(var(--h), var(--s), var(--l));
@each $digit in $digits {
--#{$digit}-l: #{cv.getVar($name, "", "-#{$digit}-l")};
--color-#{$digit}: hsl(var(--h), var(--s), var(--#{$digit}-l));
}
}
}
@each $name, $shade in dv.$shades {
.#{iv.$helpers-prefix}color-#{$name},
.#{iv.$helpers-has-prefix}text-#{$name} {
color: $shade !important;
}
.#{iv.$helpers-prefix}background-#{$name},
.#{iv.$helpers-has-prefix}background-#{$name} {
background-color: $shade !important;
}
}

View File

@ -0,0 +1,62 @@
@use "../utilities/initial-variables" as iv;
$flex-direction-values: row, row-reverse, column, column-reverse;
@each $value in $flex-direction-values {
.#{iv.$helpers-prefix}flex-direction-#{$value} {
flex-direction: $value !important;
}
}
$flex-wrap-values: nowrap, wrap, wrap-reverse;
@each $value in $flex-wrap-values {
.#{iv.$helpers-prefix}flex-wrap-#{$value} {
flex-wrap: $value !important;
}
}
$justify-content-values: flex-start, flex-end, center, space-between,
space-around, space-evenly, start, end, left, right;
@each $value in $justify-content-values {
.#{iv.$helpers-prefix}justify-content-#{$value} {
justify-content: $value !important;
}
}
$align-content-values: flex-start, flex-end, center, space-between, space-around,
space-evenly, stretch, start, end, baseline;
@each $value in $align-content-values {
.#{iv.$helpers-prefix}align-content-#{$value} {
align-content: $value !important;
}
}
$align-items-values: stretch, flex-start, flex-end, center, baseline, start, end,
self-start, self-end;
@each $value in $align-items-values {
.#{iv.$helpers-prefix}align-items-#{$value} {
align-items: $value !important;
}
}
$align-self-values: auto, flex-start, flex-end, center, baseline, stretch;
@each $value in $align-self-values {
.#{iv.$helpers-prefix}align-self-#{$value} {
align-self: $value !important;
}
}
$flex-operators: grow, shrink;
@each $operator in $flex-operators {
@for $i from 0 through 5 {
.#{iv.$helpers-prefix}flex-#{$operator}-#{$i} {
flex-#{$operator}: $i !important;
}
}
}

View File

@ -0,0 +1,28 @@
@use "../utilities/initial-variables" as iv;
@use "../utilities/mixins" as mx;
.#{iv.$helpers-prefix}clearfix {
@include mx.clearfix;
}
.#{iv.$helpers-prefix}float-left,
.#{iv.$helpers-prefix}pulled-left {
float: left !important;
}
.#{iv.$helpers-prefix}float-right,
.#{iv.$helpers-prefix}pulled-right {
float: right !important;
}
.#{iv.$helpers-prefix}float-none {
float: none !important;
}
$clears: both left none right;
@each $clear in $clears {
.#{iv.$helpers-prefix}clear-#{$clear} {
clear: $clear !important;
}
}

View File

@ -0,0 +1,24 @@
@use "sass:math";
@use "sass:string";
@use "../utilities/initial-variables" as iv;
.#{iv.$helpers-prefix}gapless {
gap: 0 !important;
}
$gaps: "gap", "column-gap", "row-gap";
$gap-base: 0.5rem;
@each $gap in $gaps {
@for $i from 0 through 8 {
.#{iv.$helpers-prefix}#{$gap}-#{$i} {
#{$gap}: ($gap-base * $i) !important;
}
@if $i < 8 {
.#{iv.$helpers-prefix}#{$gap}-#{$i}\.5 {
#{$gap}: ($gap-base * $i + math.div($gap-base, 2)) !important;
}
}
}
}

View File

@ -0,0 +1,19 @@
@use "../utilities/extends";
@use "../utilities/initial-variables" as iv;
.#{iv.$helpers-prefix}radiusless {
border-radius: 0 !important;
}
.#{iv.$helpers-prefix}shadowless {
box-shadow: none !important;
}
.#{iv.$helpers-prefix}clickable {
cursor: pointer !important;
pointer-events: all !important;
}
.#{iv.$helpers-prefix}unselectable {
@extend %unselectable;
}

View File

@ -0,0 +1,21 @@
@use "../utilities/initial-variables" as iv;
.#{iv.$helpers-prefix}clipped {
overflow: hidden !important;
}
$overflows: auto clip hidden scroll visible;
@each $overflow in $overflows {
.#{iv.$helpers-prefix}overflow-#{$overflow} {
overflow: $overflow !important;
}
.#{iv.$helpers-prefix}overflow-x-#{$overflow} {
overflow-x: $overflow !important;
}
.#{iv.$helpers-prefix}overflow-y-#{$overflow} {
overflow-y: $overflow !important;
}
}

View File

@ -0,0 +1,19 @@
@use "../utilities/extends";
@use "../utilities/initial-variables" as iv;
.#{iv.$helpers-prefix}overlay,
.#{iv.$helpers-prefix}overlay {
@extend %overlay;
}
.#{iv.$helpers-prefix}relative {
position: relative !important;
}
$positions: absolute fixed relative static sticky;
@each $position in $positions {
.#{iv.$helpers-prefix}position-#{$position} {
position: $position !important;
}
}

View File

@ -0,0 +1,64 @@
@use "../utilities/initial-variables" as iv;
.marginless {
margin: 0 !important;
}
.paddingless {
padding: 0 !important;
}
$spacing-shortcuts: (
"margin": "m",
"padding": "p",
) !default;
$spacing-directions: (
"top": "t",
"right": "r",
"bottom": "b",
"left": "l",
) !default;
$spacing-horizontal: "x" !default;
$spacing-vertical: "y" !default;
$spacing-values: (
"0": 0,
"1": 0.25rem,
"2": 0.5rem,
"3": 0.75rem,
"4": 1rem,
"5": 1.5rem,
"6": 3rem,
"auto": auto,
) !default;
@each $property, $shortcut in $spacing-shortcuts {
@each $name, $value in $spacing-values {
// All directions
.#{$shortcut}-#{$name} {
#{$property}: $value !important;
}
// Cardinal directions
@each $direction, $suffix in $spacing-directions {
.#{$shortcut}#{$suffix}-#{$name} {
#{$property}-#{$direction}: $value !important;
}
}
// Horizontal axis
@if $spacing-horizontal != null {
.#{$shortcut}#{$spacing-horizontal}-#{$name} {
#{$property}-left: $value !important;
#{$property}-right: $value !important;
}
}
// Vertical axis
@if $spacing-vertical != null {
.#{$shortcut}#{$spacing-vertical}-#{$name} {
#{$property}-top: $value !important;
#{$property}-bottom: $value !important;
}
}
}
}

View File

@ -0,0 +1,168 @@
@use "../utilities/derived-variables" as dv;
@use "../utilities/initial-variables" as iv;
@use "../utilities/mixins" as mx;
@mixin typography-size($target: "") {
@each $size in dv.$sizes {
$i: index(dv.$sizes, $size);
.#{iv.$helpers-prefix}size-#{$i}#{if($target == "", "", "-" + $target)} {
font-size: $size !important;
}
}
}
@include typography-size;
@include mx.mobile {
@include typography-size("mobile");
}
@include mx.tablet {
@include typography-size("tablet");
}
@include mx.touch {
@include typography-size("touch");
}
@include mx.desktop {
@include typography-size("desktop");
}
@include mx.widescreen {
@include typography-size("widescreen");
}
@include mx.fullhd {
@include typography-size("fullhd");
}
$alignments: (
"centered": "center",
"justified": "justify",
"left": "left",
"right": "right",
);
@each $alignment, $text-align in $alignments {
.#{iv.$helpers-has-prefix}text-#{$alignment} {
text-align: #{$text-align} !important;
}
}
@each $alignment, $text-align in $alignments {
@include mx.mobile {
.#{iv.$helpers-has-prefix}text-#{$alignment}-mobile {
text-align: #{$text-align} !important;
}
}
@include mx.tablet {
.#{iv.$helpers-has-prefix}text-#{$alignment}-tablet {
text-align: #{$text-align} !important;
}
}
@include mx.tablet-only {
.#{iv.$helpers-has-prefix}text-#{$alignment}-tablet-only {
text-align: #{$text-align} !important;
}
}
@include mx.touch {
.#{iv.$helpers-has-prefix}text-#{$alignment}-touch {
text-align: #{$text-align} !important;
}
}
@include mx.desktop {
.#{iv.$helpers-has-prefix}text-#{$alignment}-desktop {
text-align: #{$text-align} !important;
}
}
@include mx.desktop-only {
.#{iv.$helpers-has-prefix}text-#{$alignment}-desktop-only {
text-align: #{$text-align} !important;
}
}
@include mx.widescreen {
.#{iv.$helpers-has-prefix}text-#{$alignment}-widescreen {
text-align: #{$text-align} !important;
}
}
@include mx.widescreen-only {
.#{iv.$helpers-has-prefix}text-#{$alignment}-widescreen-only {
text-align: #{$text-align} !important;
}
}
@include mx.fullhd {
.#{iv.$helpers-has-prefix}text-#{$alignment}-fullhd {
text-align: #{$text-align} !important;
}
}
}
.#{iv.$helpers-prefix}capitalized {
text-transform: capitalize !important;
}
.#{iv.$helpers-prefix}lowercase {
text-transform: lowercase !important;
}
.#{iv.$helpers-prefix}uppercase {
text-transform: uppercase !important;
}
.#{iv.$helpers-prefix}italic {
font-style: italic !important;
}
.#{iv.$helpers-prefix}underlined {
text-decoration: underline !important;
}
.#{iv.$helpers-has-prefix}text-weight-light {
font-weight: iv.$weight-light !important;
}
.#{iv.$helpers-has-prefix}text-weight-normal {
font-weight: iv.$weight-normal !important;
}
.#{iv.$helpers-has-prefix}text-weight-medium {
font-weight: iv.$weight-medium !important;
}
.#{iv.$helpers-has-prefix}text-weight-semibold {
font-weight: iv.$weight-semibold !important;
}
.#{iv.$helpers-has-prefix}text-weight-bold {
font-weight: iv.$weight-bold !important;
}
.#{iv.$helpers-prefix}family-primary {
font-family: dv.$family-primary !important;
}
.#{iv.$helpers-prefix}family-secondary {
font-family: dv.$family-secondary !important;
}
.#{iv.$helpers-prefix}family-sans-serif {
font-family: iv.$family-sans-serif !important;
}
.#{iv.$helpers-prefix}family-monospace {
font-family: iv.$family-monospace !important;
}
.#{iv.$helpers-prefix}family-code {
font-family: dv.$family-code !important;
}

View File

@ -0,0 +1,221 @@
@use "../utilities/initial-variables" as iv;
@use "../utilities/mixins" as mx;
.#{iv.$helpers-prefix}display-none,
.#{iv.$helpers-prefix}hidden {
display: none !important;
}
$displays: block flex inline inline-block inline-flex grid;
@each $display in $displays {
.#{iv.$helpers-prefix}display-#{$display},
.#{iv.$helpers-prefix}#{$display} {
display: $display !important;
}
@include mx.mobile {
.#{iv.$helpers-prefix}display-#{$display}-mobile,
.#{iv.$helpers-prefix}#{$display}-mobile {
display: $display !important;
}
}
@include mx.tablet {
.#{iv.$helpers-prefix}display-#{$display}-tablet,
.#{iv.$helpers-prefix}#{$display}-tablet {
display: $display !important;
}
}
@include mx.tablet-only {
.#{iv.$helpers-prefix}display-#{$display}-tablet-only,
.#{iv.$helpers-prefix}#{$display}-tablet-only {
display: $display !important;
}
}
@include mx.touch {
.#{iv.$helpers-prefix}display-#{$display}-touch,
.#{iv.$helpers-prefix}#{$display}-touch {
display: $display !important;
}
}
@include mx.desktop {
.#{iv.$helpers-prefix}display-#{$display}-desktop,
.#{iv.$helpers-prefix}#{$display}-desktop {
display: $display !important;
}
}
@include mx.desktop-only {
.#{iv.$helpers-prefix}display-#{$display}-desktop-only,
.#{iv.$helpers-prefix}#{$display}-desktop-only {
display: $display !important;
}
}
@include mx.widescreen {
.#{iv.$helpers-prefix}display-#{$display}-widescreen,
.#{iv.$helpers-prefix}#{$display}-widescreen {
display: $display !important;
}
}
@include mx.widescreen-only {
.#{iv.$helpers-prefix}display-#{$display}-widescreen-only,
.#{iv.$helpers-prefix}#{$display}-widescreen-only {
display: $display !important;
}
}
@include mx.fullhd {
.#{iv.$helpers-prefix}display-#{$display}-fullhd,
.#{iv.$helpers-prefix}#{$display}-fullhd {
display: $display !important;
}
}
}
.#{iv.$helpers-prefix}sr-only {
border: none !important;
clip: rect(0, 0, 0, 0) !important;
height: 0.01em !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
width: 0.01em !important;
}
@include mx.mobile {
.#{iv.$helpers-prefix}display-none-mobile,
.#{iv.$helpers-prefix}hidden-mobile {
display: none !important;
}
}
@include mx.tablet {
.#{iv.$helpers-prefix}display-none-tablet,
.#{iv.$helpers-prefix}hidden-tablet {
display: none !important;
}
}
@include mx.tablet-only {
.#{iv.$helpers-prefix}display-none-tablet-only,
.#{iv.$helpers-prefix}hidden-tablet-only {
display: none !important;
}
}
@include mx.touch {
.#{iv.$helpers-prefix}display-none-touch,
.#{iv.$helpers-prefix}hidden-touch {
display: none !important;
}
}
@include mx.desktop {
.#{iv.$helpers-prefix}display-none-desktop,
.#{iv.$helpers-prefix}hidden-desktop {
display: none !important;
}
}
@include mx.desktop-only {
.#{iv.$helpers-prefix}display-none-desktop-only,
.#{iv.$helpers-prefix}hidden-desktop-only {
display: none !important;
}
}
@include mx.widescreen {
.#{iv.$helpers-prefix}display-none-widescreen,
.#{iv.$helpers-prefix}hidden-widescreen {
display: none !important;
}
}
@include mx.widescreen-only {
.#{iv.$helpers-prefix}display-none-widescreen-only,
.#{iv.$helpers-prefix}hidden-widescreen-only {
display: none !important;
}
}
@include mx.fullhd {
.#{iv.$helpers-prefix}display-none-fullhd,
.#{iv.$helpers-prefix}hidden-fullhd {
display: none !important;
}
}
.#{iv.$helpers-prefix}visibility-hidden,
.#{iv.$helpers-prefix}invisible {
visibility: hidden !important;
}
@include mx.mobile {
.#{iv.$helpers-prefix}visibility-hidden-mobile,
.#{iv.$helpers-prefix}invisible-mobile {
visibility: hidden !important;
}
}
@include mx.tablet {
.#{iv.$helpers-prefix}visibility-hidden-tablet,
.#{iv.$helpers-prefix}invisible-tablet {
visibility: hidden !important;
}
}
@include mx.tablet-only {
.#{iv.$helpers-prefix}visibility-hidden-tablet-only,
.#{iv.$helpers-prefix}invisible-tablet-only {
visibility: hidden !important;
}
}
@include mx.touch {
.#{iv.$helpers-prefix}visibility-hidden-touch,
.#{iv.$helpers-prefix}invisible-touch {
visibility: hidden !important;
}
}
@include mx.desktop {
.#{iv.$helpers-prefix}visibility-hidden-desktop,
.#{iv.$helpers-prefix}invisible-desktop {
visibility: hidden !important;
}
}
@include mx.desktop-only {
.#{iv.$helpers-prefix}visibility-hidden-desktop-only,
.#{iv.$helpers-prefix}invisible-desktop-only {
visibility: hidden !important;
}
}
@include mx.widescreen {
.#{iv.$helpers-prefix}visibility-hidden-widescreen,
.#{iv.$helpers-prefix}invisible-widescreen {
visibility: hidden !important;
}
}
@include mx.widescreen-only {
.#{iv.$helpers-prefix}visibility-hidden-widescreen-only,
.#{iv.$helpers-prefix}invisible-widescreen-only {
visibility: hidden !important;
}
}
@include mx.fullhd {
.#{iv.$helpers-prefix}visibility-hidden-fullhd,
.#{iv.$helpers-prefix}invisible-fullhd {
visibility: hidden !important;
}
}