IMPORTANT: Replace all rem units to px

5 files changed, 42 insertions, 42 deletions

diff --git a/src/utilities/display.less b/src/utilities/display.less
index f6a54b5..a00aa4a 100644
--- a/src/utilities/display.less
+++ b/src/utilities/display.less
@@ -34,12 +34,12 @@
 .text-assistive {
   border: 0;
   clip: rect(0,0,0,0);
-  height: .1rem;
-  margin: -.1rem;
+  height: 1px;
+  margin: -1px;
   overflow: hidden;
   padding: 0;
   position: absolute;
-  width: .1rem;
+  width: 1px;
 }
 .hand {
   cursor: pointer;
diff --git a/src/utilities/divider.less b/src/utilities/divider.less
index fe30f68..f59d0ea 100644
--- a/src/utilities/divider.less
+++ b/src/utilities/divider.less
@@ -10,35 +10,35 @@
     content: attr(data-content);
     display: inline-block;
     font-size: @font-size-sm;
-    padding: 0 .8rem;
-    transform: translateY(-1.1rem);
+    padding: 0 @unit-2;
+    transform: translateY(-@font-size-sm + @border-width);
   }
 }
 
 .divider {
   border-top: @border-width solid @border-color;
-  height: .1rem;
-  margin: 1rem 0;
+  height: @border-width;
+  margin: @layout-spacing 0;
 }
 
 .divider-vert {
   display: block;
-  padding: @layout-padding;
+  padding: @layout-spacing;
 
   &::before {
     border-left: @border-width solid @border-color;
-    bottom: @layout-padding;
+    bottom: @layout-spacing;
     content: "";
     display: block;
     left: 50%;
     position: absolute;
-    top: @layout-padding;
+    top: @layout-spacing;
     transform: translateX(-50%);
   }
 
   &[data-content]::after {
     left: 50%;
-    padding: .4rem 0;
+    padding: @unit-1 0;
     position: absolute;
     top: 50%;
     transform: translate(-50%, -50%);
diff --git a/src/utilities/loading.less b/src/utilities/loading.less
index 6f8b6e5..8b5c784 100644
--- a/src/utilities/loading.less
+++ b/src/utilities/loading.less
@@ -1,24 +1,24 @@
 // Loading
 .loading {
   color: transparent !important;
-  min-height: 1.6rem;
+  min-height: @unit-4;
   pointer-events: none;
   position: relative;
   &::after {
     animation: loading 500ms infinite linear;
-    border: .2rem solid @primary-color;
-    border-radius: .8rem;
+    border: @border-width-lg solid @primary-color;
+    border-radius: @unit-2;
     border-right-color: transparent;
     border-top-color: transparent;
     content: "";
     display: block;
-    height: 1.6rem;
+    height: @unit-4;
     left: 50%;
-    margin-left: -.8rem;
-    margin-top: -.8rem;
+    margin-left: -@unit-2;
+    margin-top: -@unit-2;
     position: absolute;
     top: 50%;
-    width: 1.6rem;
+    width: @unit-4;
     z-index: @zindex-0;
   }
 }
diff --git a/src/utilities/position.less b/src/utilities/position.less
index c71af85..71957d5 100644
--- a/src/utilities/position.less
+++ b/src/utilities/position.less
@@ -27,64 +27,64 @@
 
 // Spacing
 .mt-10 {
-  margin-top: 1rem;
+  margin-top: 10px;
 }
 .mr-10 {
-  margin-right: 1rem;
+  margin-right: 10px;
 }
 .mb-10 {
-  margin-bottom: 1rem;
+  margin-bottom: 10px;
 }
 .ml-10 {
-  margin-left: 1rem;
+  margin-left: 10px;
 }
 .m-10 {
-  margin: 1rem;
+  margin: 10px;
 }
 .mt-5 {
-  margin-top: .5rem;
+  margin-top: 5px;
 }
 .mr-5 {
-  margin-right: .5rem;
+  margin-right: 5px;
 }
 .mb-5 {
-  margin-bottom: .5rem;
+  margin-bottom: 5px;
 }
 .ml-5 {
-  margin-left: .5rem;
+  margin-left: 5px;
 }
 .m-5 {
-  margin: .5rem;
+  margin: 5px;
 }
 
 .pt-10 {
-  padding-top: 1rem;
+  padding-top: 10px;
 }
 .pr-10 {
-  padding-right: 1rem;
+  padding-right: 10px;
 }
 .pb-10 {
-  padding-bottom: 1rem;
+  padding-bottom: 10px;
 }
 .pl-10 {
-  padding-left: 1rem;
+  padding-left: 10px;
 }
 .p-10 {
-  padding: 1rem;
+  padding: 10px;
 }
 .pt-5 {
-  padding-top: .5rem;
+  padding-top: 5px;
 }
 .pr-5 {
-  padding-right: .5rem;
+  padding-right: 5px;
 }
 .pb-5 {
-  padding-bottom: .5rem;
+  padding-bottom: 5px;
 }
 .pl-5 {
-  padding-left: .5rem;
+  padding-left: 5px;
 }
 .p-5 {
-  padding: .5rem;
+  padding: 5px;
 }
 
diff --git a/src/utilities/shadow.less b/src/utilities/shadow.less
index 9d8ff2a..33086ad 100644
--- a/src/utilities/shadow.less
+++ b/src/utilities/shadow.less
@@ -3,14 +3,14 @@
   .shadow-variant(0);
 }
 .shadow-1 {
-  .shadow-variant(.1rem);
+  .shadow-variant(1px);
 }
 .shadow-2 {
-  .shadow-variant(.2rem);
+  .shadow-variant(2px);
 }
 .shadow-3 {
-  .shadow-variant(.3rem);
+  .shadow-variant(3px);
 }
 .shadow-4 {
-  .shadow-variant(.4rem);
+  .shadow-variant(4px);
 }