From a9bb83b4e5f21f5cb07d6b4e6bf649a70288a2e6 Mon Sep 17 00:00:00 2001
From: root <root@localhost.localdomain>
Date: Sun, 5 Jul 2026 09:12:04 +0000
Subject: [PATCH] big

---
 frontend/src/App.vue                 |  8 +++++++-
 frontend/src/main.ts                 |  1 +
 frontend/src/style.css               |  2 --
 frontend/src/views/AdminUserView.vue |  2 +-
 frontend/src/views/QuizView.vue      | 12 +++++++-----
 frontend/src/views/SettingsView.vue  |  2 +-
 frontend/tailwind.config.js          |  9 ++++++++-
 7 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index fc0a953..e2d1c22 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -128,9 +128,14 @@
             <PaletteIcon :size="16" class="text-secondary" />
             <span class="text-xs font-black uppercase tracking-widest opacity-60">테마 설정</span>
           </div>
+          <div class="form-control w-full">
+            <select v-model="currentTheme" class="select select-bordered select-sm w-full bg-base-100 font-bold text-xs">
+              <option v-for="t in themes" :key="t" :value="t">{{ t }}</option>
+            </select>
+          </div>
           <button @click="randomizeTheme" class="btn btn-outline btn-sm btn-secondary w-full text-xs font-bold gap-2">
             <ShuffleIcon :size="14" />
-            랜덤 테마: {{ currentTheme }}
+            랜덤 테마
           </button>
         </div>
       </aside>
@@ -276,6 +281,7 @@ const currentTheme = ref(localStorage.getItem('app-theme') || 'dark')
 // Sync the theme to html element directly for DaisyUI scoping
 watch(currentTheme, (newTheme) => {
   document.documentElement.setAttribute('data-theme', newTheme)
+  localStorage.setItem('app-theme', newTheme)
 }, { immediate: true })
 
 function randomizeTheme() {
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
index c688409..605eec9 100644
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -3,6 +3,7 @@ import { createPinia } from 'pinia'
 import router from './router'
 import App from './App.vue'
 import './style.css'
+import 'daisyui/themes.css'
 
 const app = createApp(App)
 
diff --git a/frontend/src/style.css b/frontend/src/style.css
index 749a3ee..fce16e1 100644
--- a/frontend/src/style.css
+++ b/frontend/src/style.css
@@ -7,8 +7,6 @@ html, body, #app {
     height: 100%;
     margin: 0;
     padding: 0;
-    background-color: #1b2636;
-    color: white;
     font-family: 'Inter', sans-serif;
 }
 
diff --git a/frontend/src/views/AdminUserView.vue b/frontend/src/views/AdminUserView.vue
index 3d5d7a0..74770a8 100644
--- a/frontend/src/views/AdminUserView.vue
+++ b/frontend/src/views/AdminUserView.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="p-8 max-w-6xl mx-auto space-y-8 select-none" data-theme="dark">
+  <div class="p-8 max-w-6xl mx-auto space-y-8 select-none">
     <!-- Header -->
     <div class="flex items-center justify-between pb-6 border-b border-base-content/10">
       <div class="flex items-center gap-4">
diff --git a/frontend/src/views/QuizView.vue b/frontend/src/views/QuizView.vue
index 3c63304..6fcaa06 100644
--- a/frontend/src/views/QuizView.vue
+++ b/frontend/src/views/QuizView.vue
@@ -876,11 +876,13 @@ function triggerMermaid() {
   })
 }
 
-// 문제 전환 시 구문 강조 및 mermaid 다시 적용
-watch(currentIndex, () => {
-  applyHighlighting()
-  triggerMermaid()
-})
+// 문제 전환 또는 최초 로드 시 구문 강조 및 mermaid 적용
+watch(currentQuestion, (newVal) => {
+  if (newVal) {
+    applyHighlighting()
+    triggerMermaid()
+  }
+}, { immediate: true })
 
 // 피드백/해설이 노출되거나 AI 해설이 업데이트될 때도 mermaid 렌더링
 watch(showFeedback, (newVal) => {
diff --git a/frontend/src/views/SettingsView.vue b/frontend/src/views/SettingsView.vue
index 112626b..1a602d8 100644
--- a/frontend/src/views/SettingsView.vue
+++ b/frontend/src/views/SettingsView.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="p-8 max-w-4xl mx-auto space-y-8" data-theme="dark">
+  <div class="p-8 max-w-4xl mx-auto space-y-8">
     <!-- Header -->
     <div class="flex items-center justify-between pb-6 border-b border-base-content/10">
       <div class="flex items-center gap-4">
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 8bc7e75..03b0858 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -8,6 +8,13 @@ export default {
   },
   plugins: [require("daisyui")],
   daisyui: {
-    themes: true,
+    themes: [
+      "light", "dark", "cupcake", "bumblebee", "emerald", "corporate", 
+      "synthwave", "retro", "cyberpunk", "valentine", "halloween", 
+      "garden", "forest", "aqua", "lofi", "pastel", "fantasy", 
+      "wireframe", "black", "luxury", "dracula", "cmyk", "autumn", 
+      "business", "acid", "lemonade", "night", "coffee", "winter", 
+      "dim", "nord", "sunset", "caramellatte", "abyss", "silk"
+    ],
   },
 }
\ No newline at end of file