Многие говорят, что 👩‍💻 React — это про веб-технологии. Но что если я скажу, что React не был создан для веба? По сути React решил проблемы, которые возникли в вебе, но он не ограничился одним лишь вебом.

Где и как ещё применяется React узнавай в карточках 👆

И, как обычно, ссылочки:
— React DOM
— React Native
— React PDF
— React Email
— Remotion
— React Ink
— React Three Fiber
— Reacord

💬 Пишите в комментариях какую из библиотек захотелось попробовать или предлагайте свою

Авто-лейауты в 🎨 Фигме позволяют упростить создание компонентов и экранов, предоставляя автоматическую расстановку объектов относительно друг друга.

😴 Подобие авто-лейаутов есть и в верстке сайтов, называются флексами. Поэтому когда дизайнер делает макет адаптивным с помощью авто-лейаутов, то он упрощает жизнь верстальщика, смотрящий на стили в Dev Mode.

🥺 Но так нельзя сказать про каждую фичу в Фигме. Поэтому буду рассказывать в постах о невозможностях — именно о невозможностях: когда что-то можно делать в Фигме, а вебе нельзя и наоборот.

✂️ Обрезка типографики по вертикали

Обрезку по вертикали любят использовать, считая, что это поможет наладить отступы между элементами. В Фигме это делается с помощью переключателя Vertical trim, а в CSS с помощью leading-trim: both.

В конечном итоге текст обрезается по высоте заглавных букв и по алфавитной базовой линии — горизонтальная линия, на которой обычно базируются строчные буквы в тексте.

Проблема в том, что в 🎨 Фигме это всё работает, в вебе есть для этого свойство, но оно не работает ни в одном браузере, кроме Safari под флагом. То есть добавив к тексту свойство leading-trim: both ничего не произойдёт.

💡 Поэтому использовать Vertical trim, если макет планируется использовать в вебе — крайне сомнительная идея