beathers 5.7.2 → 5.7.5

package/scss/style/_loader.scss

@@ -1,62 +1,62 @@
-@use '../settings/index' as settings;
-@use '../variables' as vars;
-@use '../settings/defaults' as defs;
-
-// Definitions
-$useLoader: if(vars.$useLoader != null, vars.$useLoader, settings.$useLoader);
-$useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
-$useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
-$loaderColorMain: if(vars.$loaderColorMain != null, vars.$loaderColorMain, loaderColorMain.$loaderColorMain);
-$loaderColorSecond: if(vars.$loaderColorSecond != null, vars.$loaderColorSecond, defs.$loaderColorSecond);
-$loaderDuration: if(vars.$loaderDuration != null, vars.$loaderDuration, defs.$loaderDuration);
-
-@if $useLoader {
-  $colorMainLight: colors.hexToRgba(map.get($colorMain, 'light'), 0.4, 'Glass.light');
-  $colorMainDark: colors.hexToRgba(map.get($colorMain, 'dark'), 0.4, 'Glass.dark');
-  $colorSecondLight: colors.hexToRgba(map.get($colorSecond, 'light'), 0.4, 'Glass.light');
-  $colorSecondDark: colors.hexToRgba(map.get($colorSecond, 'dark'), 0.4, 'Glass.dark');
-
-  .skeleton {
-    $skeletonsVariants: (
-      'rounded': 8px,
-      'sharp': unset,
-      'circle': 100vw,
-      'square': 5px,
-      'text': 3px,
-    ) !default;
-
-    display: inline-block;
-    background: linear-gradient(
-      110deg,
-      var(--skeleton-main-color, $colorMainLight) 0%,
-      var(--skeleton-second-color, $colorSecondLight) 30%,
-      var(--skeleton-second-color, $colorSecondLight) 30%,
-      var(--skeleton-main-color, $colorMainLight) 100%
-    );
-    background-size: 200% 100%;
-    animation: var(--skeleton-duration, $loaderDuration) shine linear infinite;
-
-    @each $variant, $radius in $skeletonsVariants {
-      &.#{$variant} {
-        border-radius: $radius;
-        aspect-ratio: if($variant == 'circle' or $variant == 'square', 1, unset);
-      }
-    }
-
-    .dark & {
-      background: linear-gradient(
-        110deg,
-        var(--skeleton-main-color, $colorMainDark) 0%,
-        var(--skeleton-second-color, $colorSecondDark) 30%,
-        var(--skeleton-second-color, $colorSecondDark) 30%,
-        var(--skeleton-main-color, $colorMainDark) 100%
-      );
-    }
-
-    @keyframes shine {
-      to {
-        background-position-x: -200%;
-      }
-    }
-  }
-}
+@use '../settings/index' as settings;
+@use '../variables' as vars;
+@use '../settings/defaults' as defs;
+
+// Definitions
+$useLoader: if(vars.$useLoader != null, vars.$useLoader, settings.$useLoader);
+$useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
+$useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
+$loaderColorMain: if(vars.$loaderColorMain != null, vars.$loaderColorMain, defs.$loaderColorMain);
+$loaderColorSecond: if(vars.$loaderColorSecond != null, vars.$loaderColorSecond, defs.$loaderColorSecond);
+$loaderDuration: if(vars.$loaderDuration != null, vars.$loaderDuration, defs.$loaderDuration);
+
+@if $useLoader {
+  $colorMainLight: colors.hexToRgba(map.get($colorMain, 'light'), 0.4, 'Glass.light');
+  $colorMainDark: colors.hexToRgba(map.get($colorMain, 'dark'), 0.4, 'Glass.dark');
+  $colorSecondLight: colors.hexToRgba(map.get($colorSecond, 'light'), 0.4, 'Glass.light');
+  $colorSecondDark: colors.hexToRgba(map.get($colorSecond, 'dark'), 0.4, 'Glass.dark');
+
+  .skeleton {
+    $skeletonsVariants: (
+      'rounded': 8px,
+      'sharp': unset,
+      'circle': 100vw,
+      'square': 5px,
+      'text': 3px,
+    ) !default;
+
+    display: inline-block;
+    background: linear-gradient(
+      110deg,
+      var(--skeleton-main-color, $colorMainLight) 0%,
+      var(--skeleton-second-color, $colorSecondLight) 30%,
+      var(--skeleton-second-color, $colorSecondLight) 30%,
+      var(--skeleton-main-color, $colorMainLight) 100%
+    );
+    background-size: 200% 100%;
+    animation: var(--skeleton-duration, $loaderDuration) shine linear infinite;
+
+    @each $variant, $radius in $skeletonsVariants {
+      &.#{$variant} {
+        border-radius: $radius;
+        aspect-ratio: if($variant == 'circle' or $variant == 'square', 1, unset);
+      }
+    }
+
+    .dark & {
+      background: linear-gradient(
+        110deg,
+        var(--skeleton-main-color, $colorMainDark) 0%,
+        var(--skeleton-second-color, $colorSecondDark) 30%,
+        var(--skeleton-second-color, $colorSecondDark) 30%,
+        var(--skeleton-main-color, $colorMainDark) 100%
+      );
+    }
+
+    @keyframes shine {
+      to {
+        background-position-x: -200%;
+      }
+    }
+  }
+}

package/scss/style/_resets.scss

@@ -1,168 +1,168 @@
-@use '../settings/configs' as configs;
-@use '../settings/defaults' as defs;
-@use '../variables' as vars;
-@use '../functions/colors' as colors;
-@use '../settings/index' as settings;
-
-// Definitions
-$defaultFontFamilies: if(vars.$defaultFontFamilies != null, vars.$defaultFontFamilies, defs.$defaultFontFamilies);
-$useColors: if(vars.$useColors != null, vars.$useColors, settings.$useColors);
-$useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
-$useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
-
-html {
-  scroll-behavior: smooth;
-  interpolate-size: allow-keywords;
-}
-
-body {
-  position: relative;
-  font-family: 'regular', $defaultFontFamilies;
-  overflow-x: hidden;
-}
-
-*,
-::before,
-::after {
-  font-family: 'regular', $defaultFontFamilies;
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-input,
-textarea,
-select,
-button,
-kbd,
-samp,
-table,
-table *,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-family: inherit;
-}
-
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-fieldset {
-  border: 0;
-  margin: 0;
-  padding: 0;
-}
-
-legend {
-  padding: 0;
-}
-
-details {
-  display: block;
-}
-
-summary {
-  display: list-item;
-}
-
-img,
-video,
-svg {
-  max-width: 100%;
-  height: auto;
-  display: block;
-}
-
-ul {
-  margin: unset;
-  list-style: none;
-  padding: 0;
-
-  li {
-    margin-bottom: unset;
-  }
-}
-
-hr {
-  border: 0;
-  height: 1px;
-  background: currentColor;
-}
-
-p,
-figure,
-blockquote,
-dl,
-dd {
-  margin: 0;
-}
-
-a {
-  text-decoration: unset;
-}
-
-@if $useColors {
-  @if $useColorsLightMode {
-    .light::selection {
-      background-color: colors.useColorWithMap('third');
-      color: colors.useColorWithMap('black');
-    }
-  }
-  @if $useColorsDarkMode {
-    .dark::selection {
-      background-color: colors.useColorWithMap('third', 'dark');
-      color: colors.useColorWithMap('white');
-    }
-  }
-}
-
-::-webkit-scrollbar {
-  width: 6px;
-
-  &-track {
-    background-color: transparent;
-    border-radius: unset;
-  }
-  &-thumb {
-    border-radius: 100vw;
-  }
-}
-@if $useColors {
-  @if $useColorsLightMode {
-    .light::-webkit-scrollbar-thumb {
-      background: colors.useColorWithMap('third');
-    }
-  }
-  @if $useColorsDarkMode {
-    .dark::-webkit-scrollbar-thumb {
-      background: colors.useColorWithMap('third', 'dark');
-    }
-  }
-}
-
-@each $option, $properties in configs.$clearanceOptions {
-  @each $property, $value in $properties {
-    .i\:#{$option} {
-      /* stylelint-disable declaration-no-important */
-      #{$property}: $value !important;
-    }
-    .#{$option} {
-      #{$property}: $value;
-    }
-  }
-}
-
-@each $cursor in configs.$cursors {
-  .cursor#{\:}#{$cursor} {
-    cursor: #{$cursor};
-  }
-}
-
-.scroll-smooth {
-  scroll-behavior: smooth;
-}
+@use '../settings/configs' as configs;
+@use '../settings/defaults' as defs;
+@use '../variables' as vars;
+@use '../functions/colors' as colors;
+@use '../settings/index' as settings;
+
+// Definitions
+$defaultFontFamilies: if(vars.$defaultFontFamilies != null, vars.$defaultFontFamilies, defs.$defaultFontFamilies);
+$useColors: if(vars.$useColors != null, vars.$useColors, settings.$useColors);
+$useColorsLightMode: if(vars.$useColorsLightMode != null, vars.$useColorsLightMode, settings.$useColorsLightMode);
+$useColorsDarkMode: if(vars.$useColorsDarkMode != null, vars.$useColorsDarkMode, settings.$useColorsDarkMode);
+
+html {
+  scroll-behavior: smooth;
+  interpolate-size: allow-keywords;
+}
+
+body {
+  position: relative;
+  font-family: 'regular', $defaultFontFamilies;
+  overflow-x: hidden;
+}
+
+*,
+::before,
+::after {
+  font-family: 'regular', $defaultFontFamilies;
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+input,
+textarea,
+select,
+button,
+kbd,
+samp,
+table,
+table *,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: inherit;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+fieldset {
+  border: 0;
+  margin: 0;
+  padding: 0;
+}
+
+legend {
+  padding: 0;
+}
+
+details {
+  display: block;
+}
+
+summary {
+  display: list-item;
+}
+
+img,
+video,
+svg {
+  max-width: 100%;
+  height: auto;
+  display: block;
+}
+
+ul {
+  margin: unset;
+  list-style: none;
+  padding: 0;
+
+  li {
+    margin-bottom: unset;
+  }
+}
+
+hr {
+  border: 0;
+  height: 1px;
+  background: currentColor;
+}
+
+p,
+figure,
+blockquote,
+dl,
+dd {
+  margin: 0;
+}
+
+a {
+  text-decoration: unset;
+}
+
+@if $useColors {
+  @if $useColorsLightMode {
+    .light::selection {
+      background-color: colors.useColorWithMap('third');
+      color: colors.useColorWithMap('black');
+    }
+  }
+  @if $useColorsDarkMode {
+    .dark::selection {
+      background-color: colors.useColorWithMap('third', 'dark');
+      color: colors.useColorWithMap('white');
+    }
+  }
+}
+
+::-webkit-scrollbar {
+  width: 6px;
+
+  &-track {
+    background-color: transparent;
+    border-radius: unset;
+  }
+  &-thumb {
+    border-radius: 100vw;
+  }
+}
+@if $useColors {
+  @if $useColorsLightMode {
+    .light::-webkit-scrollbar-thumb {
+      background: colors.useColorWithMap('third');
+    }
+  }
+  @if $useColorsDarkMode {
+    .dark::-webkit-scrollbar-thumb {
+      background: colors.useColorWithMap('third', 'dark');
+    }
+  }
+}
+
+@each $option, $properties in configs.$clearanceOptions {
+  @each $property, $value in $properties {
+    .i\:#{$option} {
+      /* stylelint-disable declaration-no-important */
+      #{$property}: $value !important;
+    }
+    .#{$option} {
+      #{$property}: $value;
+    }
+  }
+}
+
+@each $cursor in configs.$cursors {
+  .cursor#{\:}#{$cursor} {
+    cursor: #{$cursor};
+  }
+}
+
+.scroll-smooth {
+  scroll-behavior: smooth;
+}