Accediendo a la configuración de la lista de temas a través de la regla @each de SCSS

Desarrollador
1

Estoy intentando acceder a una configuración de lista en un archivo yml con un operador @each SCSS pero no consigo que funcione para más de una entrada de lista. El código funciona como se espera con el valor predeterminado “” o un elemento en la lista, pero no para más.

settings.yml:

list_setting:
  type: list
  default: ""
  description: "una configuración de lista"

scss:

@each $setting in $list_setting {
  algún código de formato css con cada $setting aquí;
}

esto parece que debería ser algo sencillo, pero tan pronto como agrego más de una entrada a la lista, deja de funcionar pero sin errores. :thinking:

¿alguna sugerencia de gurús del código?

2

Conjeturas aleatorias:

No lo he probado, pero creo que la configuración de la lista está delimitada por barras |.

Es posible que $setting en tu CSS sea igual a algo|algo_mas|etc. Podrías mostrar el valor en algún atributo CSS (o JS, el valor debería ser el mismo) para estar seguro. :thinking:

2 Me gusta
3

Sí, estaba pensando en esto y me preguntaba si tengo que dividir esos valores de lista con algún script. Sospecho que está tratando varios elementos de lista como una sola cadena.:thinking:

4

btw lo resolví la semana pasada. usé una función scss separadora de cadenas

@function str-to-list($string, $separator, $startAt: 1) {
  $item: str-slice($string, $startAt);
  $list: ();
  $index: str-index($item, $separator);

  @if $index == null {
    $list: ($item);
  } @else {
    $list: (str-slice($item, 1, $index - 1));
    $list: join($list, str-to-list($item, $separator, $startAt: $index + 1));
  }

  @return $list;
}

$list: str-to-list("#{$list_setting}", "|");

@each $setting in $list {
  algún código de formato css con cada $setting aquí;
}

usándolo en estos componentes aquí:

gracias a @Don por el consejo :slight_smile:

5 Me gusta
5

:exploding_head:

Lo intenté pero no pude averiguar que esto existía, eso es genial. :clap:

2 Me gusta
6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.