Merge pull request #9 from ArthurDanjou/copilot/fix-ucard-color-in-darkmode

Fix UCard code block contrast in dark mode and add color mode selector

app/app.vue

@@ -1,5 +1,10 @@
 <template>
-  <NuxtRouteAnnouncer />
-  <NuxtLoadingIndicator />
-  <NuxtPage />
+  <div>
+    <NuxtRouteAnnouncer />
+    <NuxtLoadingIndicator />
+    <div class="fixed top-4 right-4 z-50">
+      <UColorModeSelect />
+    </div>
+    <NuxtPage />
+  </div>
 </template>

app/pages/docs.vue

@@ -222,7 +222,11 @@ const apiEndpoints = [
             <h3 class="text-xl font-semibold mb-4">
               MCP Configuration
             </h3>
-            <UCard variant="solid">
+            <UCard
+              :ui="{
+                body: 'bg-gray-900 dark:bg-gray-950'
+              }"
+            >
               <pre class="text-sm text-gray-100 overflow-x-auto">
 <code>{
   "mcpServers": {
@@ -239,7 +243,11 @@ const apiEndpoints = [
             <h3 class="text-xl font-semibold mb-4">
               Direct Connection
             </h3>
-            <UCard variant="solid">
+            <UCard
+              :ui="{
+                body: 'bg-gray-900 dark:bg-gray-950'
+              }"
+            >
               <pre class="text-sm text-gray-100 overflow-x-auto"><code>https://api.arthurdanjou.fr/mcp</code></pre>
             </UCard>
             <p class="text-sm text-gray-600 dark:text-gray-400 mt-2">

app/pages/index.vue

@@ -212,7 +212,9 @@ const resources = [
               Configure your MCP client to connect to my server:
             </p>
             <UCard
-              variant="solid"
+              :ui="{
+                body: 'bg-gray-900 dark:bg-gray-950'
+              }"
             >
               <pre class="text-sm text-gray-100 overflow-x-auto">
                 <code>
@@ -234,7 +236,11 @@ const resources = [
             <p class="text-gray-600 dark:text-gray-400 mb-4">
               Use REST API endpoints in your applications:
             </p>
-            <UCard variant="solid">
+            <UCard
+              :ui="{
+                body: 'bg-gray-900 dark:bg-gray-950'
+              }"
+            >
               <pre class="text-sm text-gray-100 overflow-x-auto">
 <code># Get profile information
 curl https://api.arthurdanjou.fr/api/profile

package.json

@@ -17,6 +17,7 @@
     "@nuxt/ui": "^4.2.1",
     "@nuxthub/core": "0.10.2",
     "@nuxtjs/mcp-toolkit": "0.5.2",
+    "better-sqlite3": "^12.5.0",
     "drizzle-kit": "^0.31.8",
     "drizzle-orm": "^0.45.1",
     "nuxt": "4.2.2",