(fix) App switcher UI tweaks (#830)

openmrs · Dec 4, 2023 · 4c8a8fb · 4c8a8fb
1 parent dd97b8d
commit 4c8a8fb
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 12 deletions.
diff --git a/packages/apps/esm-login-app/src/logout/logout.scss b/packages/apps/esm-login-app/src/logout/logout.scss
@@ -2,7 +2,10 @@
 
 .logout {
   padding-right: 0rem;
-  @include brand-02(background-color);
   @extend .productiveHeading01;
   width: 16rem;
+
+  &:hover {
+    @include brand-01(background-color);
+  }
 }
diff --git a/.../apps/esm-offline-tools-app/src/offline-actions/offline-actions-mode-button.component.tsx b/.../apps/esm-offline-tools-app/src/offline-actions/offline-actions-mode-button.component.tsx
@@ -27,16 +27,18 @@ const OfflineActionsModeButton: React.FC = () => {
 
   return (
     <div className={styles.offlineModeButtonContainer}>
-      <Network_3 size={20} />
-      <div onClick={doNotCloseMenu} role="none">
-        <span>{t("offlineReady", "Offline Ready")}</span>
-        <Toggle
-          className={styles.toggle}
-          id="offlineModeSwitch"
-          toggled={active}
-          onToggle={toggle}
-        />
+      <div>
+        <Network_3 size={20} />
+        <span onClick={doNotCloseMenu} role="none">
+          {t("offlineReady", "Offline Ready")}
+        </span>
       </div>
+      <Toggle
+        className={styles.toggle}
+        id="offlineModeSwitch"
+        toggled={active}
+        onToggle={toggle}
+      />
     </div>
   );
 };

diff --git a/packages/apps/esm-offline-tools-app/src/offline-actions/offline-actions-mode-button.scss b/packages/apps/esm-offline-tools-app/src/offline-actions/offline-actions-mode-button.scss
@@ -5,7 +5,7 @@
   display: flex;
   flex-direction: row;
   width: 16rem;
-  justify-content: flex-start;
+  justify-content: space-between;
   color: $field-01;
   align-items: center;
   @extend .bodyLong01;
@@ -17,7 +17,7 @@
   }
 
   :global(.cds--toggle) {
-    margin: 0 0 1rem 1rem;
+    margin: 0 1rem;
   }
 
   :global(.cds--toggle__text) {