Browse Source

Adds #1575 Sizing always evaluates to exact pixel values as a ratio of @emSize

pull/1574/merge
jlukic 10 years ago
parent
commit
2596dd71b2
1 changed files with 34 additions and 29 deletions
  1. 63
      src/themes/default/globals/site.variables

63
src/themes/default/globals/site.variables

@ -87,14 +87,20 @@
Sizes
--------------------*/
@miniSize : 10px;
@tinySize : 12px;
@smallSize : 13px;
@mediumSize : @emSize;
@largeSize : 16px;
@bigSize : 18px;
@hugeSize : 20px;
@massiveSize : 24px;
/*
To have sizing resolve to a specified pixel values adjust
the numerator to the desired font size and the denominator
to the base em size
*/
@miniSize : (10 / 14);
@tinySize : (12 / 14);
@smallSize : (13 / 14);
@mediumSize : (14 / 14);
@largeSize : (16 / 14);
@bigSize : (18 / 14);
@hugeSize : (20 / 14);
@massiveSize : (24 / 14);
/*-------------------
Page
@ -192,33 +198,32 @@
Paths
--------------------*/
/* For source, automatically modified in gulp for dist */
@imagePath : "../../themes/default/assets/images";
@fontPath : "../../themes/default/assets/fonts";
/* For source only. Modified in gulp for dist */
@imagePath : '../../themes/default/assets/images';
@fontPath : '../../themes/default/assets/fonts';
/*-------------------
Em Sizes
--------------------*/
/* Exact pixel values expressed in em */
@mini : unit((@miniSize / @mediumSize), rem);
@tiny : unit((@tinySize / @mediumSize), rem);
@small : unit((@smallSize / @mediumSize), rem);
@medium : unit((@mediumSize / @mediumSize), rem);
@large : unit((@largeSize / @mediumSize), rem);
@big : unit((@bigSize / @mediumSize), rem);
@huge : unit((@hugeSize / @mediumSize), rem);
@massive : unit((@massiveSize / @mediumSize), rem);
@relativeMini : unit((@miniSize / @mediumSize), em);
@relativeTiny : unit((@tinySize / @mediumSize), em);
@relativeSmall : unit((@smallSize / @mediumSize), em);
@relativeMedium : unit((@mediumSize / @mediumSize), em);
@relativeLarge : unit((@largeSize / @mediumSize), em);
@relativeBig : unit((@bigSize / @mediumSize), em);
@relativeHuge : unit((@hugeSize / @mediumSize), em);
@relativeMassive : unit((@massiveSize / @mediumSize), em);
@mini : unit( round(@miniSize * @emSize) / @emSize, rem);
@tiny : unit( round(@tinySize * @emSize) / @emSize, rem);
@small : unit( round(@smallSize * @emSize) / @emSize, rem);
@medium : unit( round(@mediumSize * @emSize) / @emSize, rem);
@large : unit( round(@largeSize * @emSize) / @emSize, rem);
@big : unit( round(@bigSize * @emSize) / @emSize, rem);
@huge : unit( round(@hugeSize * @emSize) / @emSize, rem);
@massive : unit( round(@massiveSize * @emSize) / @emSize, rem);
@relativeMini : unit( round(@miniSize * @emSize) / @emSize, em);
@relativeTiny : unit( round(@tinySize * @emSize) / @emSize, em);
@relativeSmall : unit( round(@smallSize * @emSize) / @emSize, em);
@relativeMedium : unit( round(@mediumSize * @emSize) / @emSize, em);
@relativeLarge : unit( round(@largeSize * @emSize) / @emSize, em);
@relativeBig : unit( round(@bigSize * @emSize) / @emSize, em);
@relativeHuge : unit( round(@hugeSize * @emSize) / @emSize, em);
@relativeMassive : unit( round(@massiveSize * @emSize) / @emSize, em);
/*-------------------
Icons

Loading…
Cancel
Save