From ce3d53942df529f4a65452c5153e82b24efa6fc4 Mon Sep 17 00:00:00 2001
From: e11sy <Egoramurin@gmail.com>
Date: Fri, 19 Jul 2024 18:37:53 +0300
Subject: [PATCH 1/4] fixed theme changer styles

---
 src/presentation/pages/Settings.vue | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/presentation/pages/Settings.vue b/src/presentation/pages/Settings.vue
index 68ca3353..7da41379 100644
--- a/src/presentation/pages/Settings.vue
+++ b/src/presentation/pages/Settings.vue
@@ -58,10 +58,12 @@
                 <DarkColorShemeIcon v-if="scheme === 'Dark'" />
               </template>
               <template
-                v-if="colorScheme === scheme.toLowerCase()"
                 #right
               >
-                <Icon name="Check" />
+                <Icon
+                  name="Check"
+                  :style="colorScheme === scheme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
+                />
               </template>
             </Row>
           </Section>
@@ -82,10 +84,12 @@
                 <ThemePreview :theme="theme" />
               </template>
               <template
-                v-if="themeBase === theme.toLowerCase()"
                 #right
               >
-                <Icon name="Check" />
+                <Icon
+                  name="Check"
+                  :style="themeBase === theme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
+                />
               </template>
             </Row>
           </Section>
@@ -106,10 +110,12 @@
                 <ThemePreview :theme="theme" />
               </template>
               <template
-                v-if="themeAccent === theme.toLowerCase()"
                 #right
               >
-                <Icon name="Check" />
+                <Icon
+                  name="Check"
+                  :style="themeAccent === theme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
+                />
               </template>
             </Row>
           </Section>

From cf708cf531dee4567a48f3345517d8a0efa31d3c Mon Sep 17 00:00:00 2001
From: e11sy <Egoramurin@gmail.com>
Date: Fri, 19 Jul 2024 19:43:24 +0300
Subject: [PATCH 2/4] fix row styles for icon always to have space

---
 codex-ui/src/vue/components/row/Row.vue |  1 +
 src/presentation/pages/Settings.vue     | 18 ++++++------------
 2 files changed, 7 insertions(+), 12 deletions(-)

diff --git a/codex-ui/src/vue/components/row/Row.vue b/codex-ui/src/vue/components/row/Row.vue
index 1f84e7e8..20c16403 100644
--- a/codex-ui/src/vue/components/row/Row.vue
+++ b/codex-ui/src/vue/components/row/Row.vue
@@ -102,6 +102,7 @@ defineProps<{
   }
 
   &__center {
+    height: 20px;
     flex: 1;
     display: flex;
     flex-direction: column;
diff --git a/src/presentation/pages/Settings.vue b/src/presentation/pages/Settings.vue
index 7da41379..68ca3353 100644
--- a/src/presentation/pages/Settings.vue
+++ b/src/presentation/pages/Settings.vue
@@ -58,12 +58,10 @@
                 <DarkColorShemeIcon v-if="scheme === 'Dark'" />
               </template>
               <template
+                v-if="colorScheme === scheme.toLowerCase()"
                 #right
               >
-                <Icon
-                  name="Check"
-                  :style="colorScheme === scheme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
-                />
+                <Icon name="Check" />
               </template>
             </Row>
           </Section>
@@ -84,12 +82,10 @@
                 <ThemePreview :theme="theme" />
               </template>
               <template
+                v-if="themeBase === theme.toLowerCase()"
                 #right
               >
-                <Icon
-                  name="Check"
-                  :style="themeBase === theme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
-                />
+                <Icon name="Check" />
               </template>
             </Row>
           </Section>
@@ -110,12 +106,10 @@
                 <ThemePreview :theme="theme" />
               </template>
               <template
+                v-if="themeAccent === theme.toLowerCase()"
                 #right
               >
-                <Icon
-                  name="Check"
-                  :style="themeAccent === theme.toLowerCase() ? 'opacity: 1;' : 'opacity: 0;'"
-                />
+                <Icon name="Check" />
               </template>
             </Row>
           </Section>

From e8f83f7b9c7ceabda0878994e677b376e6282cb3 Mon Sep 17 00:00:00 2001
From: e11sy <Egoramurin@gmail.com>
Date: Fri, 19 Jul 2024 19:44:21 +0300
Subject: [PATCH 3/4] typo fix

---
 codex-ui/src/vue/components/row/Row.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/codex-ui/src/vue/components/row/Row.vue b/codex-ui/src/vue/components/row/Row.vue
index 20c16403..f673a8d5 100644
--- a/codex-ui/src/vue/components/row/Row.vue
+++ b/codex-ui/src/vue/components/row/Row.vue
@@ -102,7 +102,7 @@ defineProps<{
   }
 
   &__center {
-    height: 20px;
+    min-height: 20px;
     flex: 1;
     display: flex;
     flex-direction: column;

From f63991e8c57594d0bfe0863e077bcc095706cf37 Mon Sep 17 00:00:00 2001
From: e11sy <Egoramurin@gmail.com>
Date: Sat, 20 Jul 2024 17:53:27 +0300
Subject: [PATCH 4/4] changing Row style from settings page

---
 codex-ui/src/vue/components/row/Row.vue | 1 -
 src/presentation/pages/Settings.vue     | 6 +++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/codex-ui/src/vue/components/row/Row.vue b/codex-ui/src/vue/components/row/Row.vue
index f673a8d5..1f84e7e8 100644
--- a/codex-ui/src/vue/components/row/Row.vue
+++ b/codex-ui/src/vue/components/row/Row.vue
@@ -102,7 +102,6 @@ defineProps<{
   }
 
   &__center {
-    min-height: 20px;
     flex: 1;
     display: flex;
     flex-direction: column;
diff --git a/src/presentation/pages/Settings.vue b/src/presentation/pages/Settings.vue
index 68ca3353..ed51760c 100644
--- a/src/presentation/pages/Settings.vue
+++ b/src/presentation/pages/Settings.vue
@@ -230,7 +230,7 @@ async function uninstallClicked(toolId: string) {
 }
 </script>
 
-<style scoped lang="postcss" module>
+<style lang="postcss" module>
 .container {
   display: grid;
   padding: var(--spacing-xxl) 0;
@@ -257,6 +257,10 @@ async function uninstallClicked(toolId: string) {
     &-theme-row {
       cursor: pointer;
 
+      :global(.codex-row__center) {
+        min-height: 20px;
+      }
+
       &:first-of-type {
         border-top-left-radius: var(--radius-field);
         border-top-right-radius: var(--radius-field);