Figma шаблон:
Сверстанный файл:
00:00:00 Выбираем шаблон для верстки 00:01:07 Создаем проект 00:01:58 Общий подход к верстке 00:02:16 Навигация. Создаем bootstrap навигацию 00:02:40 Figma. Использование Alt и двойного клика в figma 00:03:45 Figma. Замена шрифта в figma 00:04:45 Навигация. Копируем текст навигации 00:08:30 Навигация. Копируем логотип 00:10:30 Навигация. Создаем файл main.css и делаем отступы 00:14:38 Figma. Копируем css-стиль с элемента в figma 00:16:20 Секция 1. Загоняем текст и расположение блоков 00:19:38 Секция 1. Оборачиваем в контейнер 00:20:14 Секция 1. Устанавливаем имена классов для блоков 00:20:55 Секция 1. Копируем css-стили 00:21:28 Секция 1. Добавляем шрифты Poppins и Volkhov 00:23:40 Секция 1. Настраиваем глобальный шрифт для body 00:24:27 Секция 1. Стилизуем кнопочки 00:27:48 Подключаем bootstrap-icons 00:29:30 Секция 1. Ставим отступы между элементами 00:31:14 Секция 1. Подключаем фоновые картинки 00:32:58 Секция 1. Подключаем картинку девушки 00:36:49 Секция 2. Загоняем текст, картинки и расположение блоков 00:43:07 Секция 1. Делаем подчеркивание слова 00:44:54 Секция 2. Копируем стили 00:48:35 Секция 2. Верстаем плашку 00:50:45 Секция 2. Эффект наведения на плашку 00:56:05 Секция 2. Красный квадрат у активной плашки 01:00:24 Секция 2. Заливаем весь слайд одним цветом 01:03:05 Секция 3. Загоняем текст и расположение блоков 01:07:26 Figma. Скачиваем оригиналы картинок с помощью плагина 01:08:20 Секция 3. Подключаем картинки 01:09:22 Секция 3. Копируем стили 01:12:20 Секция 3. Верстаем плашки 01:13:20 Секция 3. Делаем выплывающий блок с информацией 01:18:20 Секция 3. Доверстываем блок с информацией 01:21:20 Секция 3. Добавляем отступы
