Как установить глобальное / стандартное семейство шрифтов без универсальных селекторов? - PullRequest
Новая
       77

Как установить глобальное / стандартное семейство шрифтов без универсальных селекторов?

0 голосов
/ 11 марта 2020

Я в загадке: требуется правило stylelint "selector-max-universal": 0, и в то же время мне нужно предоставить семейство шрифтов по умолчанию для текстовых элементов в определенном классе.

Поэтому я не могу использовать это: 

* { font-family: Somefont; }

И, в то же время, проверка кода попросила меня не использовать такие селекторы (S CSS mixin): 

@mixin setGlobalFontFamily($family: Somefont) {
  button,
  div,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  label,
  p {
    font-family: $family, sans-serif;
  }
}

// fonts are specific to certain classes 
.theme-a {
   @include setGlobalFontFamily;
}

.theme-b {
   @include setGlobalFontFamily(Roboto);
}

//.theme-...

Классы тем условно применяются через JS к элементу контейнера, например: 

<body>
  <section class="theme-b">
  </section>
</body>

Кроме того, эти семейства шрифтов должны быть заданы глобально в одном файле и только один раз для каждого класса темы, гарантируя, что другие семейства тем не отображаются ...

Кто-нибудь может найти способ обойти эту проблему?

1 Ответ

1 голос
/ 11 марта 2020

Если я правильно понял, вы можете просто установить семейства шрифтов непосредственно на .theme-a и .theme-b, например: 

.theme-a {
   font-family: 'Some Font', sans-serif;
}

.theme-b {
   font-family: 'Roboto', sans-serif;
}

Дочерние элементы этих элементов должны автоматически наследовать шрифты, если что-то не так ' переписать их. Нет необходимости устанавливать каждый элемент вручную.

...