[Перевод] Адаптация типографии под пользовательские предпочтения с помощью CSS

Способ настройки шрифта в соответствии с предпочтениями пользователей В данной статье рассматривается применение медиа-запросов CSS с использованием переменного шрифта для более точной адаптации типографии. Читать далее

Подробнее

React + Styled Components — идеальная анимация. Параметризованная анимация

В данной статье продемонстрирован способ реализации “параметризованной” css анимации React компонента с помощью styled components. Параметризованная потому что css анимация описывается через параметры, которые динамически рассчитываются на основе пропсов и состояний компонента при его рендеринге. Читать далее

Подробнее

[Перевод] Исследование производительности анимации на основе скрола страницы

Что нового в анимации на основе скрола? Анимация на основе скрола - это способ добавить интерактивности и визуального интереса вашему сайту или веб-приложению, который запускается в зависимости от положения прокрутки пользователя. Это отличный способ удержать пользователей и сделать сайт более привлекательным. Раньше единственным способом создания анимации на основе скрола страницы, было реагирование на событие прокрутки в главном потоке. Это приводило к двум основным…

Подробнее

Компонентный подход в вёрстке: подробный разбор для джунов и сочувствующих

Зачем использовать в вёрстке компонентный подход? Разбираемся, как и зачем верстать интерфейсы, используя этот подход, какие параметры и проблемы важно учесть. Разберём азы, забежим вперёд и подробно погрузимся в тему. Кстати, эта статья написана на основе одного из уроков курса «Профессиональная вёрстка на HTML и CSS» Яндекс Практикума. Читать далее

Подробнее

Черт тебя возьми, CSS

У CSS много моментов, которые сбивают столку. Разработчики плюются от него. А мне нравится CSS, несмотря на мои потраченные нервы. Подумав, как помочь другим меньше мучаться, я собрал ряд неочевидных моментов. Они сбивали с толку меня и моих знакомых. Надеюсь, вам будет полезно. Читать дальше →

Подробнее

[Перевод] Вышел Chrome 115

В этой статье вы узнаете про: • Анимации на основе скрола • Topics API • Ограждённые Фреймы • Privacy Sandbox и многое другое! Читать далее

Подробнее

Мой опыт первого принятого коммита в open source

Мой первый персональный компьютер на Windows Millenium Всем привет. Меня зовут Максим Дзюбак. Я начинающий программист. В этой статье хочу поделиться своим первым опытом принятого коммита в open source. Читать дальше →

Подробнее

Мои любимые вопросы о CSS с ответами. Версия 2023 года

В 2020 году я поделился списком моих любимых вопросов о CSS, который стал довольно популярным, судя по просмотрам. Спустя 3 года CSS изменился, и я решил дополнить список, добавив вопросы про гриды, пользовательские свойства (CSS-переменные), новые селекторы и свойства. Работая над вопросами, мне хотелось помочь вам в изучении новых возможностей CSS и тех моментов, которые многие разработчики упускают, судя по моей практике. Также вы можете использовать их, если проводите интервью. Я

Подробнее

[Перевод] Введение в View Transitions API

Новый View Transitions API, что можно перевести как "интерфейс переходов отображения", предлагает легкий способ анимирования перехода между двумя состояниями DOM — даже между загрузками страниц. Это прогрессивное улучшение, которое можно реализовать уже сегодня. Читать дальше →

Подробнее

Сравнение тяжеловесности популярных библиотек UI компонент для Vue 3

Библиотеки UI компонент популярны и удобны в некоторых случаях, но у них тоже есть обратные стороны. Одно дело, когда делаешь админку и используешь десятки компонент, другое - когда тебе надо всего пару компонент. Было проведено исследование - взяты три HTML элемента: Button, Input и Select, и проверено, насколько увеличатся js и css бандлы если использовать для них одну из 10 распространенных UI библиотек для Vue 3. Читать далее

Подробнее

React: как сделать динамический суффикс в <input />, который будет двигаться вместе с набранным текстом

В этой статье вы узнаете как с помощью react можно сделать input с двигающимся суффиксом, который идет сразу после значения ввода Читать далее

Подробнее

[Перевод] Новинки CSS и UI: I/O 2023

Последние несколько месяцев открыли золотую эру веб UI (User Interface — пользовательский интерфейс). Вот 20 самых захватывающих и впечатляющих возможностей, которые появились недавно или появятся в ближайшем будущем: запросы контейнера (container queries); запросы стиля (style queries); селектор :has(); микросинтаксис nth-of; text-wrap: balance; initial-letter; динамические единицы измерения области просмотра (viewport); цветовые пространства с широкой…

Подробнее