From 9fc18926ab2b34acf4c8f23ab640df798547bbf3 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Fri, 7 Nov 2025 16:44:12 +0100
Subject: [PATCH] feat: put theme swap in the style settings

---
 .node-version                 | 2 +-
 src/components/FontChange.vue | 4 ++++
 src/components/HeaderNote.vue | 4 +---
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/.node-version b/.node-version
index fdb2eaa..d135def 100644
--- a/.node-version
+++ b/.node-version
@@ -1 +1 @@
-22.11.0
\ No newline at end of file
+22.12.0
\ No newline at end of file
diff --git a/src/components/FontChange.vue b/src/components/FontChange.vue
index d5ec446..d36eeee 100644
--- a/src/components/FontChange.vue
+++ b/src/components/FontChange.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from "vue"
 import { useUserRepoStore } from "../modules/repo/store/userRepo.store"
+import ThemeSwap from "@/components/ThemeSwap.vue"
 
 const store = useUserRepoStore()
 
@@ -13,6 +14,8 @@ const fontSizes = Array.from({ length: 7 }, (_, i) => `${9 + i * 2}pt`)
 
 <template>
   <div class="font-change" v-if="sortedFontFamilies.length > 0">
+    <theme-swap />
+
     <select
       class="select"
       :value="store.userSettings?.chosenFontFamily"
@@ -40,6 +43,7 @@ const fontSizes = Array.from({ length: 7 }, (_, i) => `${9 + i * 2}pt`)
   flex: 1;
   display: flex;
   flex-wrap: wrap;
+  align-items: center;
   gap: 1rem;
 
   select {
diff --git a/src/components/HeaderNote.vue b/src/components/HeaderNote.vue
index e67dcad..be3f5ba 100644
--- a/src/components/HeaderNote.vue
+++ b/src/components/HeaderNote.vue
@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import ThemeSwap from "@/components/ThemeSwap.vue"
 import FontChange from "@/components/FontChange.vue"
 
 defineProps<{ user: string; repo: string }>()
@@ -130,14 +129,13 @@ defineProps<{ user: string; repo: string }>()
     </router-link>
     <dialog id="font_modal" class="modal">
       <div class="modal-box">
-        <h3 class="text-lg font-bold">Font settings</h3>
+        <h3 class="text-lg font-bold">Style settings</h3>
         <font-change />
       </div>
       <form method="dialog" class="modal-backdrop">
         <button></button>
       </form>
     </dialog>
-    <theme-swap />
   </header>
 </template>