HBM/md-components

/* https://material.google.com/style/color.html#color-color-palette */

$text-colors: (
  Black: (
    Text: rgba(0, 0, 0, 0.87),
    Secondary Text: rgba(0, 0, 0, 0.54),
    Icons: rgba(0, 0, 0, 0.54),
    Disabled: rgba(0, 0, 0, 0.38),
    Hint Text: rgba(0, 0, 0, 0.38),
    Dividers: rgba(0, 0, 0, 0.12),
  ),
  White: (
    Text: #fff,
    Secondary Text: rgba(255, 255, 255, 0.7),
    Icons: #fff,
    Disabled: rgba(255, 255, 255, 0.5),
    Hint Text: rgba(255, 255, 255, 0.5),
    Dividers: rgba(255, 255, 255, 0.12),
  ),
);

@function text-color($color, $type: Text) {
  $colorMap: map-get($text-colors, $color);

  @return map-get($colorMap, $type);
}

$color-primary: #1b325f;
$color-primary-text: White;

$color-primary--dark: #303f9f;
$color-primary-text--dark: White;

$color-primary--light: #e8eaf6;
$color-primary-text--light: Black;

/* from Pink pallete */
$color-accent: #e91e63;
$color-accent-text: White;

$color-accent--dark: #c2185b;
$color-accent-text--dark: White;

$color-accent--light: #f8bbd0;
$color-accent-text--light: Black;

$color-textfield-input: #333;
$color-textfield-label: rgba($color-primary, 0.6);
$color-textfield-label--floatup: rgba($color-primary, 0.6);
$color-textfield-error: rgb(244, 67, 54);
$color-textfield-border: text-color(Black, Dividers);
$color-textfield-border--focus: $color-primary;
$color-textfield-input--focus: $color-primary;
$color-textfield-input--disabled: rgba($color-primary, 0.6);
$color-textfield-border--disabled: rgba($color-primary, 0.3);
$color-textfield-charcounter: rgba($color-primary, 0.6);
$color-textfield-suffix: gray;

/* deprecated */
$blue-dark: $color-primary;
$black-012: text-color(Black, Dividers);
$black-026: text-color(Black, Hint);
$black-054: text-color(Black, Icons);