bboysoul/dodo
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

feat: 今天环境条布局优化——大屏单行六格、移动端补齐分隔线、统一字号层级
ci / gitleaks (push) Successful in 9s
Details
ci / docker (push) Successful in 3m40s
Details

Browse Source 
- >=1360px 单行六格（44px 高，倒数日收尾），条高 91->61，大屏不再两行空荡
- 721-1359 保持 2x3 网格，主值字号 13->14、日历 15->16/700，内容垂直居中
- 移动端补油价/股市行与倒数日行缺失的 border-top（行间分隔线断层）
- 移动端锁定 13/15px 防大屏字号渗入；e2e 几何断言同步 61px 新值
This commit is contained in:
bboysoul
2026-09-25 10:42:38 +08:00
parent 273cd7aac7
commit a9723eee84
2 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/e2e/today-plain-list.spec.ts
+3 -3
View File
@@ -75,7 +75,7 @@ test('Today plain-list layout matches the approved responsive geometry', async (
})).toEqual({ })).toEqual({
media720: width <= 720, media720: width <= 720,
contentWidth: width >= 1440 ? 1080 : width > 930 ? Math.min(1080, width - 324) : width === 721 ? 630 : width - 56, contentWidth: width >= 1440 ? 1080 : width > 930 ? Math.min(1080, width - 324) : width === 721 ? 630 : width - 56,
environmentHeight: width >= 721 ? 91 : width === 375 ? 154 : 158, environmentHeight: width >= 1360 ? 61 : width >= 721 ? 91 : width === 375 ? 154 : 158,
}) })
await expect(page.locator('.today-heading')).toHaveCount(1) await expect(page.locator('.today-heading')).toHaveCount(1)
await expect(page.locator('.today-inline-add')).toHaveCount(0) await expect(page.locator('.today-inline-add')).toHaveCount(0)
@@ -279,11 +279,11 @@ test('Today plain-list layout matches the approved responsive geometry', async (
expect(metrics.styles.fabShadow).toContain('8px 18px') expect(metrics.styles.fabShadow).toContain('8px 18px')
expect(metrics.styles.fabIconWidth).toBeCloseTo(30, 0) expect(metrics.styles.fabIconWidth).toBeCloseTo(30, 0)
if (width >= 721) { if (width >= 721) {
expect(metrics.uniqueRows).toHaveLength(2) expect(metrics.uniqueRows).toHaveLength(width >= 1360 ? 1 : 2)
expect(metrics.content.width).toBeCloseTo(width >= 1440 ? 1080 : width > 930 ? Math.min(1080, width - 324) : 630, 0) expect(metrics.content.width).toBeCloseTo(width >= 1440 ? 1080 : width > 930 ? Math.min(1080, width - 324) : 630, 0)
expect(Math.max(...metrics.itemWidths) - Math.min(...metrics.itemWidths)).toBeLessThanOrEqual(1) expect(Math.max(...metrics.itemWidths) - Math.min(...metrics.itemWidths)).toBeLessThanOrEqual(1)
expect(Math.max(...metrics.itemHeights) - Math.min(...metrics.itemHeights)).toBeLessThanOrEqual(1) expect(Math.max(...metrics.itemHeights) - Math.min(...metrics.itemHeights)).toBeLessThanOrEqual(1)
expect(Math.round(metrics.environment.height)).toBe(91) expect(Math.round(metrics.environment.height)).toBe(width >= 1360 ? 61 : 91)
expect(metrics.styles.titleFontSize).toBe('34px') expect(metrics.styles.titleFontSize).toBe('34px')
} else { } else {
expect(metrics.uniqueRows).toHaveLength(4) expect(metrics.uniqueRows).toHaveLength(4)
frontend/src/style.css
+6 -5
View File
@@ -176,23 +176,24 @@ main.today-main .topbar{margin-bottom:var(--space-12)}
.today-heading .today-remaining{margin:var(--space-6) 0 0} .today-heading .today-remaining{margin:var(--space-6) 0 0}
.today-heading .today-inline-filter{align-self:center;justify-self:end} .today-heading .today-inline-filter{align-self:center;justify-self:end}
.today-environment{grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:0;padding:0 0 var(--space-18);border-bottom:1px solid var(--border-hairline);color:var(--text-secondary)} .today-environment{grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:0;padding:0 0 var(--space-18);border-bottom:1px solid var(--border-hairline);color:var(--text-secondary)}
.today-environment__item{height:36px;padding:0 0 0 var(--space-18);justify-content:flex-start} .today-environment__item{height:36px;padding:0 0 0 var(--space-18);justify-content:center}
.today-environment__item:first-child{padding-left:0} .today-environment__item:first-child{padding-left:0}
.today-environment__calendar{flex-direction:row;align-items:baseline;gap:8px} .today-environment__calendar{flex-direction:row;align-items:baseline;gap:8px}
.today-environment__calendar strong{font-size:15px;font-weight:600;letter-spacing:0} .today-environment__calendar strong{font-size:16px;font-weight:700;letter-spacing:0}
.today-environment__calendar small{margin-top:0;font-size:11px} .today-environment__calendar small{margin-top:0;font-size:11px}
@media(min-width:721px){.today-environment__calendar{flex-direction:column;align-items:flex-start;gap:0}.today-environment__calendar small{margin-top:var(--space-2);font-size:11px}} @media(min-width:721px){.today-environment__calendar{flex-direction:column;align-items:flex-start;gap:0}.today-environment__calendar small{margin-top:var(--space-2);font-size:11px}}
.today-environment__weather strong,.today-environment__gold strong,.today-environment__gold-primary{margin-top:0;font-size:13px;font-weight:600} .today-environment__weather strong,.today-environment__gold strong,.today-environment__gold-primary{margin-top:0;font-size:14px;font-weight:600}
.today-environment__item small{margin-top:var(--space-2);font-size:11px} .today-environment__item small{margin-top:var(--space-2);font-size:11px}
.today-environment__item:nth-child(3n+1){border-left:0;padding-left:0} .today-environment__item:nth-child(3n+1){border-left:0;padding-left:0}
.today-environment__item:nth-child(n+4){border-top:1px solid var(--border-hairline)} .today-environment__item:nth-child(n+4){border-top:1px solid var(--border-hairline)}
.today-environment__countdown strong,.today-environment__oil strong,.today-environment__ashare strong{display:block;color:var(--text-primary);font-size:13px;line-height:1.2;font-weight:600} .today-environment__countdown strong,.today-environment__oil strong,.today-environment__ashare strong{display:block;color:var(--text-primary);font-size:14px;line-height:1.2;font-weight:600}
@media(min-width:1360px){.today-environment{grid-template-columns:repeat(6,minmax(0,1fr));padding-bottom:var(--space-16)}.today-environment__calendar,.today-environment__weather,.today-environment__gold{grid-column:auto}.today-environment__item{height:44px;padding-left:var(--space-14);justify-content:center}.today-environment__item:nth-child(3n+1){border-left:1px solid var(--border-hairline);padding-left:var(--space-14)}.today-environment__item:nth-child(n+4){border-top:0}.today-environment__item:first-child{border-left:0;padding-left:0}.today-environment__countdown{order:6}.today-environment__oil{order:4}.today-environment__ashare{order:5}}
.today-main :is(.task-row,.habit-row){height:58px;min-height:58px;max-height:58px;padding:0;background:transparent;border:0;border-bottom:1px solid var(--border-hairline);border-radius:0;box-shadow:none} .today-main :is(.task-row,.habit-row){height:58px;min-height:58px;max-height:58px;padding:0;background:transparent;border:0;border-bottom:1px solid var(--border-hairline);border-radius:0;box-shadow:none}
.today-main .task-row{gap:0}.today-main .task-main{padding:0}.today-main .task-main strong,.today-main .habit-name{font-size:15px;font-weight:400} .today-main .task-row{gap:0}.today-main .task-main{padding:0}.today-main .task-main strong,.today-main .habit-name{font-size:15px;font-weight:400}
.today-main .task-tail{padding-left:var(--space-12);font-size:12px}.today-main .habit-row{gap:0;row-gap:5px}.today-main .habit-main{min-width:0;padding:0} .today-main .task-tail{padding-left:var(--space-12);font-size:12px}.today-main .habit-row{gap:0;row-gap:5px}.today-main .habit-main{min-width:0;padding:0}
.shell.today-active .unified-fab{box-shadow:0 8px 18px rgba(174,65,29,.22)}.shell.today-active .unified-fab>svg{width:30px;height:30px;stroke-width:1.5} .shell.today-active .unified-fab{box-shadow:0 8px 18px rgba(174,65,29,.22)}.shell.today-active .unified-fab>svg{width:30px;height:30px;stroke-width:1.5}
@media(max-width:930px){main.today-main{padding-left:max(44px,calc((100% - 630px)/2));padding-right:max(44px,calc((100% - 630px)/2))}} @media(max-width:930px){main.today-main{padding-left:max(44px,calc((100% - 630px)/2));padding-right:max(44px,calc((100% - 630px)/2))}}
@media(max-width:720.98px){main.today-main{padding-left:var(--space-28)!important;padding-right:var(--space-28)!important;padding-bottom:calc(78px + var(--safe-area-bottom))}.today-environment{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:21px auto;align-items:stretch;column-gap:0;row-gap:7px;padding-bottom:var(--space-10)}.today-environment__calendar{grid-column:1/-1;grid-row:1;height:21px!important;padding:0;justify-content:space-between;align-items:start;border-left:0}.today-environment__weather,.today-environment__gold{grid-row:2;height:clamp(38px,calc(25vw - 55.75px),42px);padding-top:var(--space-6);border-top:1px solid var(--border-hairline)}.today-environment__weather{grid-column:1;padding-left:0;padding-right:var(--space-10);border-left:0}.today-environment__gold{grid-column:2;padding-left:var(--space-12)}.today-environment__weather strong,.today-environment__gold strong,.today-environment__gold-primary{line-height:16px}.today-environment__oil,.today-environment__ashare{grid-row:3;height:clamp(38px,calc(25vw - 55.75px),42px);padding-top:var(--space-6);padding-bottom:0}.today-environment__oil{grid-column:1;padding-left:0;padding-right:var(--space-10);border-left:0!important}.today-environment__ashare{grid-column:2;padding-left:var(--space-12)}.today-environment__countdown{grid-column:1/-1;grid-row:4;height:21px;padding:0;flex-direction:row;align-items:baseline;justify-content:space-between;gap:10px}.today-environment__countdown strong,.today-environment__oil strong,.today-environment__ashare strong{line-height:16px}.today-environment__item small{line-height:13px}.today-heading{margin-top:var(--space-16)}.today-page-title{font-size:24px}.today-heading .today-remaining{margin-top:var(--space-4)}.today-main .task-row,.today-main .habit-row{height:58px;min-height:58px;max-height:58px}.today-context .completed-filter-pill{width:87px;height:44px;min-height:44px}.today-context .completed-filter-pill__track{width:30px;height:18px}.today-context .completed-filter-pill__thumb{width:14px;height:14px}.today-context .completed-filter-pill[aria-checked="true"] .completed-filter-pill__thumb{transform:translateX(12px)}} @media(max-width:720.98px){main.today-main{padding-left:var(--space-28)!important;padding-right:var(--space-28)!important;padding-bottom:calc(78px + var(--safe-area-bottom))}.today-environment{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:21px auto;align-items:stretch;column-gap:0;row-gap:7px;padding-bottom:var(--space-10)}.today-environment__calendar{grid-column:1/-1;grid-row:1;height:21px!important;padding:0;justify-content:space-between;align-items:start;border-left:0}.today-environment__weather,.today-environment__gold{grid-row:2;height:clamp(38px,calc(25vw - 55.75px),42px);padding-top:var(--space-6);border-top:1px solid var(--border-hairline)}.today-environment__weather{grid-column:1;padding-left:0;padding-right:var(--space-10);border-left:0}.today-environment__gold{grid-column:2;padding-left:var(--space-12)}.today-environment__weather strong,.today-environment__gold strong,.today-environment__gold-primary{line-height:16px;font-size:13px}.today-environment__calendar strong{font-size:15px}.today-environment__oil,.today-environment__ashare{grid-row:3;height:clamp(38px,calc(25vw - 55.75px),42px);padding-top:var(--space-6);padding-bottom:0;border-top:1px solid var(--border-hairline)}.today-environment__oil{grid-column:1;padding-left:0;padding-right:var(--space-10);border-left:0!important}.today-environment__ashare{grid-column:2;padding-left:var(--space-12)}.today-environment__countdown{grid-column:1/-1;grid-row:4;height:21px;padding:0;flex-direction:row;align-items:baseline;justify-content:space-between;gap:10px;border-top:1px solid var(--border-hairline)}.today-environment__countdown strong,.today-environment__oil strong,.today-environment__ashare strong{line-height:16px;font-size:13px}.today-environment__item small{line-height:13px}.today-heading{margin-top:var(--space-16)}.today-page-title{font-size:24px}.today-heading .today-remaining{margin-top:var(--space-4)}.today-main .task-row,.today-main .habit-row{height:58px;min-height:58px;max-height:58px}.today-context .completed-filter-pill{width:87px;height:44px;min-height:44px}.today-context .completed-filter-pill__track{width:30px;height:18px}.today-context .completed-filter-pill__thumb{width:14px;height:14px}.today-context .completed-filter-pill[aria-checked="true"] .completed-filter-pill__thumb{transform:translateX(12px)}}
@media(max-width:380px){.today-environment__weather,.today-environment__gold,.today-environment__oil,.today-environment__ashare{height:40px;padding-top:var(--space-4);padding-bottom:var(--space-4)}} @media(max-width:380px){.today-environment__weather,.today-environment__gold,.today-environment__oil,.today-environment__ashare{height:40px;padding-top:var(--space-4);padding-bottom:var(--space-4)}}
/* Approved Settings 01: continuous paper ledger. */ /* Approved Settings 01: continuous paper ledger. */