Frontend Formula

💡Делаем различные типы кнопок



— Элемент <button> создан для взаимодействия с пользователем. Его события запускаются с клавиатуры, мыши, сенсорного ввода, голоса и многого другого.



— Сделаем различные типы кнопок. Каждая кнопка получит стили, которые помогут визуально определять их назначение. Например: кнопки сброса будут иметь предупреждающие цвета, а кнопки отправки будут окрашены в оттенки синего.



— Для добавления интерактивности, будем использовать псевдоклассы CSS (:hover, :focus, :focus-visible и :active).



— Делаем разметку с помощью пользовательского класса .btn-custom. А также осуществляем взаимодействие с SVG-элементами.



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



Ссылка на статью: https://web.dev/building-a-button-component/



👉 Ссылка на готовый код



#js #css #сниппет



👉 @frontend_formula