chore(gui-v2): add dark styles for language switcher

packages/nc-gui-v2/components/general/Language.vue

@@ -38,18 +38,18 @@ onMounted(() => {
     <template #activator="{ props }">
       <MaterialSymbolsTranslate class="md:text-xl cursor-pointer" @click="props.onClick" />
     </template>
-    <v-list class="min-w-50 max-h-90vh overflow-auto !py-0 scrollbar-thin-primary">
+    <v-list class="scrollbar min-w-50 max-h-90vh overflow-auto !py-0 dark:(!bg-gray-800 !text-white)">
       <v-list-item
         v-for="lang of languages"
         :key="lang.value"
-        :class="lang === locale ? '!bg-primary/10 text-primary' : ''"
+        :class="lang === locale ? '!bg-primary/10 text-primary dark:(!bg-gray-700 !text-secondary)' : ''"
         class="!min-h-8 group"
         :value="lang"
         @click="changeLanguage(lang)"
       >
         <v-list-item-subtitle
           :class="lang === locale ? '!font-semibold' : ''"
-          class="capitalize md:(!leading-8) group-hover:(text-primary font-semibold)"
+          class="capitalize md:(!leading-8) group-hover:(text-primary font-semibold) dark:(group-hover:text-secondary)"
         >
           {{ Language[lang] || lang }}
         </v-list-item-subtitle>
@@ -69,3 +69,9 @@ onMounted(() => {
     </v-list>
   </v-menu>
 </template>
+
+<style scoped>
+.scrollbar {
+  @apply scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-primary scrollbar-track-white dark:(!scrollbar-track-gray-900);
+}
+</style>

packages/nc-gui-v2/windi.config.ts

@@ -42,7 +42,8 @@ export default defineConfig({
 
   shortcuts: {
     'color-transition': 'transition-color duration-100 ease-in',
-    'scrollbar-thin-primary': 'scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-primary scrollbar-track-white',
+    'scrollbar-thin-primary':
+      'scrollbar scrollbar-thin scrollbar-thumb-rounded scrollbar-thumb-primary scrollbar-track-white dark:(!scrollbar-track-black)',
   },
 
   theme: {