fdb2 1.0.36 → 1.0.38

package/dist/public/index.css

@@ -136,6 +136,19 @@ to { transform: translateY(0);
   --db-primary-bg: #e0e7ff;
   --db-code-bg: #282c34;
   --db-code-fg: #abb2bf;
+
+  /* 语义底色上的文字色（浅色主题用深色阶；暗色主题在下方各暗色块覆写为亮色阶） */
+  --db-success-fg: #047857;
+  --db-warning-fg: #b45309;
+  --db-danger-fg: #b91c1c;
+  --db-info-fg: #1d4ed8;
+
+  /* JSON 语法高亮（浅色：GitHub Light 配色；暗色在各暗色块覆写为 GitHub Dark） */
+  --db-json-key: #d04255;
+  --db-json-string: #22863a;
+  --db-json-number: #005cc5;
+  --db-json-boolean: #d73a49;
+  --db-json-null: #6f42c1;
 }
 
 /* 全局布局 - 现代桌面应用风格 */
@@ -505,7 +518,11 @@ body {
 }
 
 .btn-close {
-  background: var(--db-gray-light);
+  background-color: var(--db-gray-light);
+  background-image: var(--bs-btn-close-bg);
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: 0.8em auto;
   border: none;
   border-radius: var(--db-radius-md);
   width: 32px;
@@ -517,8 +534,7 @@ body {
 }
 
 .btn-close:hover {
-  background: var(--db-danger-color);
-  color: var(--db-on-accent);
+  background-color: var(--db-danger-color);
   transform: rotate(90deg);
 }
 
@@ -1011,6 +1027,17 @@ pre {
     --db-primary-bg: rgba(102, 126, 234, 0.18);
     --db-code-bg: #1b1f27;
     --db-code-fg: #abb2bf;
+
+    /* 语义底色上的文字 / JSON 高亮：暗色下统一提亮 */
+    --db-success-fg: #34d399;
+    --db-warning-fg: #fbbf24;
+    --db-danger-fg: #f87171;
+    --db-info-fg: #60a5fa;
+    --db-json-key: #ff7b72;
+    --db-json-string: #a5d6ff;
+    --db-json-number: #79c0ff;
+    --db-json-boolean: #d2a8ff;
+    --db-json-null: #8b949e;
   }
 
   body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .card {
@@ -1036,6 +1063,26 @@ pre {
     background: #475569;
     color: #f1f5f9;
   }
+
+  /* Bootstrap 浅色工具类在暗色下过于刺眼/对比不足，统一改挂主题令牌
+     （与下方 body.vscode-dark 的同名规则对应，覆盖 OS 暗色入口） */
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .border-light,
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .bg-light {
+    border-color: #475569 !important;
+    background-color: #263041 !important;
+  }
+
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .btn-outline-secondary,
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .btn-outline-light {
+    color: #f1f5f9 !important;
+    border-color: #4d5b6b !important;
+  }
+
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .btn-outline-secondary:hover,
+  body:not(.vscode-light):not(.vscode-dark):not(.vscode-high-contrast) .btn-outline-light:hover {
+    background-color: #263041 !important;
+    color: #f1f5f9 !important;
+  }
 }
 
 /* VSCode webview：编辑器暗色 / 高对比主题（变量与上面的 OS 暗色保持一致） */
@@ -1074,6 +1121,17 @@ body.vscode-high-contrast {
   --db-primary-bg: rgba(102, 126, 234, 0.18);
   --db-code-bg: var(--vscode-textCodeBlock-background, #1b1f27);
   --db-code-fg: var(--vscode-editor-foreground, #abb2bf);
+
+  /* 语义底色上的文字 / JSON 高亮：暗色下统一提亮 */
+  --db-success-fg: #34d399;
+  --db-warning-fg: #fbbf24;
+  --db-danger-fg: #f87171;
+  --db-info-fg: #60a5fa;
+  --db-json-key: #ff7b72;
+  --db-json-string: #a5d6ff;
+  --db-json-number: #79c0ff;
+  --db-json-boolean: #d2a8ff;
+  --db-json-null: #8b949e;
 }
 
 /* 浅色主题：同样桥接到宿主令牌，跟随任意浅色主题（GitHub Light / Quiet Light / Solarized Light…） */
@@ -1139,27 +1197,36 @@ body.vscode-high-contrast .table th {
   color: var(--db-text-body);
 }
 
-/* Bootstrap 的浅色工具类在暗色下过于刺眼/对比不足，统一改挂主题令牌 */
+/* Bootstrap 的浅色工具类在暗色下过于刺眼/对比不足，统一改挂主题令牌。
+   覆盖全部暗色入口：VSCode webview 暗色/高对比、桌面端（body.platform-desktop）。
+   注意 body.platform-desktop 只在桌面端入口添加（src/platform/index.ts），
+   webview 不带该类，不会误伤浅色编辑器主题。 */
 body.vscode-dark .border-light,
 body.vscode-high-contrast .border-light,
+body.platform-desktop .border-light,
 body.vscode-dark .bg-light,
-body.vscode-high-contrast .bg-light {
+body.vscode-high-contrast .bg-light,
+body.platform-desktop .bg-light {
   border-color: var(--db-border) !important;
   background-color: var(--db-bg-soft) !important;
 }
 
 body.vscode-dark .btn-outline-secondary,
 body.vscode-high-contrast .btn-outline-secondary,
+body.platform-desktop .btn-outline-secondary,
 body.vscode-dark .btn-outline-light,
-body.vscode-high-contrast .btn-outline-light {
+body.vscode-high-contrast .btn-outline-light,
+body.platform-desktop .btn-outline-light {
   color: var(--db-text-body) !important;
   border-color: var(--db-border-light) !important;
 }
 
 body.vscode-dark .btn-outline-secondary:hover,
 body.vscode-high-contrast .btn-outline-secondary:hover,
+body.platform-desktop .btn-outline-secondary:hover,
 body.vscode-dark .btn-outline-light:hover,
-body.vscode-high-contrast .btn-outline-light:hover {
+body.vscode-high-contrast .btn-outline-light:hover,
+body.platform-desktop .btn-outline-light:hover {
   background-color: var(--db-bg-soft) !important;
   color: var(--db-text-body) !important;
 }
@@ -1274,6 +1341,17 @@ body.platform-desktop:not(.vscode-dark):not(.vscode-light):not(.vscode-high-cont
   --db-code-bg: #1b1f27;
   --db-code-fg: #abb2bf;
 
+  /* 语义底色上的文字 / JSON 高亮：暗色下统一提亮 */
+  --db-success-fg: #34d399;
+  --db-warning-fg: #fbbf24;
+  --db-danger-fg: #f87171;
+  --db-info-fg: #60a5fa;
+  --db-json-key: #ff7b72;
+  --db-json-string: #a5d6ff;
+  --db-json-number: #79c0ff;
+  --db-json-boolean: #d2a8ff;
+  --db-json-null: #8b949e;
+
   /* 深色下投影几乎不可见，层级改由边框与面色表达 */
   --db-shadow-sm: none;
   --db-shadow-md: none;
@@ -1606,13 +1684,13 @@ body.platform-desktop .text-primary.spinner-border {
 }
 
   /* 覆盖Bootstrap默认样式 */
-.toast-container[data-v-7d639c44] {
+.toast-container[data-v-daf8ceb9] {
     z-index: 1100;
 }
-.fade-out[data-v-7d639c44] {
-    animation: fadeOut-7d639c44 1s forwards;
+.fade-out[data-v-daf8ceb9] {
+    animation: fadeOut-daf8ceb9 1s forwards;
 }
-@keyframes fadeOut-7d639c44 {
+@keyframes fadeOut-daf8ceb9 {
 0% { opacity: 1; transform: translateY(0);
 }
 100% { opacity: 0;  transform: translateY(-120%);}
@@ -1634,37 +1712,95 @@ body.platform-desktop .text-primary.spinner-border {
     text-align: center;
 }
   
-.modal-dialog[data-v-aa6b0e1f] {
+.modal-dialog[data-v-8c11135e] {
     z-index: var(--bs-modal-zindex);
-    max-width:none !important;
+    max-width: none;
+}
+
+/* 纯文案提示弹窗：宽高跟随内容，短消息不再撑成大弹窗 */
+.modal-dialog.modal-dialog-auto[data-v-8c11135e] {
+    width: fit-content;
+    min-width: min(280px, 92vw);
+    max-width: min(80vw, 420px);
+    margin: auto;
+}
+
+/* ---------------- 弹窗自身的紧凑密度 ----------------
+ * database.css 的 .modal-header/.modal-body/.modal-footer 面向「网页大屏」，
+ * 而桌面端靠 body.platform-desktop 覆盖成紧凑值，webview（VSCode）没有该类，
+ * 于是同一套弹窗在 webview 里标题 24px、内边距 32px，显得又空又大。
+ * 这里把密度收进组件自身（与 platform-desktop 的取值一致），
+ * 两个宿主下观感统一，不再依赖全局样式差异。
+ */
+.modal-header[data-v-8c11135e] {
+    padding: 0.625rem 0.875rem;
+}
+.modal-header[data-v-8c11135e]::before {
+    display: none; /* 去掉标题栏顶部 4px 品牌色条 */
+}
+.modal-title[data-v-8c11135e] {
+    font-size: 0.875rem;
+    font-weight: 600;
+}
+.modal-body[data-v-8c11135e] {
+    padding: 0.875rem;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
 }
-.modal-success .modal-header[data-v-aa6b0e1f] {
+.modal-footer[data-v-8c11135e] {
+    padding: 0.5rem 0.875rem;
+    gap: 0.5rem;
+}
+.modal-footer .btn[data-v-8c11135e] {
+    padding: 0.25rem 0.75rem;
+    font-size: 0.8125rem;
+}
+
+/* 关闭按钮：不用 .btn-close 的 svg data-uri 背景（webview CSP 下不渲染，
+ * 会退化成一个无图标的灰色方块），改用 bootstrap-icons 字形画叉 */
+.btn-close[data-v-8c11135e] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    border: none;
+    border-radius: 6px;
+    background-color: transparent;
+    background-image: none;
+    box-shadow: none;
+    opacity: 0.85;
+    font-size: 13px;
+    color: inherit;
+}
+.btn-close[data-v-8c11135e]:hover,
+.btn-close[data-v-8c11135e]:focus {
+    background-color: rgba(128, 128, 128, 0.28);
+    opacity: 1;
+}
+.modal-success .modal-header[data-v-8c11135e] {
   background-color: var(--bs-success);
   color: white;
 }
-.modal-error .modal-header[data-v-aa6b0e1f] {
+.modal-error .modal-header[data-v-8c11135e] {
   background-color: var(--bs-danger);
   color: white;
 }
-.modal-warning .modal-header[data-v-aa6b0e1f] {
+.modal-warning .modal-header[data-v-8c11135e] {
   background-color: var(--bs-warning);
   color: var(--bs-dark);
 }
-.modal-info .modal-header[data-v-aa6b0e1f] {
+.modal-info .modal-header[data-v-8c11135e] {
   background-color: var(--bs-info);
   color: white;
 }
-.modal-body[data-v-aa6b0e1f] {
-  min-height: 80px;
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-}
-.error-details[data-v-aa6b0e1f] {
+.error-details[data-v-8c11135e] {
     width: 100%;
     margin-top: 1rem;
 }
-.error-content[data-v-aa6b0e1f] {
+.error-content[data-v-8c11135e] {
     background-color: var(--db-bg-soft2);
     border: 1px solid var(--db-gray-medium);
     border-radius: 0.375rem;
@@ -1678,17 +1814,17 @@ body.platform-desktop .text-primary.spinner-border {
     font-size: 0.875rem;
     line-height: 1.5;
 }
-.error-details-toggle[data-v-aa6b0e1f] {
+.error-details-toggle[data-v-8c11135e] {
     width: 100%;
 }
-.error-details-content[data-v-aa6b0e1f] {
+.error-details-content[data-v-8c11135e] {
     background-color: var(--db-bg-soft2);
     border: 1px solid var(--db-gray-medium);
     border-radius: 0.375rem;
     padding: 1rem;
     margin-top: 0.5rem;
 }
-.error-json[data-v-aa6b0e1f] {
+.error-json[data-v-8c11135e] {
     background-color: var(--db-text-body);
     color: var(--db-bg-soft2);
     border-radius: 0.25rem;
@@ -1700,20 +1836,22 @@ body.platform-desktop .text-primary.spinner-border {
     white-space: pre-wrap;
     word-break: break-word;
 }
-.error-meta[data-v-aa6b0e1f] {
+.error-meta[data-v-8c11135e] {
     border-bottom: 1px solid var(--db-gray-medium);
     padding-bottom: 0.5rem;
     margin-bottom: 0.5rem;
 }
-.modal-body .fs-1[data-v-aa6b0e1f] {
-  font-size: 2.5rem;
-  margin-bottom: 1rem;
+
+/* 提示类型图标：随内容紧凑展示（不用 Bootstrap 的 fs-1，避免 2.5rem 撑高弹窗） */
+.modal-type-icon[data-v-8c11135e] {
+  font-size: 1.25rem;
+  line-height: 1;
 }
 
 /* 响应式调整 */
 @media (max-width: 576px) {
-.error-content[data-v-aa6b0e1f],
-    .error-json[data-v-aa6b0e1f] {
+.error-content[data-v-8c11135e],
+    .error-json[data-v-8c11135e] {
         font-size: 0.75rem;
         max-height: 150px;
 }