@design-factory/styles 21.0.0-next.0 → 21.0.0

package/scss/utilities/_common.utilities.scss

@@ -1,98 +0,0 @@
-@use 'sass:color';
-@use 'sass:map';
-@use 'sass:math';
-@use 'sass:string';
-@use 'sass:list';
-@use 'sass:meta';
-@import 'rgb';
-
-// This function currently change all the colors #ffffff #bbbbbb and #cccccc (that you should put in the svg) by the one given in input
-// I put f for fill value.
-@function df-getSVGasURL($svg, $fig-color, $border-color, $background-color) {
-  //add
-  //TODO add end of line and multiple space replacing...
-  $ret: str-replace($svg, '#bbbbbb', $border-color);
-  $ret: str-replace($ret, '#cccccc', $background-color);
-  $ret: str-replace($ret, '#ffffff', $fig-color);
-  $ret: str-replace($ret, '#', '%23');
-  $ret: str-replace($ret, '<', '%3C');
-  $ret: str-replace($ret, '>', '%3E');
-  @return url('data:image/svg+xml;charset=utf8,' + $ret);
-}
-
-//Default values
-$df-size-ratios: (
-  'sm': 0.875,
-  'md': 1,
-  'lg': 1.125,
-  'xl': 1.25
-) !default;
-
-$df-sizing-ratios: (
-  'sm': 0.7,
-  'lg': 1.9,
-  'xl': 1.9
-) !default;
-
-$df-box-shadow-transparent-amount: 0.8 !default;
-$df-box-shadow-color: #000 !default; // should be the same as $black
-
-$df-box-shadow: 0px 4px 8px 0px
-  color.adjust(
-    $color: $df-box-shadow-color,
-    $alpha: - $df-box-shadow-transparent-amount
-  ) !default;
-
-@function rgba-css-var($identifier, $target) {
-  @if not list.index(neutral primary danger warning success info tip accent chromatic1 chromatic2, $identifier) {
-    @error "#{$identifier} not managed, called with #{$target}";
-  }
-  @if $target == 'focus-ring' or $target == 'border' {
-    @return var(--df-color-#{$identifier}-main-default-border);
-  }
-  @if $target == 'text' {
-    @return var(--df-color-#{$identifier}-alt-default-foreground);
-  } @else {
-    @return var(--df-color-#{$identifier}-main-default-background);
-  }
-}
-
-@function color-contrast(
-  $background,
-  $color-contrast-dark: $color-contrast-dark,
-  $color-contrast-light: $color-contrast-light,
-  $min-contrast-ratio: $min-contrast-ratio
-) {
-  @if meta.type-of($background) != color {
-    @return str-replace($background, ')', '-color)');
-  }
-  $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;
-  $max-ratio: 0;
-  $max-ratio-color: null;
-
-  @each $color in $foregrounds {
-    $contrast-ratio: contrast-ratio($background, $color);
-    @if $contrast-ratio > $min-contrast-ratio {
-      @return $color;
-    } @else if $contrast-ratio > $max-ratio {
-      $max-ratio: $contrast-ratio;
-      $max-ratio-color: $color;
-    }
-  }
-
-  @warn "Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...";
-
-  @return $max-ratio-color;
-}
-
-$df-size-ratios-font: (
-  'sm': var(--df-typo-sizing-small),
-  'lg': var(--df-typo-sizing-large),
-  'md': var(--df-typo-sizing-default),
-  'xl': var(--df-typo-sizing-2xlarge)
-) !default;
-
-// TODO consider fully removing this function to use the bs class fs- instead
-@function get-font-sizing($extension, $ratio, $font-size-to-scale: $font-size-base, $body: false) {
-  @return map.get($df-size-ratios-font, $extension);
-}

package/scss/utilities/_form.mixins.scss

@@ -1,26 +0,0 @@
-$df-check-label-adjust-padding-left: 0.125rem !default;
-// mixins for radio and checkbox position
-@mixin df-checkboxradio-pos($df-margin-bottom) {
-  display: inline-block;
-  position: relative;
-  &:not(.col-form-label) {
-    margin-bottom: $df-margin-bottom;
-  }
-  @include ltr {
-    padding-left: calc($form-check-padding-start + $df-check-label-adjust-padding-left); // add
-    margin-left: -$form-check-padding-start; // add
-  }
-
-  @include rtl {
-    padding-right: calc($form-check-padding-start + $df-check-label-adjust-padding-left); // add
-    margin-right: -$form-check-padding-start; // add
-  }
-
-  &::before {
-    // add
-    position: absolute; // idem as custom-control-input from bootstrap to hide the browser input (mandatory)
-    top: 50%; // New trick to use to center the icon with the title (works
-    // with the transform on the element and display: inline-block, position: relative on the parent)
-    transform: translateY(-50%);
-  }
-}

package/scss/utilities/_rgb.scss

@@ -1,10 +0,0 @@
-@use 'sass:meta';
-@use 'sass:color';
-
-// Override functions from BS
-@function to-rgb($value) {
-  @if meta.type-of($value) != color {
-    @return str-replace($value, ')', '-rgb)');
-  }
-  @return color.red($value), color.green($value), color.blue($value);
-}