style(site): align data preview sizing

This commit is contained in:
2026-07-24 18:35:58 +08:00
parent 9eb3586981
commit 7ea97349d3

View File

@@ -57,8 +57,9 @@ h2 { font-size: clamp(32px, 3.2vw, 49px); line-height: 1.2; }
.context-points p { color: #728098; font-size: 14px; line-height: 1.75; } .context-points p { color: #728098; font-size: 14px; line-height: 1.75; }
.showcase { align-items: center; background: #f7f9fd; display: grid; gap: clamp(36px, 4vw, 64px); grid-template-columns: minmax(420px, 1.15fr) minmax(300px, .85fr); margin-bottom: 0; max-width: none; padding-bottom: 80px; padding-top: 80px; } .showcase { align-items: center; background: #f7f9fd; display: grid; gap: clamp(36px, 4vw, 64px); grid-template-columns: minmax(420px, 1.15fr) minmax(300px, .85fr); margin-bottom: 0; max-width: none; padding-bottom: 80px; padding-top: 80px; }
.showcase:not(.showcase-reversed) { padding-top: 96px; }
.showcase-image { background: #fff; border: 1px solid #e4eaf3; box-shadow: 0 22px 48px rgba(30, 55, 95, .09); overflow: hidden; } .showcase-image { background: #fff; border: 1px solid #e4eaf3; box-shadow: 0 22px 48px rgba(30, 55, 95, .09); overflow: hidden; }
.data-preview-grid { display: grid; gap: 12px; grid-template-columns: 1.22fr .78fr; padding: 12px; } .data-preview-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-self: start; max-width: 620px; padding: 12px; width: 100%; }
.data-preview-grid figure { margin: 0; min-width: 0; } .data-preview-grid figure { margin: 0; min-width: 0; }
.data-preview-grid figcaption { color: #61718a; font-size: 13px; font-weight: 700; padding: 9px 2px 1px; } .data-preview-grid figcaption { color: #61718a; font-size: 13px; font-weight: 700; padding: 9px 2px 1px; }
.showcase-copy { max-width: 460px; } .showcase-copy { max-width: 460px; }
@@ -98,6 +99,7 @@ dd { color: #718097; font-size: 14px; margin: 7px 0 0; }
.hero { padding-top: 60px; } .hero { padding-top: 60px; }
h1 { font-size: 43px; } h1 { font-size: 43px; }
.context-section, .showcase { padding-bottom: 72px; padding-top: 72px; } .context-section, .showcase { padding-bottom: 72px; padding-top: 72px; }
.showcase:not(.showcase-reversed) { padding-top: 72px; }
.context-points { border-left: 0; grid-template-columns: 1fr; } .context-points { border-left: 0; grid-template-columns: 1fr; }
.context-points article { border-bottom: 1px solid #e8edf5; padding: 18px 0; } .context-points article { border-bottom: 1px solid #e8edf5; padding: 18px 0; }
.context-points article + article { border-left: 0; } .context-points article + article { border-left: 0; }