chore: initial commit - CloudSearch v0.0.2

2026-05-15 05:50:50 +08:00
commit d83225d736
102 changed files with 37926 additions and 0 deletions
--- a/packages/frontend/src/App.vue
+++ b/packages/frontend/src/App.vue
@@ -0,0 +1,88 @@
+<template>
+  <router-view />
+  <button class="theme-toggle" @click="toggleTheme" :title="isDark ? '切换亮色' : '切换暗色'">
+    {{ isDark ? '☀️' : '🌙' }}
+  </button>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+
+const isDark = ref(false)
+
+function toggleTheme() {
+  isDark.value = !isDark.value
+  document.documentElement.setAttribute('data-theme', isDark.value ? 'dark' : '')
+  localStorage.setItem('theme', isDark.value ? 'dark' : 'light')
+}
+
+onMounted(() => {
+  const saved = localStorage.getItem('theme')
+  if (saved === 'dark' || (!saved && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
+    isDark.value = true
+    document.documentElement.setAttribute('data-theme', 'dark')
+  }
+})
+</script>
+
+<style>
+:root {
+  --bg: #f5f7fa;
+  --bg-card: #ffffff;
+  --bg-input: #f5f7fa;
+  --text: #303133;
+  --text2: #909399;
+  --text3: #c0c4cc;
+  --border: #e4e7ed;
+  --primary: #409eff;
+  --primary-light: rgba(64, 158, 255, 0.08);
+  --shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
+  --hover: #f5f7fa;
+}
+
+[data-theme="dark"] {
+  --bg: #141414;
+  --bg-card: #1f1f1f;
+  --bg-input: #2a2a2a;
+  --text: #e5e5e5;
+  --text2: #999999;
+  --text3: #666666;
+  --border: #333333;
+  --primary: #409eff;
+  --primary-light: rgba(64, 158, 255, 0.15);
+  --shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
+  --hover: #2a2a2a;
+}
+
+[data-theme="dark"] body { background: var(--bg); color: var(--text); }
+[data-theme="dark"] .el-card, [data-theme="dark"] .el-dialog, [data-theme="dark"] .el-menu { background-color: var(--bg-card) !important; border-color: var(--border) !important; color: var(--text) !important; }
+[data-theme="dark"] .el-input__wrapper, [data-theme="dark"] .el-select .el-input__wrapper { background-color: var(--bg-input) !important; border-color: var(--border) !important; }
+[data-theme="dark"] .el-input__inner, [data-theme="dark"] .el-textarea__inner { background-color: var(--bg-input) !important; color: var(--text) !important; }
+[data-theme="dark"] .el-button--default { background: var(--bg-card); border-color: var(--border); color: var(--text); }
+[data-theme="dark"] .rank-panel, [data-theme="dark"] .rank-item { background: var(--bg-card); border-color: var(--border); }
+[data-theme="dark"] .panel-title, [data-theme="dark"] .rank-name, [data-theme="dark"] .card-title { color: var(--text); }
+[data-theme="dark"] .card-meta, [data-theme="dark"] .rank-cnt, [data-theme="dark"] .panel-footer span:first-child { color: var(--text2); }
+[data-theme="dark"] .site-footer { background: var(--bg-card); border-color: var(--border); color: var(--text2); }
+
+.theme-toggle {
+  position: fixed;
+  bottom: 24px;
+  right: 24px;
+  z-index: 99;
+  width: 44px;
+  height: 44px;
+  border-radius: 50%;
+  border: 1px solid var(--border);
+  background: var(--bg-card);
+  cursor: pointer;
+  font-size: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: var(--shadow);
+  transition: all 0.3s;
+}
+.theme-toggle:hover { transform: scale(1.1); border-color: var(--primary); }
+
+#app { min-height: 100vh; background: var(--bg); color: var(--text); }
+</style>