Использование CSS-переменных и медиа-запросов внутри styled-компонентов - PullRequest
0 голосов
/ 21 июня 2019

Я пытаюсь имитировать что-то похожее на следующее из styled-компонентов.Следующее позволяет мне вызывать var(--spacing) с различными свойствами, и мне не нужно беспокоиться об обработке запросов при изменении размера страницы, поскольку переменная уже обрабатывает запрос независимо.

:root {
  --spacing: 32px;
}

@media (min-width: 1024px) {
  :root {
    --spacing: 64px;
  }
}

@media (min-width: 1440px) {
  :root {
    --spacing: 80px;
  }
}

.example {
  width: 100px;
  height: 100px;
  margin: var(--spacing);
}

Это прекрасно работаетв CSS / SASS, но мне интересно, смогу ли я сделать что-то подобное для стилевых компонентов?

...