fix: use em instead of rem

php-flasher · Dec 25, 2022 · d71c14d · d71c14d
1 parent 675bf3e
commit d71c14d
Showing 1 changed file with 22 additions and 22 deletions.
diff --git a/packages/flasher/src/flasher.scss b/packages/flasher/src/flasher.scss
@@ -4,34 +4,34 @@
 
 .fl-main-container {
   position: fixed;
-  width: 24rem;
+  width: 24em;
   z-index: 99999;
   transition: all 1s ease-in-out;
 
   @media only screen and (max-width: 480px) {
     width: auto;
-    left: 0.5rem;
-    right: 0.5rem;
+    left: 0.5em;
+    right: 0.5em;
   }
 
   &[data-position^="top-"] {
-    top: 0.5rem;
+    top: 0.5em;
   }
 
   &[data-position^="bottom-"] {
-    bottom: 0.5rem;
+    bottom: 0.5em;
   }
 
   &[data-position$="-right"] {
-    right: 0.5rem;
+    right: 0.5em;
 
     .fl-container {
       transform: translateX(110%);
     }
   }
 
   &[data-position$="-left"] {
-    left: 0.5rem;
+    left: 0.5em;
 
     .fl-container {
       transform: translateX(-110%);
@@ -61,7 +61,7 @@
 
   .fl-progress-bar {
     display: flex;
-    height: 0.125rem;
+    height: 0.125em;
     margin-left: -1px;
   }
 
@@ -92,15 +92,15 @@ $types: (success: #059669FF, info: #2563EBFF, warning: #D97706FF, error: #DC2626
   }
 
   .fl-main-container .fl-container.fl-flasher.fl-#{$type} {
-    border-left: 0.8rem solid $color;
+    border-left: 0.8em solid $color;
 
     &.fl-rtl {
-      border-right: 0.8rem solid $color;
+      border-right: 0.8em solid $color;
       border-left: none;
     }
 
     &:not(.fl-rtl) {
-      border-left: 0.8rem solid $color;
+      border-left: 0.8em solid $color;
       border-right: none;
     }
 
@@ -220,49 +220,49 @@ $types: (success: #059669FF, info: #2563EBFF, warning: #D97706FF, error: #DC2626
   line-height: 1.5;
   background-color: rgb(255, 255, 255);
   color: rgb(75, 85, 99);
-  margin-top: 0.5rem;
+  margin-top: 0.5em;
 
 
   cursor: pointer;
   box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
   word-break: break-word;
 
   &.fl-rtl {
-    border-radius: 0 0.375rem 0.375rem 0;
+    border-radius: 0 0.375em 0.375em 0;
   }
 
   &:not(.fl-rtl) {
-    border-radius: 0.375rem 0 0 0.375rem;
+    border-radius: 0.375em 0 0 0.375em;
   }
 
   .fl-content {
     display: flex;
-    padding: 0.75rem;
+    padding: 0.75em;
     align-items: center;
   }
 
   .fl-icon {
-    font-size: 2.5rem;
+    font-size: 2.5em;
   }
 
   .fl-title, .fl-message {
     display: block;
-    margin-left: 1rem;
-    margin-right: 1rem;
-    line-height: 1.25rem;
+    margin-left: 1em;
+    margin-right: 1em;
+    line-height: 1.25em;
 
     &:first-letter {
       text-transform: uppercase;
     }
   }
 
   .fl-title {
-    font-size: 1rem;
+    font-size: 1em;
     font-weight: bold;
   }
 
   .fl-message {
-    margin-top: 0.25rem;
-    font-size: 0.875rem;
+    margin-top: 0.25em;
+    font-size: 0.875em;
   }
 }