sprucecss root admin template

Этот репозиторий содержит статический шаблон нашего администратора Laravel с именем Root.

Шаблон создан на основе Eleventy для удобства и упрощения управления. Вы можете получить содержимое из файлов шаблонов Nunjucks или скомпилированной папки dist .

Вероятно, в будущем шаблон будет регулярно меняться из-за разработки пакета Laravel.

Что вы получаете

Мы использовали Alpine.js для обработки кода JS. Несмотря на то, что существует несколько вполне полных вариантов поведения JS, этот шаблон по-прежнему представляет собой статический HTML/CSS, поэтому вам придется выполнить интерактивную часть.

Прямо сейчас вы можете получить следующие виды или макеты:

• Панель управления
• Список продуктов
• Список заказов
• Список клиентов
• Список категорий
• Предмет Править
• Просмотр элемента
• Настройки
• Войти
• Зарегистрироваться
• Сброс пароля

Существует множество компонентов, специфичных для администратора:

• Модальное окно с настройками.
• Блок таблицы данных с поддержкой поиска и фильтрации.
• Простой поиск.
• Различные выпадающие меню.
• Виджет-карты.
• Модальный обработчик медиа.
• Комбобокс.

Вставай и беги

Мы используем eleventy --serve и компилируем Sass с sass-cli со скриптами npm.

1. Клонируйте репозиторий.

2. Установите зависимости.

   В файле package.json вы найдете все зависимости (и сценарии) для их установки с помощью следующей команды:

   npm install

3. Запускаем режим разработки

   Для запуска режима разработки используйте npm script . Этот скрипт также будет следить за изменениями.

   npm start

4. Запустите производственный режим

   Прежде чем приступить к работе, вам следует использовать рабочий сценарий для сжатия файлов Sass.

   npm run prod

СССС

Проект компилирует файлы SCSS из папки ./src/scss в папку ./src/css . Проект включает Spruce CSS, который придает стиль некоторым компонентам пользовательского интерфейса Spruce.

Другие сценарии

• sass:lint/sass:lint:fix Вы можете проверить свои файлы SCSS с помощью Stylelint и предустановленных стилей stylelint-config-sass-guidelines с помощью команды npm run sass:lint . Если вам нужны автоматические исправления, используйте команду npm run sass:lint:fix .

• js:lint/js:lint:fix Вы также можете линтовать свой JS, как с помощью Sass. Для правил мы используем пресет Airbnb.

Лицензия

Код лицензирован под лицензией MIT.