Less CSS: driving includes through parameters -
we have less based stylesheet generate multiple color variations. have defined include file contains color variations (for blue.less) , generate , use green , red variations of include file.
what somehow parametrize less via command line include 1 of these specific color files. know how can done?
put color definitions variables in separate file, eg. blue.less:
@basecolor: #0000ff; // blue @accentcolor: #00ffff; // yellow? then create separate theme file, eg. theme.less, define how base color should changed achieve theme:
@link-color: @basecolor; @link-hover-color: darken(@link-color, 15%); @panel-header-highlight-color: darken(@accentcolor, 15%); ... then in third file, e.g. layout.less, define
a { color: @link-color; &:hover { color: @link-hover-color; } } ... finally, create blue-master.less:
@import "blue.less"; @import "theme.less"; @import "layout.less"; to create red-master.less should need write color file , change 1 line in above.
you can call color-file color.less, , e.g. have blue/color.less , red/color.less, , use --include-path=.. parameter lessc make generate different files based on command line parameters, advise against (it becomes more arduous work in experience).
Comments
Post a Comment