6

Оригинальный кейс. Если нужно, то я добавлю map для полной картины, хотя я не вижу в этом смысла.

@each $name, $str in $icomoon {
    [class^="icon-#{$name}"]:before, [class*="icon-#{$name}"]:before {
        content: unquote("\"") + unquote(str-insert($str, "\\", 1)) + unquote("\"");
    }
}

Результат: content: "\hey";

  1. В этом случае я использую вокруг интерполяции " ".

    scss

    content: "#{unquote(str-insert(hey, "\\", 1))}";
    

    css

    content: "\\hey";
    
  2. Противоположный случай

    scss

    content: #{unquote(str-insert(hey, "\\", 1))};
    

    css

    content: \hey;
    

Смущает, что в основном кейсе нужно использовать метод unquote ради интерполяции.

2
  • я не совсем понял вопрос: в чем именно он заключается? какой результат в итоге ты хочешь получить?
    – Grundy
    23 ноя 2017 в 10:32
  • как в основном кейсе, но меня смущает, что для скобочек нужно задействовать 2 раза метод unquote 24 ноя 2017 в 22:27

1 ответ 1

1

Код приведённый в оригинальном кейсе показался мне довольно громоздким. Потому как unquote удаляет кавычки из строки.

Если вы ищите более простой вариант и хотите избавится от частого использования фукнции unquote посмотрите на код ниже:

$icomoon: (
  icon-hey: hey
);

@each $name, $str in $icomoon {
  [class^="icon-#{$name}"]:before, [class*="icon-#{$name}"]:before {
    content: #{'"\\' + $str + '"'};
  }
}
1
  • спасибо за простой вариант, но меня больше гложет, почему так происходит у меня в примере) 10 окт 2018 в 18:24

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.