OIS-24: improved styles that were not supporting RTL

OpenLMIS · Sep 9, 2024 · 8eeee2c · 8eeee2c
1 parent ea68441
commit 8eeee2c
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 19 deletions.
diff --git a/src/openlmis-auth/_auth-modal.scss b/src/openlmis-auth/_auth-modal.scss
@@ -27,7 +27,7 @@
         overflow: hidden;
 
         & > h1 {
-            margin-right: auto;
+            @include margin-right(auto);
             word-break: normal !important;
         }
 
@@ -50,7 +50,7 @@
             background-size: 30% auto;
         }
 
-        padding: 1em 1em 1em 50% !important;
+        @include padding(1em, 1em, 1em, 50%);
 
         & > .form-desc,
         & > form > fieldset {
@@ -76,15 +76,15 @@
             }
             @media screen and (max-width: $res-xs) {
                 position: relative;
-                right: 0px;
+                @include right(0px);
                 bottom: 0px;
             }
         }
     }
 
     .modal-footer {
         border-top: none;
-        text-align: right;
+        @include text-align(right);
         padding: 0 !important;
         margin: 0;
         display: flex;

diff --git a/src/openlmis-auth/_auth.scss b/src/openlmis-auth/_auth.scss
@@ -5,9 +5,9 @@ body {
 .auth {
   position: absolute;
   top: 50%;
-  left: 50%;
+  @include left(50%);
   width: 50em;
-  margin-left: -24em;
+  @include margin-left(-24em);
   margin-top: -15.5em;
   box-shadow: 0 0 1em $dark-gray;
   border: 0.1em solid white;

diff --git a/src/openlmis-navigation/_navigation.scss b/src/openlmis-navigation/_navigation.scss
@@ -95,8 +95,8 @@ header > .navbar {
   }
   .navbar-right{
     margin-top: 10px;
-    margin-right: 0em;
-    margin-left: 1em;
+    @include margin-left(1em);
+    @include margin-right(0em);
   }
 
   /* TOP LEVEL ITEMS */
@@ -152,7 +152,7 @@ header > .navbar {
           content: "";
           position:absolute;
           top: -0.4em;
-          left: 2.2em;
+          @include left(2.2em);
           width: 0em;
           height: 0em;
           border-left: 0.4em solid transparent;
@@ -167,7 +167,7 @@ header > .navbar {
 
   .dropdown-menu {
     top: 90%;
-    @include left(auto);
+    @include text-align(left);
     background-image: linear-gradient(to bottom, $background-color 10%, $background-color-alt 100%);
     li > a:hover{
       background-color: transparent;
@@ -181,22 +181,21 @@ header > .navbar {
 
     > .dropdown-menu {
       top:0;
-      left:100%;
+      @include left(100%);
       margin-top:-6px;
     }
 
     > a:after {
       display:block;
       content:" ";
-      float:right;
+      @include float(right);
       width:0;
       height:0;
-      border-color:transparent;
-      border-style:solid;
-      border-width:5px 0 5px 5px;
-      border-left-color:#cccccc;
+      border: transparent solid 5px;
+      @include border-right(transparent solid 0px);
+      @include border-left(#cccccc solid 5px);
       margin-top:5px;
-      margin-right:-10px;
+      @include margin-right(-10px);
     }
   }
   .dropdown-submenu:hover {
@@ -212,8 +211,12 @@ header > .navbar {
     float:none;
 
     >.dropdown-menu {
-      left:-100%;
-      margin-left:10px;
+      @include left(-100%);
+      @include margin-left(10px);
     }
   }
 }
+
+.dropdown-menu {
+  @include text-align(left);
+}