소스 검색

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; }