vendredi 1 mai 2020

Is there a way to understand if a SASS variable is a valid color?

I would like to know if a variable is a valid color in a SASS function. This is the first code I wrote, so I check if the variable is initialised.

@function get-valid-color($color) {
  @if variable-exists($color) {
    @return $color;
  } @else {
    @return inherit;
  }
}

I would like to understand also if the variable is a valid color or not. Only in that case I would return the variable, otherwise I would return inherit.

This the expected output:

  $primary-text = red;
  $primary-bg = #000000;
  $border-width = 4px;

  color: get-color($border-width);           // color: inherit;
  background-color: get-color($primary-bg);  // background-color: #000000;
  color: get-color($primary-text);           // color: red;
  color: get-color($fake-variable);          // color: inherit

Ideas, thanks.

Aucun commentaire:

Enregistrer un commentaire