refactor(console): fix switch styles (#6132)

logto-io · Jul 1, 2024 · 4727062 · 4727062
1 parent 1e0f0bc
commit 4727062
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/packages/console/src/components/ConnectorForm/GoogleOneTapCard/index.module.scss b/packages/console/src/components/ConnectorForm/GoogleOneTapCard/index.module.scss
@@ -4,6 +4,12 @@
   width: 200px;
 }
 
+.oneTapSwitch {
+  display: flex;
+  gap: _.unit(6);
+  align-items: center;
+}
+
 .oneTapConfig {
   display: flex;
   gap: _.unit(2);

diff --git a/packages/console/src/components/ConnectorForm/GoogleOneTapCard/index.tsx b/packages/console/src/components/ConnectorForm/GoogleOneTapCard/index.tsx
@@ -41,14 +41,14 @@ function GoogleOneTapCard() {
       <FormField title="connector_details.google_one_tap.enable_google_one_tap">
         <Switch
           description={
-            <>
+            <div className={styles.oneTapSwitch}>
               <img
                 className={styles.figure}
                 src={themeToFigure[theme]}
                 alt="Google One Tap figure"
               />
               {t('enable_google_one_tap_description')}
-            </>
+            </div>
           }
           {...register('rawConfig.oneTap.isEnabled')}
         />

diff --git a/packages/console/src/ds-components/Switch/index.module.scss b/packages/console/src/ds-components/Switch/index.module.scss
@@ -63,9 +63,6 @@
   .label {
     flex: 1;
     font: var(--font-body-2);
-    display: flex;
-    gap: _.unit(6);
-    align-items: center;
   }
 
   &.error {