diff --git a/static/css/components/lora-modal.css b/static/css/components/lora-modal.css index ba20c0b8..05c8304b 100644 --- a/static/css/components/lora-modal.css +++ b/static/css/components/lora-modal.css @@ -1,4 +1,3 @@ - /* Lora Modal Header */ .modal-header { display: flex; @@ -19,11 +18,17 @@ .info-item { padding: var(--space-2); - background: var(--lora-surface); - border: 1px solid var(--lora-border); + background: rgba(0, 0, 0, 0.03); + border: 1px solid rgba(0, 0, 0, 0.1); border-radius: var(--border-radius-sm); } +/* 调整深色主题下的样式 */ +[data-theme="dark"] .info-item { + background: rgba(255, 255, 255, 0.03); + border: 1px solid var(--lora-border); +} + .info-item.full-width { grid-column: 1 / -1; } @@ -146,11 +151,17 @@ /* Update Trigger Words styles */ .info-item.trigger-words { padding: var(--space-2); - background: var(--lora-surface); - border: 1px solid var(--lora-border); + background: rgba(0, 0, 0, 0.03); + border: 1px solid rgba(0, 0, 0, 0.1); border-radius: var(--border-radius-sm); } +/* 调整 trigger words 样式 */ +[data-theme="dark"] .info-item.trigger-words { + background: rgba(255, 255, 255, 0.03); + border: 1px solid var(--lora-border); +} + .trigger-words-tags { display: flex; flex-wrap: wrap; diff --git a/static/css/components/modal.css b/static/css/components/modal.css index f762c4bd..10c7c141 100644 --- a/static/css/components/modal.css +++ b/static/css/components/modal.css @@ -25,14 +25,14 @@ body.modal-open { height: auto; max-height: 90vh; margin: 2rem auto; - background: #ffffff; /* 使用纯白色背景 */ + background: var(--lora-surface); border-radius: var(--border-radius-base); padding: var(--space-3); - border: 1px solid rgba(0, 0, 0, 0.1); /* 更细腻的边框 */ + border: 1px solid var(--lora-border); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06), - 0 10px 15px -3px rgba(0, 0, 0, 0.05); /* 多层阴影创造深度 */ + 0 10px 15px -3px rgba(0, 0, 0, 0.05); overflow-y: auto; overflow-x: hidden; /* 防止水平滚动条 */ } @@ -298,14 +298,22 @@ body.modal-open { margin-top: 4px; } -/* 调整深色主题 */ +/* 统一各个 section 的样式 */ +.support-section, +.changelog-section, +.update-info, +.info-item, +.path-preview { + background: rgba(0, 0, 0, 0.03); + border: 1px solid rgba(0, 0, 0, 0.1); + border-radius: var(--border-radius-sm); + padding: var(--space-2); +} + +/* 深色主题统一样式 */ [data-theme="dark"] .modal-content { background: var(--lora-surface); border: 1px solid var(--lora-border); - box-shadow: - 0 4px 6px -1px rgba(0, 0, 0, 0.2), - 0 2px 4px -1px rgba(0, 0, 0, 0.15), - 0 10px 15px -3px rgba(0, 0, 0, 0.1); } [data-theme="dark"] .support-section, @@ -315,14 +323,4 @@ body.modal-open { [data-theme="dark"] .path-preview { background: rgba(255, 255, 255, 0.03); border: 1px solid var(--lora-border); -} - -/* 调整内容区域的间距,增加呼吸感 */ -.support-section, -.changelog-section, -.update-info, -.info-item { - padding: var(--space-3); - margin-bottom: var(--space-2); - border-radius: var(--border-radius-sm); } \ No newline at end of file diff --git a/static/css/components/support-modal.css b/static/css/components/support-modal.css index 04ecb115..55dc64af 100644 --- a/static/css/components/support-modal.css +++ b/static/css/components/support-modal.css @@ -33,27 +33,27 @@ .support-content { display: flex; flex-direction: column; - gap: var(--space-3); + gap: var(--space-2); } .support-content > p { font-size: 1.1em; text-align: center; - margin-bottom: var(--space-2); + margin-bottom: var(--space-1); } .support-section { - background: rgba(0, 0, 0, 0.02); /* 轻微的灰色背景 */ - border: 1px solid rgba(0, 0, 0, 0.08); /* 更明显的边框 */ + background: rgba(0, 0, 0, 0.02); + border: 1px solid rgba(0, 0, 0, 0.08); border-radius: var(--border-radius-sm); - padding: var(--space-3); + padding: var(--space-2); margin-bottom: var(--space-2); } .support-section h3 { display: flex; align-items: center; - gap: 10px; + gap: 8px; margin-top: 0; margin-bottom: var(--space-1); font-size: 1.1em; @@ -65,8 +65,8 @@ } .support-section p { - margin-top: 6px; - margin-bottom: var(--space-2); + margin-top: 4px; + margin-bottom: var(--space-1); color: var(--text-color); opacity: 0.9; } @@ -74,7 +74,7 @@ .support-links { display: flex; gap: var(--space-2); - margin-top: var(--space-2); + margin-top: var(--space-1); } .social-link { @@ -119,7 +119,7 @@ .support-footer { text-align: center; - margin-top: var(--space-2); + margin-top: var(--space-1); font-style: italic; color: var(--text-color); }