From 6e5755bd7c8d2fb813d5289d5d9d39a0d375a971 Mon Sep 17 00:00:00 2001
From: jlukic <jacklukic@gmail.com>
Date: Tue, 7 Jul 2015 15:14:41 -0400
Subject: [PATCH] #2538 @size ratio values should always be expressed in terms
 of default em size, so that they scale with @emSize

---
 src/themes/default/globals/site.variables | 30 +++++++++++++----------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/themes/default/globals/site.variables b/src/themes/default/globals/site.variables
index 6e1c72a7f..2364e4cf7 100644
--- a/src/themes/default/globals/site.variables
+++ b/src/themes/default/globals/site.variables
@@ -25,7 +25,7 @@
 --------------------*/
 
 /* This is the single variable that controls them all */
-@emSize   : 14px;
+@emSize   : 17px;
 
 /* The size of page text  */
 @fontSize : 14px;
@@ -83,18 +83,18 @@
 --------------------*/
 
 /*
-  This ensures all relative sizes are exact pixels
-  expressed in em
+  Sizes are all expressed in terms of 14px/em (default em)
+  This ensures these "ratios" remain constant despite changes in EM
 */
 
-@miniSize        : (10 / unit(@emSize));
-@tinySize        : (12 / unit(@emSize));
-@smallSize       : (13 / unit(@emSize));
-@mediumSize      : (14 / unit(@emSize));
-@largeSize       : (16 / unit(@emSize));
-@bigSize         : (18 / unit(@emSize));
-@hugeSize        : (20 / unit(@emSize));
-@massiveSize     : (24 / unit(@emSize));
+@miniSize        : (10 / 14);
+@tinySize        : (12 / 14);
+@smallSize       : (13 / 14);
+@mediumSize      : (14 / 14);
+@largeSize       : (16 / 14);
+@bigSize         : (18 / 14);
+@hugeSize        : (20 / 14);
+@massiveSize     : (24 / 14);
 
 
 /*-------------------
@@ -330,7 +330,10 @@
        Em Sizes
 --------------------*/
 
-/* Rounds sizes to closest pixel, then expresses that exact value in terms of @emSize */
+/*
+  This rounds @size values to the closest pixel then expresses that value in (r)em.
+  This ensures all size values round to exact pixels
+*/
 @mini            : unit( round(@miniSize * @emSize) / @emSize, rem);
 @tiny            : unit( round(@tinySize * @emSize) / @emSize, rem);
 @small           : unit( round(@smallSize * @emSize) / @emSize, rem);
@@ -366,7 +369,8 @@
 --------------------*/
 /*
   These are used to specify exact pixel values in em
-  for things like borders
+  for things like borders that remain constantly
+  sized as emSize adjusts
 
   Since there are many more sizes than names for sizes,
   these are named by their original pixel values.