Size: a a a

2020 November 13

КС

Кирилл Спасибович... in Svelte [svelt]
Марк Танащук
Хз, есть ли мне смысл на postCSS'ный конфиг перекидывать теперь
я думаю всегда есть смысл если снова начинаешь писать css
один хрен нужен автопрефиксер
источник

МТ

Марк Танащук... in Svelte [svelt]
Кирилл Спасибович
я думаю всегда есть смысл если снова начинаешь писать css
один хрен нужен автопрефиксер
Уже добавлен.

Просто это мой достаточно старый проект в котором я не полностью использовал PostCSS, а использовал SCSS с префиксером
источник

КС

Кирилл Спасибович... in Svelte [svelt]
и какие фишки scss были использованы ?
источник

КС

Кирилл Спасибович... in Svelte [svelt]
переменные, нестинг ?
источник

МТ

Марк Танащук... in Svelte [svelt]
Кирилл Спасибович
и какие фишки scss были использованы ?
Миксины и функции для адаптивных шрифтов, theme.scss с всеми глоб. переменными аля цвета, размеры шрифтов и размеры экранов
источник

МТ

Марк Танащук... in Svelte [svelt]
импорты стилей(mobile/desktop) в каждом файле
источник

ON

Oleg N in Svelte [svelt]
Dan Kozlov
Это ж обречено на баги и проблемы.
можно пробрасывать пропсы, события, почему бы не пробросить классы?
вот пример как пробросить без багов:
https://malinajs.github.io/repl/#/gist/065441c1187bfd9ce5f0117b7dbd97f6?version=0.6.0

вот проброс на 2 уровня вниз (раскраска кнопок)
https://malinajs.github.io/repl/#/gist/410bb2c1406ea412ad4b4e75616d9581?version=0.6.0
источник

МТ

Марк Танащук... in Svelte [svelt]
Все по стандарту
источник

КС

Кирилл Спасибович... in Svelte [svelt]
Марк Танащук
Миксины и функции для адаптивных шрифтов, theme.scss с всеми глоб. переменными аля цвета, размеры шрифтов и размеры экранов
а что за функции ?
источник

КС

Кирилл Спасибович... in Svelte [svelt]
миксины в postcss тоже есть
источник

МТ

Марк Танащук... in Svelte [svelt]
Кирилл Спасибович
а что за функции ?
Например вот для font-size:

@mixin fontSize($font-min, $font-max) {
   font-size: $font-min;

   @media (min-width: $laptop) {
       $font-difference:   $font-max   - $font-min;
       $screen-difference: $lg-desktop - $laptop;

       $k1: $font-difference / $screen-difference;
       $k2: $font-min - $k1 * $laptop;

       $result: calc(#{$k1} * 100vw + #{$k2});

       font-size: $result;
   }

   @media (min-width: $lg-desktop) {
       font-size: $font-max;
   }
}
источник

КС

Кирилл Спасибович... in Svelte [svelt]
ну это ж миксин
источник

КС

Кирилл Спасибович... in Svelte [svelt]
@function pxrem($px) {
 @return #{$px / $font-size + rem};
}
источник

КС

Кирилл Спасибович... in Svelte [svelt]
функции это типа такого
источник

МТ

Марк Танащук... in Svelte [svelt]
Ой, переписал все таки с них на миксины
источник

МТ

Марк Танащук... in Svelte [svelt]
Но функции пораньше были
источник

КС

Кирилл Спасибович... in Svelte [svelt]
но и то я щас смотрю на этот треш и думаю, а что мне мешало postcss плагин конвертящий пиксели в rem'ы пропорционально заданному размеру шрифта конвертить
источник

КС

Кирилл Спасибович... in Svelte [svelt]
интересно, что нужно в postcss чтобы сожрать арифметику
источник

КС

Кирилл Спасибович... in Svelte [svelt]
и интерполяции для калька
источник

МТ

Марк Танащук... in Svelte [svelt]
Кирилл Спасибович
но и то я щас смотрю на этот треш и думаю, а что мне мешало postcss плагин конвертящий пиксели в rem'ы пропорционально заданному размеру шрифта конвертить
На браузер перенести можно
calc(#{$px / $font-size} + rem);
источник