IMPORTANT: Replace all rem units to px

1 files changed, 28 insertions, 8 deletions

diff --git a/src/variables.less b/src/variables.less
index 0b7ba53..42eec35 100644
--- a/src/variables.less
+++ b/src/variables.less
@@ -5,9 +5,10 @@
 @html-line-height: 1.428571429;
 @body-bg: @bg-color-light;
 @body-font-color: @dark-color;
-@font-size: 1.4rem;
-@font-size-sm: 1.2rem;
-@font-size-lg: 1.6rem;
+@font-size: 14px;
+@font-size-sm: 12px;
+@font-size-lg: 16px;
+@line-height: 20px;
 
 // Fonts
 // Credit: https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/
@@ -18,12 +19,31 @@
 @cjk-ko-font-family: @base-font-family, "Malgun Gothic", @fallback-font-family;
 @body-font-family: @base-font-family, @fallback-font-family;
 
+// Unit sizes
+@unit-0: 1px;
+@unit-h: 2px;
+@unit-1: 4px;
+@unit-2: 8px;
+@unit-3: 12px;
+@unit-4: 16px;
+@unit-5: 20px;
+@unit-6: 24px;
+@unit-7: 28px;
+@unit-8: 32px;
+@unit-9: 36px;
+@unit-10: 40px;
+@unit-12: 48px;
+@unit-16: 64px;
+
 // Sizes
-@layout-padding: 1rem;
-@layout-padding-lg: 1.5rem;
-@control-min-width: 18rem;
-@border-radius: .2rem;
-@border-width: .1rem;
+@layout-spacing: 10px;
+@layout-spacing-sm: 5px;
+@layout-spacing-lg: 15px;
+@control-min-width: 180px;
+@control-max-width: 320px;
+@border-radius: 2px;
+@border-width: 1px;
+@border-width-lg: 2px;
 
 // Colors
 // Core colors