From 6d1be0be34ffd396358b92b5e42940f6337b84fd Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 14:10:05 -0400
Subject: [PATCH 01/17] Removing a `width:auto` which was overriding

the width for a lot of .select-text
---
 src/renderer/components/general-settings/general-settings.sass | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/renderer/components/general-settings/general-settings.sass b/src/renderer/components/general-settings/general-settings.sass
index 1a6a14af774ba..3c5a69351bcb0 100644
--- a/src/renderer/components/general-settings/general-settings.sass
+++ b/src/renderer/components/general-settings/general-settings.sass
@@ -5,4 +5,3 @@
 // https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
 .select:deep(.select-text)
   min-width: 240px
-  width: auto

From d5e2bc6ed24b9f1a3e4ec67577d463909787598d Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 18:56:19 -0400
Subject: [PATCH 02/17] Making the general-settings component not overflow

---
 src/renderer/components/ft-select/ft-select.css   | 15 ++++++++++++++-
 .../ft-settings-section/ft-settings-section.sass  | 14 +++++++++++---
 .../ft-toggle-switch/ft-toggle-switch.sass        |  4 +++-
 .../general-settings/general-settings.sass        |  3 +++
 4 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/src/renderer/components/ft-select/ft-select.css b/src/renderer/components/ft-select/ft-select.css
index 067c5e0f2f701..adb18f6f52318 100644
--- a/src/renderer/components/ft-select/ft-select.css
+++ b/src/renderer/components/ft-select/ft-select.css
@@ -38,7 +38,7 @@
   font-family: inherit;
   background-color: transparent;
   color: var(--primary-text-color);
-  width: 200px;
+  width: 240px;
   padding: 10px 10px 10px 0;
   font-size: 18px;
   border-radius: 0;
@@ -143,3 +143,16 @@
   pointer-events: none;
   opacity: 0.5;
 }
+
+@media only screen and (max-width: 800px) {
+  .select .select-text {
+    display:block;
+  }
+}
+
+@media only screen and (max-width: 680px) {
+  .select {
+    padding: 0px;
+    margin-right: -15px;
+  }  
+}
\ No newline at end of file
diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 7f1afebd45c80..e4f19e7a3c6a4 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -6,8 +6,12 @@
   &[open]
     padding-bottom: 15px
 
-  @media only screen and (max-width: 680px)
-    width: 90%
+  > div
+    width: 100%
+    padding: 0px 20px
+    box-sizing: border-box
+    @media only screen and (max-width: 800px)
+      margin-bottom: 20px
 
 .sectionLine
   width: 100%
@@ -30,7 +34,7 @@
   justify-content: space-evenly
   align-items: center
 
-  @media only screen and (max-width: 680px)
+  @media only screen and (max-width: 800px)
     grid-template-columns: auto
 
 :deep(.switchColumnGrid)
@@ -52,3 +56,7 @@
 @media only screen and (max-width: 500px)
   :deep(.settingsFlexStart500px)
     justify-content: flex-start
+
+@media only screen and (max-width: 680px)
+  .settingsSection .switchGrid :deep(.text.bottom)
+    left: -40px
\ No newline at end of file
diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
index 74584998256d4..d23f6dc05c922 100644
--- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
+++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
@@ -76,4 +76,6 @@
 
     .switch-input:disabled + &
       background-color: #BDBDBD
-     
+  
+  @media (max-width: 680px)
+    max-width: 240px 
diff --git a/src/renderer/components/general-settings/general-settings.sass b/src/renderer/components/general-settings/general-settings.sass
index 3c5a69351bcb0..271cb8e5a8401 100644
--- a/src/renderer/components/general-settings/general-settings.sass
+++ b/src/renderer/components/general-settings/general-settings.sass
@@ -5,3 +5,6 @@
 // https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
 .select:deep(.select-text)
   min-width: 240px
+  width: auto
+  @media only screen and (max-width: 1000px)
+    max-width: 240px

From df95495a133d136747688b652497dc99175e1213 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 19:39:15 -0400
Subject: [PATCH 03/17] Reducing margin in settings when window is narrow

---
 .../components/ft-settings-section/ft-settings-section.sass     | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index e4f19e7a3c6a4..59919be85d65f 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -2,6 +2,8 @@
   background-color: var(--card-bg-color)
   width: 85%
   margin: 0 auto
+  @media only screen and (max-width: 680px)
+    width: 100%
 
   &[open]
     padding-bottom: 15px

From f5eadd4e06c5a5730aca2e7c4776aa94128469fe Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 20:49:00 -0400
Subject: [PATCH 04/17] Moving invidious instance tooltip to reduce overflow

---
 .../components/ft-settings-section/ft-settings-section.sass   | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 59919be85d65f..f8c496af08115 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -61,4 +61,6 @@
 
 @media only screen and (max-width: 680px)
   .settingsSection .switchGrid :deep(.text.bottom)
-    left: -40px
\ No newline at end of file
+    left: -55px
+  .settingsSection .settingsFlexStart460px :deep(.text.bottom)
+    left: -30px
\ No newline at end of file

From c70810c643f3844c38613bbdc58a12470491f0f5 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 20:57:12 -0400
Subject: [PATCH 05/17] Reducing the width of sliders to be 100% at maximum

Before this change, the preset width `380px` could easily
be wider than the window.
---
 src/renderer/components/ft-slider/ft-slider.css | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/renderer/components/ft-slider/ft-slider.css b/src/renderer/components/ft-slider/ft-slider.css
index bc91c097965a8..8e54660ac3c2f 100644
--- a/src/renderer/components/ft-slider/ft-slider.css
+++ b/src/renderer/components/ft-slider/ft-slider.css
@@ -242,3 +242,9 @@
     box-shadow: 0 0 0 1px rgb(var(--pure-material-surface-rgb, 255, 255, 255)) !important;
     transform: scale(4, 4);
 }
+
+@media only screen and (max-width: 680px) {
+    .pure-material-slider {
+        width: 100%;
+    }
+} 
\ No newline at end of file

From 6e9afe51b29989318a722fd17887b6f0997e7672 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 21:15:53 -0400
Subject: [PATCH 06/17] Reducing overflow in Theme Settings

- Added breakpoint for theme `select`s
- Added breakpoint for the UI scale slider
---
 src/renderer/components/ft-select/ft-select.css     | 13 ++++++++++++-
 .../ft-settings-section/ft-settings-section.sass    |  4 ++--
 .../general-settings/general-settings.sass          |  4 +---
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/renderer/components/ft-select/ft-select.css b/src/renderer/components/ft-select/ft-select.css
index adb18f6f52318..ffd36122a122f 100644
--- a/src/renderer/components/ft-select/ft-select.css
+++ b/src/renderer/components/ft-select/ft-select.css
@@ -144,9 +144,20 @@
   opacity: 0.5;
 }
 
+
+@media only screen and (max-width: 1000px) {
+  .select .select-text {
+    max-width: 240px;
+  }
+}
+
 @media only screen and (max-width: 800px) {
+  .select {
+    width: 100%;
+  }
   .select .select-text {
     display:block;
+    max-width: 100%;
   }
 }
 
@@ -155,4 +166,4 @@
     padding: 0px;
     margin-right: -15px;
   }  
-}
\ No newline at end of file
+}
diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index f8c496af08115..e081c74528c6c 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -61,6 +61,6 @@
 
 @media only screen and (max-width: 680px)
   .settingsSection .switchGrid :deep(.text.bottom)
-    left: -55px
+    left: -85px
   .settingsSection .settingsFlexStart460px :deep(.text.bottom)
-    left: -30px
\ No newline at end of file
+    left: -50px
\ No newline at end of file
diff --git a/src/renderer/components/general-settings/general-settings.sass b/src/renderer/components/general-settings/general-settings.sass
index 271cb8e5a8401..e59787a2c32cb 100644
--- a/src/renderer/components/general-settings/general-settings.sass
+++ b/src/renderer/components/general-settings/general-settings.sass
@@ -5,6 +5,4 @@
 // https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
 .select:deep(.select-text)
   min-width: 240px
-  width: auto
-  @media only screen and (max-width: 1000px)
-    max-width: 240px
+  width: auto
\ No newline at end of file

From 16bddf56ab6e11da33bb296e07542fe57812f2fe Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 21:28:13 -0400
Subject: [PATCH 07/17] Reducing the remaining overflow in settings

This moves all of the tooltips slightly to the left
when the window is narrow to reduce overflow.
---
 .../ft-settings-section/ft-settings-section.sass       | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index e081c74528c6c..af727f909c518 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -60,7 +60,9 @@
     justify-content: flex-start
 
 @media only screen and (max-width: 680px)
-  .settingsSection .switchGrid :deep(.text.bottom)
-    left: -85px
-  .settingsSection .settingsFlexStart460px :deep(.text.bottom)
-    left: -50px
\ No newline at end of file
+  .settingsSection 
+    > div 
+      :deep(.text.bottom)
+        left: -85px
+      > .settingsFlexStart460px :deep(.text.bottom)
+          left: -50px
\ No newline at end of file

From 6a1e19032c8a85d56219188d3fb0cf44801722af Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 21:30:56 -0400
Subject: [PATCH 08/17] Expanding the sponsorblock settings to full width

---
 .../ft-sponsor-block-category/ft-sponsor-block-category.sass    | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.sass b/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.sass
index 66a10f1cf13a8..5eab71ed9cdd1 100644
--- a/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.sass
+++ b/src/renderer/components/ft-sponsor-block-category/ft-sponsor-block-category.sass
@@ -1,5 +1,7 @@
 .sponsorBlockCategory
     margin-top: 30px
     padding: 0 10px
+    @media only screen and (max-width: 680px)
+        width: 100%
     .sponsorTitle
         font-size: x-large

From e47c97f956ba6220c76cabcb1661a757c563de08 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 22:14:55 -0400
Subject: [PATCH 09/17] Moving remaining tooltips into a fixed zone

---
 .../ft-settings-section/ft-settings-section.sass         | 9 ++++++++-
 .../components/ft-toggle-switch/ft-toggle-switch.sass    | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index af727f909c518..bf874fb19dae4 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -65,4 +65,11 @@
       :deep(.text.bottom)
         left: -85px
       > .settingsFlexStart460px :deep(.text.bottom)
-          left: -50px
\ No newline at end of file
+        left: -50px
+
+    @media only screen and (max-width: 560px)
+      :deep(.text.bottom-left)
+        bottom: 70px
+        left: 50vw
+        position: fixed
+        top: auto
\ No newline at end of file
diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
index d23f6dc05c922..d33e7f66258ac 100644
--- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
+++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.sass
@@ -78,4 +78,4 @@
       background-color: #BDBDBD
   
   @media (max-width: 680px)
-    max-width: 240px 
+    max-width: 250px 

From 1f7aa880040e8ede67f4c50471b147f9d73c8ded Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 07:35:01 -0400
Subject: [PATCH 10/17] Floating the tooltip icon to the right

When the display is narrow, the tooltip
can sometimes overflow, and it is very
difficult to predict how it will overflow
if the tool tip icon comes directly after
a locale string.

This change floats those icons into a
centralized location where the tooltip
can be guaranteed to not overflow.
---
 .../ft-settings-section.sass                  | 20 ++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index bf874fb19dae4..80ace77e37604 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -64,12 +64,14 @@
     > div 
       :deep(.text.bottom)
         left: -85px
-      > .settingsFlexStart460px :deep(.text.bottom)
-        left: -50px
-
-    @media only screen and (max-width: 560px)
-      :deep(.text.bottom-left)
-        bottom: 70px
-        left: 50vw
-        position: fixed
-        top: auto
\ No newline at end of file
+      .switch-ctn 
+        max-width: 90%
+    :not(.select)
+      > :deep(.tooltip)
+        display: inline-block
+        position: absolute
+        right: -25px
+        top: 12px
+    .settingsFlexStart460px :deep(.tooltip)
+      right: 0px
+      top: -2px
\ No newline at end of file

From 664bdcb1cdee338de29aaea39226353a92547e05 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 07:36:49 -0400
Subject: [PATCH 11/17] Removing some irrelevant changes

---
 src/renderer/components/ft-select/ft-select.css             | 1 -
 .../components/ft-settings-section/ft-settings-section.sass | 6 +++---
 src/renderer/components/ft-slider/ft-slider.css             | 2 +-
 .../components/general-settings/general-settings.sass       | 2 +-
 4 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/renderer/components/ft-select/ft-select.css b/src/renderer/components/ft-select/ft-select.css
index ffd36122a122f..73cdcbb043d7c 100644
--- a/src/renderer/components/ft-select/ft-select.css
+++ b/src/renderer/components/ft-select/ft-select.css
@@ -144,7 +144,6 @@
   opacity: 0.5;
 }
 
-
 @media only screen and (max-width: 1000px) {
   .select .select-text {
     max-width: 240px;
diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 80ace77e37604..e3c361d21678e 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -2,7 +2,7 @@
   background-color: var(--card-bg-color)
   width: 85%
   margin: 0 auto
-  @media only screen and (max-width: 680px)
+  @media only screen and (max-width: 800px)
     width: 100%
 
   &[open]
@@ -36,7 +36,7 @@
   justify-content: space-evenly
   align-items: center
 
-  @media only screen and (max-width: 800px)
+  @media only screen and (max-width: 680px)
     grid-template-columns: auto
 
 :deep(.switchColumnGrid)
@@ -74,4 +74,4 @@
         top: 12px
     .settingsFlexStart460px :deep(.tooltip)
       right: 0px
-      top: -2px
\ No newline at end of file
+      top: -2px
diff --git a/src/renderer/components/ft-slider/ft-slider.css b/src/renderer/components/ft-slider/ft-slider.css
index 8e54660ac3c2f..b4169819a5365 100644
--- a/src/renderer/components/ft-slider/ft-slider.css
+++ b/src/renderer/components/ft-slider/ft-slider.css
@@ -247,4 +247,4 @@
     .pure-material-slider {
         width: 100%;
     }
-} 
\ No newline at end of file
+}
diff --git a/src/renderer/components/general-settings/general-settings.sass b/src/renderer/components/general-settings/general-settings.sass
index e59787a2c32cb..1a6a14af774ba 100644
--- a/src/renderer/components/general-settings/general-settings.sass
+++ b/src/renderer/components/general-settings/general-settings.sass
@@ -5,4 +5,4 @@
 // https://vue-loader.vuejs.org/guide/scoped-css.html#deep-selectors
 .select:deep(.select-text)
   min-width: 240px
-  width: auto
\ No newline at end of file
+  width: auto

From def68ab4c1b11d174e4b92df65a175f482f3300a Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 07:58:39 -0400
Subject: [PATCH 12/17] Reducing margin on switches

---
 .../components/ft-settings-section/ft-settings-section.sass     | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index e3c361d21678e..d49798a3c349c 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -75,3 +75,5 @@
     .settingsFlexStart460px :deep(.tooltip)
       right: 0px
       top: -2px
+    :deep(.switch-ctn)
+      margin: 10px 7px

From 6abc360fdff78c8b48c8c6c6f0f16f07492f6429 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 08:13:51 -0400
Subject: [PATCH 13/17] Removing bottom margin on the last section

---
 .../components/ft-settings-section/ft-settings-section.sass      | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index d49798a3c349c..3bcbd93ddfb87 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -12,6 +12,7 @@
     width: 100%
     padding: 0px 20px
     box-sizing: border-box
+  > div:not(:last-child)
     @media only screen and (max-width: 800px)
       margin-bottom: 20px
 

From b86094df4a1f4b563920674136ff7e6761fd7e1b Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 08:21:34 -0400
Subject: [PATCH 14/17] Making room for overflow ellipsis

---
 src/renderer/components/ft-select/ft-select.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/renderer/components/ft-select/ft-select.css b/src/renderer/components/ft-select/ft-select.css
index 73cdcbb043d7c..a7a404c9d2d58 100644
--- a/src/renderer/components/ft-select/ft-select.css
+++ b/src/renderer/components/ft-select/ft-select.css
@@ -156,7 +156,7 @@
   }
   .select .select-text {
     display:block;
-    max-width: 100%;
+    max-width: 95%;
   }
 }
 

From fd85ba9b43daeb0d8fc45bfd358384ab09d08806 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 08:43:55 -0400
Subject: [PATCH 15/17] Adding class  `.containsTooltip` to `ft-toggle`

This should make is easier to style the toggles
which contain tooltips specficially.
---
 .../components/ft-settings-section/ft-settings-section.sass    | 2 +-
 src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue  | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 3bcbd93ddfb87..81167c37b59bc 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -65,7 +65,7 @@
     > div 
       :deep(.text.bottom)
         left: -85px
-      .switch-ctn 
+      :deep(.switch-ctn.containsTooltip)
         max-width: 90%
     :not(.select)
       > :deep(.tooltip)
diff --git a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
index 03d8d078fd53b..e5d910e2e3795 100644
--- a/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
+++ b/src/renderer/components/ft-toggle-switch/ft-toggle-switch.vue
@@ -3,7 +3,8 @@
     class="switch-ctn"
     :class="{
       compact,
-      disabled: disabled
+      disabled: disabled,
+      containsTooltip: tooltip.length > 0
     }"
   >
     <input

From 14f260b15ea73cc1743bbec419cbc9366d2c2e44 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 09:00:55 -0400
Subject: [PATCH 16/17] Modifying the media query for tooltips

---
 .../components/ft-settings-section/ft-settings-section.sass | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 81167c37b59bc..6eb37ca99a532 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -65,8 +65,10 @@
     > div 
       :deep(.text.bottom)
         left: -85px
-      :deep(.switch-ctn.containsTooltip)
-        max-width: 90%
+    :deep(.switch-ctn.containsTooltip)
+      left: -10px
+      margin-right: 5px
+      padding: 0px 10px 0px 10px
     :not(.select)
       > :deep(.tooltip)
         display: inline-block

From 98093d2fb68776c4d4231d757eef717cb8a3eeb2 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sun, 9 Oct 2022 09:18:10 -0400
Subject: [PATCH 17/17] Adding a media query to reduce data settings margin

---
 .../components/ft-settings-section/ft-settings-section.sass     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/renderer/components/ft-settings-section/ft-settings-section.sass b/src/renderer/components/ft-settings-section/ft-settings-section.sass
index 6eb37ca99a532..c41023fa0fdd9 100644
--- a/src/renderer/components/ft-settings-section/ft-settings-section.sass
+++ b/src/renderer/components/ft-settings-section/ft-settings-section.sass
@@ -12,7 +12,7 @@
     width: 100%
     padding: 0px 20px
     box-sizing: border-box
-  > div:not(:last-child)
+  > div:not(:last-child):not(.ft-flex-box)
     @media only screen and (max-width: 800px)
       margin-bottom: 20px