КС
Можно просто сделать на css vars, но запечь по-разному несколько бандлов
Как мне поменять его на
:global(.primary) { color: blue } , напрмер, при нажатии на кнопку ?Size: a a a
2021 February 17
МТ
Eugene Ilyin
Динамические означают, что тема может менять этот глобальный стиль на сто-то другое вычисляемое.
Как мне поменять его на
Как мне поменять его на
Кхм
{#if someProp}
<style>any styles here</style>
{/if}КС
А так переопределять как раз мучительнее от род селектора мне видится
EI
{#if someProp}
<style>anystyles VERY STSTIC here</style>
{/if}КС
Есть postcss плагин который запекает css vars
AP
запекание очень ограниченное
DK
А с чем связано ограничение про CSS-переменные? У них чумовое покрытие уже, а если вам очень надо, можно полифил же подрубить, чтоб поддержка была даже в IE.
(если у вас только рутовые переменные)
(если у вас только рутовые переменные)
EI
Я наверное плохо объяснил.
Это простая задача, есть тема в виде набора глобальных css селекторов которые при SSR вставляются в head
И потом спокойно используются в Svelte class="rounded-t text-primary bg-secondary" и т.д.
Мне надо иногда при нажатии на кнопку (утрировано) j,обновлять тему например на темную или выбранный другой цвет или отступ или layout и т.д.
На стороне клиента
Это простая задача, есть тема в виде набора глобальных css селекторов которые при SSR вставляются в head
И потом спокойно используются в Svelte class="rounded-t text-primary bg-secondary" и т.д.
Мне надо иногда при нажатии на кнопку (утрировано) j,обновлять тему например на темную или выбранный другой цвет или отступ или layout и т.д.
На стороне клиента
EI
Я лишь спросил какие есть инструменты в Svelte, но так как он дружит с Emotion можно использовать его на сервере и клиенте
EI
А с чем связано ограничение про CSS-переменные? У них чумовое покрытие уже, а если вам очень надо, можно полифил же подрубить, чтоб поддержка была даже в IE.
(если у вас только рутовые переменные)
(если у вас только рутовые переменные)
Вы имеете ввиду вот это:
https://stackoverflow.com/questions/45955538/workaround-for-css-variables-in-ie ?
https://stackoverflow.com/questions/45955538/workaround-for-css-variables-in-ie ?
КС
А есть способ вычислять содержимое пропса для бинда только если кто-то сверху забиндился ?
КС
Как стор с подпиской / без
DK
Eugene Ilyin
Вы имеете ввиду вот это:
https://stackoverflow.com/questions/45955538/workaround-for-css-variables-in-ie ?
https://stackoverflow.com/questions/45955538/workaround-for-css-variables-in-ie ?
Ну да, там даже ссылка есть на какой-то полифилл, хотя не тот, которым пользовался я.
EI
Я так понял Svelte очень статичен в плане css если надо менять что-то в виде темы, то либо статический заранее заготовленный список который выбирается в зависимости от темы, либо надо заранее заготовленных :global вариантов.
Это все сделаоно с целью облегчить SSR сборку стилей, которые исопльзуются в проекте
Это все сделаоно с целью облегчить SSR сборку стилей, которые исопльзуются в проекте
EI
Ну да, там даже ссылка есть на какой-то полифилл, хотя не тот, которым пользовался я.
А каким вы пользовались?
DK
https://github.com/jhildenbiddle/css-vars-ponyfill
IE9+
Но это дикость, конечно, хаха.
Имейте в виду: работает только с рутовыми переменными. То есть каскада не будет.
IE9+
Но это дикость, конечно, хаха.
Имейте в виду: работает только с рутовыми переменными. То есть каскада не будет.
EI
Ну нет это мы ушли в сторону как поддержать vars, если нужны селекторы для тем, то emotion вполне подходит для обновления селекторов на клиенте
EI
Просто я полюбил tailwind подход utility-first для css верстки, к этому дошираку быстро привыкаешь, а код получается самый компактный для bundle
EI
Подумал может svelte умеет хотя бы в глобальные селекторы делать заменяемыми, ну да ладно.
КС
Eugene Ilyin
Просто я полюбил tailwind подход utility-first для css верстки, к этому дошираку быстро привыкаешь, а код получается самый компактный для bundle
Если бы еще форма записи в html была не ублюдская и он не тормозил сборку так жестко