Tailwindcss сборка 2023.

• Автор давно не выпускал обучающие ролики, но работал над проектом.  

• Переписал сборку на Tailwind CSS из-за любви к технологии и лени.  

• Видео будет полезно для тех, кто разбирается в Tailwind.  

• Сборка доступна только через донат, но можно использовать её как идею для создания своей.  

• Для установки Tailwind нужно открыть терминал и выполнить команды npm install и npm start dev.  

• В конфиге указаны настройки для Dark Mode и адаптивности.  

• В index.html есть базовая структура для хедера, футера и основного контента.  

• В папке components много готовых компонентов, таких как хедер и аккордеон.  

• Компоненты можно копировать и вставлять в проект для быстрого создания.  

• Пример использования хедера: копирование и вставка кода, настройка стилей и JavaScript.  

• Хедер покрывает 90% потребностей для различных типов проектов.  

• Пример использования аккордеона: копирование и вставка HTML, CSS и JavaScript кода.  

• Возможность открытия всех элементов аккордеона.  

• Пример использования счетчика: копирование и вставка HTML, CSS и JavaScript кода.  

• Использование интерсекшн обзервера для отслеживания скролла и вызова функций.  

• Добавление класса "hidden" к элементам, чтобы они не мешали на странице.  

• Удаление класса "border" у скшенов.  

• Настройка темной темы с использованием класса "dark".  

• Открытие и закрытие контейнера для темной темы.  

• Настройка стилей для темной темы через классы.  

• Сохранение стилей в локальном хранилище для сохранения изменений.  

• Открытие и копирование кода для дроб-даун меню.  

• Настройка стилей для меню.  

• Добавление нескольких дроб-даун меню и их стилизация.  

• Копирование и вставка кода для импульса.  

• Настройка стилей для стандартных элементов.  

• Пример изменения цвета чекбокса с помощью тейла классов.  

• Открытие и копирование кода для модели.  

• Настройка стилей для модели.  

• Пример использования модели для отображения контента.  

• Открытие и копирование кода для кастомного слекта.  

• Настройка стилей для выпадающего меню.  

• Пример стилизации выпадающего меню.  

• Открытие и копирование кода для слайда.  

• Настройка анимации для меню.  

• Пример использования функции для показа и скрытия элементов.  

• Открытие и копирование кода для свайпера.  

• Настройка стилей и подключение скрипта.  

• Пример использования свайпера для навигации.  

• Открытие и копирование кода для табов.  

• Настройка стилей для табов.  

• Пример использования табов для навигации по страницам.  

• Копируем и добавляем то джес.  

• Отключаем свайпер для предотвращения загрузки данных из интернета.  

• Проверяем работу компонентов и заполняем их контентом.  

• Удаляем папку компонент после завершения проекта.  

• Передаем содержимое папки с сс заказчику.  

• Заказчик устанавливает пакеты с помощью пэк джисон и продолжает работу.  

• Автор надеется, что зрители создадут свои сборки для упрощения работы.  

• Подчеркивается, что это значительно сокращает время разработки.  

• Призывает зрителей поддержать его через спонсорство, патрион или байми и кофе.  

• Автор благодарит зрителей за внимание.  

• Обещает вернуться с обучающими уроками в ближайшее время.  

• Прощается со зрителями.