Технология верстки 2021: создание простого лендинга (часть 5) HD

В этой части мы полностью адаптируем первую секцию нашего лендинга. СОДЕРЖАНИЕ: 00:00 Адаптация класса контейнера, выбор брейкпоинтов. 05:53 Строим план адаптации первого блока. Переменные в PostCSS. Настройка Webpack для работы с ними (postcss-simple-vars). 10:00 Добавляем коммит, меняем имя/емейл автора коммита. 11:14 Продолжаем адаптацию. Активно используем медиа-запросы. Проблема горизонтального скролла. 15:33 Решаем вопрос с галочками. Не нужно бояться !important - иногда можно использовать. 23:47 Слишком длинная надпись на нижней кнопке блока. Проблема пограничных пикселей между брейкпоинтами. Особенности работы min- и max-width. 27:34 Добиваем галочки. 29:38 Затуп нижней кнопки. 32:06 Касание краёв текста с границами экрана. Окончательная адаптация галочек. 36:51 Проверяем нашу верстку. 38:03 Призыв к самостоятельной работе + философское заключение. Исходники к ролику (PSD-файл с дизайном находится там же): https://github.com/makewebme/website-landing-technology-2021 Стань спонсором канала и получи бонусы: https://www.youtube.com/channel/UCt36CWL85NGtOgUMZ2X6x5g/join Получи скидку 5% на первую оплату хостинга/домена в Reg.ru, используя промо-код: 948E-53B9-CF98-8204 Он вводится во время оплаты услуги. Не забывай - ты не только получаешь скидку, но и поддерживаешь проект! Присоединяйся к нашему Telegram-чату https://t.me/makewebme Если не работает, то http://makeweb.me/telegram-mw-1 или http://makeweb.me/telegram-mw-2 Или по имени чата в поиске - @makewebme