瀏覽代碼

style: close the gap between settings panels 1 and 3

Explicit grid placement: 采集配置 spans both rows in the right column,
so 安全设置 stacks directly under API 设置 instead of waiting for the
taller right panel to end (16px gap, matching the grid gutter).
KenZ1117 2 周之前
父節點
當前提交
453ee77e7c
共有 1 個文件被更改,包括 7 次插入 和 0 次删除
  1. 7 0
      public/style.css

+ 7 - 0
public/style.css

@@ -165,6 +165,10 @@ main.content { padding: var(--page-padding-y) var(--page-padding-x) var(--page-p
 .field-label-row label { flex: 1 1 auto; margin: 0; }
 .settings-workspace { max-width: 1080px; }
 .settings-forms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; min-width: 0; }
+/* 显式定位:1 API设置 左上,2 采集配置 右列纵跨两行,3 安全设置 紧贴 1 下方(避免行对齐把 3 推远) */
+.settings-forms > .panel:nth-child(1) { grid-column: 1; grid-row: 1; }
+.settings-forms > .panel:nth-child(2) { grid-column: 2; grid-row: 1 / span 2; }
+.settings-forms > .panel:nth-child(3) { grid-column: 1; grid-row: 2; }
 .settings-forms .field textarea { min-height: 78px; resize: vertical; line-height: 1.5; }
 .settings-forms .panel,
 .panel-designed,
@@ -207,6 +211,9 @@ main.content { padding: var(--page-padding-y) var(--page-padding-x) var(--page-p
 
 @media (max-width: 960px) {
   .settings-forms { grid-template-columns: 1fr; }
+  .settings-forms > .panel:nth-child(1),
+  .settings-forms > .panel:nth-child(2),
+  .settings-forms > .panel:nth-child(3) { grid-column: auto; grid-row: auto; }
   #viewLogs.active { display: block; height: auto; }
   #viewLogs .content { min-height: 0; }
   #viewLogs .settings-log { flex: none; height: auto; min-height: 420px; }