Лайфхак: кастомизация стилей для временных изменений шаблона

Бывают случаи, когда требуется по-быстрому переопределить стили шаблона сайта:

  • создается копия сайта, и CSS копируется из оригинального проекта, чтобы его «допилить»,
  • нужна временная правка стилей, например, новогодние изменения (правильно - использовать версионирование через git)

В этих случаях есть смысл вносить изменения не в исходный текст CSS, а переопределить свойства в отдельном файле. Удобно для этого использовать CSS-препроцессоры.

Простая техника как это сделать:

  • Скопировать исходный файл site-styles.less (или сделать симлинк) в новый проект.
  • В bundle-site-styless.less подключить исходный файл site-styles.less и добавить styles-legacy.less.
  • В styles-legacy.less определить специфику проекта.

Таким образом, меняя вид сайта-донора CSS, можем сделать легкий «апдейт» нового проекта с минимальными правками.

Минусы: увеличение результирующего CSS файла при значительном переопределении стилей. Однако если использовать структурную оптимизацию, то «перезаписанные» стили будут удалены, и мы не получим накладных расходов в виде бесполезного увеличения размера файла.

Печать/экспорт