Pull to refresh

LESS-Mix — немного о LESS-примешаниях

Reading time2 min
Views9.6K
Замечательный фреймворк LESS позволяет сильно упростить роботу со стилями. Одной из замечательных его возможностей есть примешания (mixins). Примешания позволяют включать все свойства класса в другой класс путем простого включения имени класса как значение одного из свойств. Это напоминает использование переменных, но в отношении целых классов. Примешивания могут вести себя как функции, и принимать аргументы. Именно возможность примешаний принимать аргументы и манипулировать ими лежит в основе библеотек примешаний, таких как LESS Elements, LESS Hat, LESS Mix и компонента mixins.less в Bootstrap.




К недавнему времени я пользовался LESS Elements и мне ее вполне хватало. Она очень легковесна (6 кб.) и имеет все частоиспользуемие примешания. Но начав работать над более сложными проектами мне не хватало возможности создавать мультитени, радиальные градиенты, угловые градиенты, мультианимации и другое. Переходить на тяжелый LESS Hat который весит целых 115 кб. не хотелось. Поэтому я просто создал свой less-файл в котором собирал все нужные мне примешания. Со временем примешания накопились, я их посортировал за категориями и решил поделится ими с миром. Так появилась библиотека LESS-Mix которая имеет все что нужно но весит только 7.7 кб.

Библиотека состоит из 27 примешаний разбитых на 8 секций:

  • Size and Position — примешания для работы с размерами элемента и его позиционированием
  • Gradient Tools — примешания для простого и удобного создания всех типов градиентов.
  • Border Radius Tools — примешания для работы со скруглеными углами.
  • Shadow Tools — примешания для создания теней и свечений єлементов.
  • Transition Tools — примешания для работы с анимациями и их опциями.
  • Transform Tools — примешания для работы с трансформациями.
  • More Tools — примешания для работы с другими опциями, которые не входят в предидущие категории но которые необходимы в верстке.
  • Develop and Testing Tools — примешания предназначены для разработчиков и дебагинга. Включают опции, которые наиболее часто используются в процесе разработки.


Библиотека поддерживает мультитени, радиальные градиенты, угловые градиенты, мультианимации, мультитрансформации и особенно удобными есть примешания из группы Develop and Testing Tools которые позволяют скрывать, выделять элементы, прятать текст и обнулять фильтры.

Больше информации о библиотеке и документацию на русском можно найти здесь:
LESS-Mix
Репозиторий на GitHub:
denysdovhan/LESS-Mix

Рад если библиотека поможет вам в роботе.
Буду благодарен как за положительные отзывы так и за объективную критику. Особенно буду рад услышать пожелания об усовершенствовании!

Спасибо за внимание! Удобства в работе!
Tags:
Hubs:
+1
Comments12

Articles