From d20f247a639d16d1d6258751ef24bbff9dc439da Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <daisho7308+f@gmail.com>
Date: Tue, 19 Dec 2023 21:12:36 +0900
Subject: [PATCH] =?UTF-8?q?(fix)=204K=E3=83=A2=E3=83=8B=E3=82=BF=E3=83=BC?=
 =?UTF-8?q?=E3=81=A7=E4=B8=80=E9=83=A8=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=8C?=
 =?UTF-8?q?=E8=A6=8B=E3=81=88=E3=81=A5=E3=82=89=E3=81=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/g/Nav.vue | 6 +++---
 tailwind.config.ts   | 3 +++
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/components/g/Nav.vue b/components/g/Nav.vue
index 95bf9eb7..981fbf1e 100644
--- a/components/g/Nav.vue
+++ b/components/g/Nav.vue
@@ -51,7 +51,7 @@
                 </button>
                 <ul class="hidden lg:col-span-4 lg:space-x-4 lg:flex justify-center">
                     <li>
-                        <button :class="['hover:opacity-80', { 'text-white': (landing && scrollPos >= -40) }]" @click="rotateColorMode()" aria-label="Change Color Mode">
+                        <button :class="['hover:opacity-80', { 'text-white 3xl:text-slate-800 3xl:dark:text-slate-200': (landing && scrollPos >= -40) }]" @click="rotateColorMode()" aria-label="Change Color Mode">
                             <ClientOnly>
                                 <SunIcon class="h-5 w-5" v-if="colorMode.preference === 'light'" />
                                 <MoonIcon class="h-5 w-5" v-else-if="colorMode.preference === 'dark'" />
@@ -60,7 +60,7 @@
                         </button>
                     </li>
                     <li class="relative group">
-                        <button class="hover:opacity-80"><I18nIcon :class="['h-5 w-5', { 'text-white': (landing && scrollPos >= -40) }]" /><span class="sr-only">{{ $t('_nav.switchLang') }}</span></button>
+                        <button class="hover:opacity-80"><I18nIcon :class="['h-5 w-5', { 'text-white 3xl:text-slate-800 3xl:dark:text-slate-200': (landing && scrollPos >= -40) }]" /><span class="sr-only">{{ $t('_nav.switchLang') }}</span></button>
                         <div class="absolute top-6 right-0 hidden group-hover:block z-[9955]">
                             <ul class="px-4 py-2 bg-slate-50 dark:bg-slate-800 rounded-lg shadow-lg space-y-1">
                                 <li v-for="locale in locales">
@@ -72,7 +72,7 @@
                         </div>
                     </li>
                     <li class="border-l"></li>
-                    <li v-for="item in NavData.right" :class="['transition-colors', { 'text-white': (landing && scrollPos >= -40) }]">
+                    <li v-for="item in NavData.right" :class="['transition-colors', { 'text-white 3xl:text-slate-800 3xl:dark:text-slate-200': (landing && scrollPos >= -40) }]">
                         <GNuxtLink :to="item.to" class="hover:opacity-80">
                             <component v-if="item.icon" :is="item.icon" class="h-5 w-5" />
                             <template v-else>
diff --git a/tailwind.config.ts b/tailwind.config.ts
index e9f709a0..f6a5c4bd 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -36,6 +36,9 @@ export default <Config> {
           '950': '#223201',
         },
       },
+      screens: {
+        '3xl': '1970px',
+      },
     },
     fontFamily: {
       ...defaultTheme.fontFamily,