На какие файлы разбивать проект по методологии SMACSS?
Не так давно все никак не мог понять как же все таки организовывать структуру проекта. Подсказали про методологии. Ознакомился немного. Сегодня увидел видео про методологию SMACSS. Посмотрел небольшой обзор, вроде как довольно таки удобно и логично все. Проект делится на 5 папок. Base, layout, modules, states, theme.
С base папкой вроде как ясно. Как я понял в ней хранить такие файлы как например reset, normalize, typography и т. д. В общем базовые стили для проекта. И как я понял в этих файлах используются только селекторы тегов.
А вот дальше вообще не понятно. Вот в layout какие файлы должны быть? Как я понял в layout должны быть файлы например header, main, section, footer, а также файл с сеткой. И так вот, если я правильно понял, то что в них писать? Просто разбить весь сайт на большие блоки. и в них указать просто стилизация для этих блоков? Например есть блок header. В него записываю просто например следующие стили: Фон, ширину, высоту, отступы, да и по сути все... Получается файл из нескольких строк? и так со всеми файлами layout?
Дальше, не понятно с сеткой. Наверное самое непонятное для меня. Как и что писать в этом файле? Опять же для каждого большого блока описывать расположение модулей внутри? Например сделать header flex контейнером, расположить все колонкой и т.д, ну или флоаты да отступы модулям указать, так это, или я что то не правильно понял?
Ну с modules думаю мне тоже понятно, там должны быть независимые модули, т.е меню, банер, галлерея, формы и т.д?
Здесь для каждого модуля указать его стилизацию, и как я понял не указывать отступы и позиционирование.
В states думаю что нужно описывать стили для элементов модулей, например при ховере на определенный элемент делать фон красным и т. д
Ну а с темами все ясно, они меня пока что не интересуют.
И есть еще несколько вопросов. Где описывать стили для кнопок?Куда складывать файлы например какой нибудь библиотеки, фреймворка? И например я использую сетку jeet для stylus, получается описывать сетку при помощи jeet в файле grid в папке layout? И куда например складывать миксины и файл переменных?
Непонятностей для меня достаточно много. Пожалуйста, кто в этом разбирается, ответьте пожалуйста на вопросы. Очень хочется разобраться во всем этом.
Я считаю делать так, как будет удобнее самому. В идеале конечно разбивать верстку на блоки, и создавать отдельный лэйаут. В base поидее можно прописать сразу и кнопки и иконки и т.д.
Сетка это сетка. Посмотри бутстрап или грид980, станет понятно
Простой
Простой