FLUID CSS Language Reference
Variables
You can add new CSS variable with the syntax :
@var_name:var_value;
And use them like this :
css_rule {css_property:@var_name;}NOTE : Names could only have letters/numbers and - and _
Inclusion of rules inside other rules
You can add some class rules inside other rules with the syntax :
.css_source_rule { ... }
css_rule { @inc(.css_source_rule) }NOTE : This only work on class, and I introduce the @inc keyword because I think the LESS way of mixins is not semanticaly correct... Spaces are not taken into account, so you can format your code as you want.
Inclusion of other CSS files
Without the W3C limitation of writing includes at the top of the file, you can add include instructions anywhere.
@include(...) /* TOP OF FILE */
...
@inc(/my/css_file.css);
Calcul on pixels or em units
Operators +, -, * and / are understood for unit based calculation or em-based... Units are remove from the calcul so you'll have to explicitly add it at the end of the instruction.
@page_width:900px;
@b_nav_height:18px;
@b_nav_font_size:10px;
@b_nav_padding:4px;
@b_anime_height:253px;
body#t-index #b-body-wrapper {
min-height:@eval(@b_nav_height+@b_anime_height)px;
min-width:@eval(@page_width+20px);
width:@page_width;
height:@eval(@b_nav_height+@b_anime_height)px;
position:absolute;
top:50%;
left:50%;
margin:-@eval((@b_nav_height+@b_anime_height)/2)px 0 0 -@eval(@page_width/2)px;
}
#b-brand {position:absolute; top:@eval(4px+@b_nav_height)px; left:459px;}