@luizleon/sf.prefeiturasp.vuecomponents 0.0.19 → 0.0.21

package/src/style/src/_functions.scss

@@ -1,171 +0,0 @@
-@use "sass:color";
-
-@function alpha($color, $opacity) {
-  $color-h: unquote("var(#{$color + -color-h})");
-  $color-s: unquote("var(#{$color + -color-s})");
-  $color-l: unquote("var(#{$color + -color-l})");
-  @return hsla($color-h, $color-s, $color-l, $opacity);
-}
-
-@function str-replace($string, $search, $replace: "") {
-  $index: str-index($string, $search);
-
-  @if $index {
-    @return str-slice($string, 1, $index - 1) + $replace +
-      str-replace(
-        str-slice($string, $index + str-length($search)),
-        $search,
-        $replace
-      );
-  }
-
-  @return $string;
-}
-
-@function tetradColor($color) {
-  $hue: hue($color);
-  $saturation: saturation($color);
-  $lightness: lightness($color);
-  $tetrad: (
-    hsl($hue, $saturation, $lightness),
-    hsl($hue + 90 % 360, $saturation, $lightness),
-    hsl($hue + 180 % 360, $saturation, $lightness),
-    hsl($hue + 270 % 360, $saturation, $lightness)
-  );
-  @return $tetrad;
-}
-
-@function multiplyColor($fore, $back) {
-  $red: calc(red($back) * red($fore) / 255);
-  $green: calc(green($back) * green($fore) / 255);
-  $blue: calc(blue($back) * blue($fore) / 255);
-  @return rgb($red, $green, $blue);
-}
-
-@function makeColorPalette($color) {
-  $light: #fff;
-  $dark: multiplyColor($color, $color);
-  $tetrad: tetradColor($color);
-  $palette: (
-    "": mix($light, $color, 0%),
-    "-50": mix($light, $color, 88%),
-    "-100": mix($light, $color, 70%),
-    "-200": mix($light, $color, 50%),
-    "-300": mix($light, $color, 30%),
-    "-400": mix($light, $color, 15%),
-    "-500": mix($light, $color, 0%),
-    "-600": mix($dark, $color, 13%),
-    "-700": mix($dark, $color, 30%),
-    "-800": mix($dark, $color, 46%),
-    "-900": mix($dark, $color, 75%),
-  );
-  @return $palette;
-}
-
-@function themeColors($dark: false) {
-  $bg: #fff;
-  $text: #334d5c;
-  $primary: #3f51b5;
-  $info: #2196f3;
-  $success: #4caf50;
-  $warn: #cbb701;
-  $help: #673ab7;
-  $error: #f44336;
-  $secondary: #607d8b;
-  $disabled: #c4c4c4;
-  $primary-hover: rgba(color.scale($primary, $lightness: 70%), 0.5);
-  $info-hover: rgba(color.scale($info, $lightness: 70%), 0.5);
-  $success-hover: rgba(color.scale($success, $lightness: 70%), 0.5);
-  $warn-hover: rgba(color.scale($warn, $lightness: 70%), 0.5);
-  $help-hover: rgba(color.scale($help, $lightness: 70%), 0.5);
-  $error-hover: rgba(color.scale($error, $lightness: 70%), 0.5);
-  $secondary-hover: rgba(color.scale($secondary, $lightness: 70%), 0.5);
-  $surface: #fafafd;
-  $surface-100: color.scale($surface, $lightness: -1%);
-  $surface-200: color.scale($surface, $lightness: -3%);
-  $surface-300: color.scale($surface, $lightness: -5%);
-  $surface-400: color.scale($surface, $lightness: -7%);
-  $surface-500: color.scale($surface, $lightness: -9%);
-  $surface-600: color.scale($surface, $lightness: -11%);
-  $surface-700: color.scale($surface, $lightness: -13%);
-  $surface-800: color.scale($surface, $lightness: -15%);
-  $surface-900: color.scale($surface, $lightness: -17%);
-  $surface-1000: color.scale($surface, $lightness: -19%);
-  $surface-1100: color.scale($surface, $lightness: -22%);
-  $surface-1200: color.scale($surface, $lightness: -24%);
-  $surface-1300: color.scale($surface, $lightness: -26%);
-  $surface-border: $surface-800;
-  $maskbg: color.adjust($text, $alpha: -0.2);
-
-  @if ($dark) {
-    $bg: hsl(215, 69%, 9%);
-    $text: #cfd8dc;
-    $primary: color.scale($primary, $lightness: 35%);
-    $info: color.scale($info, $lightness: 22.5%);
-    $success: color.scale($success, $lightness: 22.5%);
-    $warn: color.scale($warn, $lightness: 22.5%);
-    $help: color.scale($help, $lightness: 35%);
-    $error: color.scale($error, $lightness: 22.5%);
-    $secondary: color.scale($secondary, $lightness: 22.5%);
-    $disabled: #576374;
-    $primary-hover: rgba(color.scale($primary, $lightness: -70%), 0.5);
-    $info-hover: rgba(color.scale($info, $lightness: -70%), 0.5);
-    $success-hover: rgba(color.scale($success, $lightness: -70%), 0.5);
-    $warn-hover: rgba(color.scale($warn, $lightness: -70%), 0.5);
-    $help-hover: rgba(color.scale($help, $lightness: -70%), 0.5);
-    $error-hover: rgba(color.scale($error, $lightness: -70%), 0.5);
-    $secondary-hover: rgba(color.scale($secondary, $lightness: -70%), 0.5);
-    $surface-100: color.scale($bg, $lightness: 2%);
-    $surface-200: color.scale($bg, $lightness: 4%);
-    $surface-300: color.scale($bg, $lightness: 6%);
-    $surface-400: color.scale($bg, $lightness: 8%);
-    $surface-500: color.scale($bg, $lightness: 10%);
-    $surface-600: color.scale($bg, $lightness: 12%);
-    $surface-700: color.scale($bg, $lightness: 14%);
-    $surface-800: color.scale($bg, $lightness: 16%);
-    $surface-900: color.scale($bg, $lightness: 18%);
-    $surface-1000: color.scale($bg, $lightness: 20%);
-    $surface-1100: color.scale($bg, $lightness: 22%);
-    $surface-1200: color.scale($bg, $lightness: 24%);
-    $surface-1300: color.scale($bg, $lightness: 26%);
-    $surface-border: $surface-800;
-    $maskbg: color.adjust($surface-600, $alpha: -0.4);
-  }
-
-  $v: (
-    "--bg": $bg,
-    "--text": $text,
-    "--primary": $primary,
-    "--info": $info,
-    "--success": $success,
-    "--warn": $warn,
-    "--help": $help,
-    "--error": $error,
-    "--secondary": $secondary,
-    "--disabled": $disabled,
-    "--primary-hover": $primary-hover,
-    "--info-hover": $info-hover,
-    "--success-hover": $success-hover,
-    "--warn-hover": $warn-hover,
-    "--help-hover": $help-hover,
-    "--error-hover": $error-hover,
-    "--secondary-hover": $secondary-hover,
-    "--surface-100": $surface-100,
-    "--surface-200": $surface-200,
-    "--surface-300": $surface-300,
-    "--surface-400": $surface-400,
-    "--surface-500": $surface-500,
-    "--surface-600": $surface-600,
-    "--surface-700": $surface-700,
-    "--surface-800": $surface-800,
-    "--surface-900": $surface-900,
-    "--surface-1000": $surface-1000,
-    "--surface-1100": $surface-1100,
-    "--surface-1200": $surface-1200,
-    "--surface-1300": $surface-1300,
-    "--surface-border": $surface-border,
-    "--maskbg": $maskbg,
-  );
-
-  @return $v;
-}

package/src/style/src/_gap.scss

@@ -1,8 +0,0 @@
-$space-scales: 0, 0.25, 0.5, 1, 1.5, 2, 3, 4, 5;
-$gap-properties: (
-  "gap": "gap",
-  "row-gap": "row-gap",
-  "column-gap": "column-gap",
-);
-
-@include spacing-class("", $gap-properties, $space-scales);

package/src/style/src/_grid.scss

@@ -1,100 +0,0 @@
-.#{$prefix}grid {
-  display: flex;
-  flex-wrap: wrap;
-  margin-right: -1 * $gutter;
-  margin-left: -1 * $gutter;
-  margin-top: -1 * $gutter;
-}
-
-.#{$prefix}grid > #{$prefix}.col,
-.#{$prefix}grid > [class*="#{$prefix}col"] {
-  box-sizing: border-box;
-}
-
-.#{$prefix}grid-nogutter {
-  margin-right: 0;
-  margin-left: 0;
-  margin-top: 0;
-}
-
-.#{$prefix}grid-nogutter > .#{$prefix}col,
-.#{$prefix}grid-nogutter > [class*="#{$prefix}col-"] {
-  padding: 0;
-}
-
-.#{$prefix}col {
-  flex-grow: 1;
-  flex-basis: 0;
-  padding: $gutter;
-}
-
-.#{$prefix}col-fixed {
-  flex: 0 0 auto;
-  padding: $gutter;
-}
-
-$grid-columns: (
-  "col-1": 8.3333%,
-  "col-2": 16.6667%,
-  "col-3": 25%,
-  "col-4": 33.3333%,
-  "col-5": 41.6667%,
-  "col-6": 50%,
-  "col-7": 58.3333%,
-  "col-8": 66.6667%,
-  "col-9": 75%,
-  "col-10": 83.3333%,
-  "col-11": 91.6667%,
-  "col-12": 100%,
-);
-
-$grid-column-offsets: (
-  "col-offset-0": 0,
-  "col-offset-1": 8.3333%,
-  "col-offset-2": 16.6667%,
-  "col-offset-3": 25%,
-  "col-offset-4": 33.3333%,
-  "col-offset-5": 41.6667%,
-  "col-offset-6": 50%,
-  "col-offset-7": 58.3333%,
-  "col-offset-8": 66.6667%,
-  "col-offset-9": 75%,
-  "col-offset-10": 83.3333%,
-  "col-offset-11": 91.6667%,
-  "col-offset-12": 100%,
-);
-
-@each $col, $width in $grid-columns {
-  .#{$prefix}#{$col} {
-    flex: 0 0 auto;
-    padding: $gutter;
-    width: #{$width};
-  }
-}
-
-@each $key, $val in $breakpoints {
-  @media screen and (min-width: #{$val}) {
-    .#{$key + $separator} {
-      &#{$prefix}col {
-        flex-grow: 1;
-        flex-basis: 0;
-        padding: $gutter;
-      }
-
-      &#{$prefix}col-fixed {
-        flex: 0 0 auto;
-        padding: $gutter;
-      }
-
-      @each $col, $width in $grid-columns {
-        &#{$prefix}#{$col} {
-          flex: 0 0 auto;
-          padding: $gutter;
-          width: #{$width};
-        }
-      }
-    }
-  }
-}
-
-@include style-class("margin-left", $grid-column-offsets, true);