From 246dcf93e4626e68abbc135f6635613b704416b7 Mon Sep 17 00:00:00 2001
From: eddie <66155195+just-toby@users.noreply.github.com>
Date: Wed, 1 Mar 2023 19:16:09 -0800
Subject: [PATCH] fix: settings tooltips alignment/sizing (#524)

* fix: settings gtooltips alignment/sizing

* fix: test update
---
 .../Swap/Settings/RouterPreferenceToggle.tsx  | 20 ++++++++++---------
 src/components/Swap/Settings/components.tsx   |  2 +-
 .../__snapshots__/Header.test.tsx.snap        |  4 ++++
 3 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/components/Swap/Settings/RouterPreferenceToggle.tsx b/src/components/Swap/Settings/RouterPreferenceToggle.tsx
index b4c26952e..14df132da 100644
--- a/src/components/Swap/Settings/RouterPreferenceToggle.tsx
+++ b/src/components/Swap/Settings/RouterPreferenceToggle.tsx
@@ -32,14 +32,16 @@ export default function RouterPreferenceToggle() {
   }
 
   return (
-    <ThemedText.Subhead2 color="secondary">
-      <Row flex align="center">
-        <Label
-          name={<Trans>Auto Router API</Trans>}
-          tooltip={<Trans>Use the Uniswap Labs API to get faster quotes.</Trans>}
-        />
-        <Toggle onToggle={onToggle} checked={routerPreference === RouterPreference.API} />
-      </Row>
-    </ThemedText.Subhead2>
+    <Row flex align="center">
+      <Label
+        name={
+          <ThemedText.Subhead2 color="primary">
+            <Trans>Auto Router API</Trans>
+          </ThemedText.Subhead2>
+        }
+        tooltip={<Trans>Use the Uniswap Labs API to get faster quotes.</Trans>}
+      />
+      <Toggle onToggle={onToggle} checked={routerPreference === RouterPreference.API} />
+    </Row>
   )
 }
diff --git a/src/components/Swap/Settings/components.tsx b/src/components/Swap/Settings/components.tsx
index 2ea0b4b86..6bb6f3216 100644
--- a/src/components/Swap/Settings/components.tsx
+++ b/src/components/Swap/Settings/components.tsx
@@ -43,7 +43,7 @@ export function Label({ name, tooltip }: LabelProps) {
     <Row gap={0.5} justify="flex-start" flex align="center">
       <ThemedText.Subhead2>{name}</ThemedText.Subhead2>
       {tooltip && (
-        <Tooltip placement="top" contained icon={Info}>
+        <Tooltip placement="top" contained icon={Info} iconProps={{ style: { height: '100%' } }}>
           <ThemedText.Caption>{tooltip}</ThemedText.Caption>
         </Tooltip>
       )}
diff --git a/src/components/__snapshots__/Header.test.tsx.snap b/src/components/__snapshots__/Header.test.tsx.snap
index 37393d442..a49e114e5 100644
--- a/src/components/__snapshots__/Header.test.tsx.snap
+++ b/src/components/__snapshots__/Header.test.tsx.snap
@@ -99,6 +99,7 @@ Object {
                                 stroke-linecap="round"
                                 stroke-linejoin="round"
                                 stroke-width="2"
+                                style="height: 100%;"
                                 viewBox="0 0 24 24"
                                 width="24"
                                 xmlns="http://www.w3.org/2000/svg"
@@ -242,6 +243,7 @@ Object {
                                 stroke-linecap="round"
                                 stroke-linejoin="round"
                                 stroke-width="2"
+                                style="height: 100%;"
                                 viewBox="0 0 24 24"
                                 width="24"
                                 xmlns="http://www.w3.org/2000/svg"
@@ -453,6 +455,7 @@ Object {
                               stroke-linecap="round"
                               stroke-linejoin="round"
                               stroke-width="2"
+                              style="height: 100%;"
                               viewBox="0 0 24 24"
                               width="24"
                               xmlns="http://www.w3.org/2000/svg"
@@ -596,6 +599,7 @@ Object {
                               stroke-linecap="round"
                               stroke-linejoin="round"
                               stroke-width="2"
+                              style="height: 100%;"
                               viewBox="0 0 24 24"
                               width="24"
                               xmlns="http://www.w3.org/2000/svg"