fix: preserve desktop setup card width

This commit is contained in:
anonsaber 2026-09-25 10:24:43 +08:00
parent 9064fc5f1d
commit 8c32892206
2 changed files with 11 additions and 1 deletions

View File

@ -5,6 +5,7 @@ import vm from "node:vm";
const html = readFileSync(new URL("./index.html", import.meta.url), "utf8"); const html = readFileSync(new URL("./index.html", import.meta.url), "utf8");
const source = readFileSync(new URL("./config.js", import.meta.url), "utf8"); const source = readFileSync(new URL("./config.js", import.meta.url), "utf8");
const styles = readFileSync(new URL("./styles.css", import.meta.url), "utf8");
class FakeElement { class FakeElement {
constructor(hidden = false) { constructor(hidden = false) {
@ -135,3 +136,13 @@ test("status errors keep the authorization form hidden until readiness is confir
assert.equal(elements.get("config-panel").hidden, true); assert.equal(elements.get("config-panel").hidden, true);
assert.match(elements.get("setup-message").textContent, /授权入口保持隐藏/); assert.match(elements.get("setup-message").textContent, /授权入口保持隐藏/);
}); });
test("setup card inherits desktop layout width and follows the existing mobile layout width", () => {
const setupRules = [...styles.matchAll(/\.setup-panel[^{}]*\{([^}]*)\}/g)].map((match) => match[1]);
const setupDeclarations = setupRules.join("\n");
assert.doesNotMatch(setupDeclarations, /\b(?:width|max-width)\s*:/);
assert.match(styles, /\.layout\s*\{[^}]*width:\s*min\(960px,\s*calc\(100% - 40px\)\)/);
assert.match(styles, /@media \(max-width: 720px\)\s*\{[\s\S]*?\.layout\s*\{[^}]*width:\s*calc\(100% - 32px\)/);
assert.match(styles, /\.auth-panel\s*\{[^}]*padding:\s*27px 29px 25px/);
});

View File

@ -60,7 +60,6 @@ h1 { margin-bottom: 12px; font-size: clamp(29px, 5vw, 40px); line-height: 1.16;
h2 { margin-bottom: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.025em; } h2 { margin-bottom: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.025em; }
h3 { margin-bottom: 4px; color: #35364e; font-size: 15px; } h3 { margin-bottom: 4px; color: #35364e; font-size: 15px; }
.panel-copy { max-width: 760px; margin-bottom: 22px; color: var(--muted); font-size: 13px; line-height: 1.7; } .panel-copy { max-width: 760px; margin-bottom: 22px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.setup-panel { max-width: 720px; }
.setup-panel .panel-copy { margin-bottom: 14px; } .setup-panel .panel-copy { margin-bottom: 14px; }
.setup-missing { margin: 0 0 17px; padding: 12px 14px; border: 1px solid #f2e9c8; border-radius: 8px; background: #fffbef; color: #796132; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; } .setup-missing { margin: 0 0 17px; padding: 12px 14px; border: 1px solid #f2e9c8; border-radius: 8px; background: #fffbef; color: #796132; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.setup-privacy { margin: 0 0 17px; color: #858697; font-size: 12px; line-height: 1.65; } .setup-privacy { margin: 0 0 17px; color: #858697; font-size: 12px; line-height: 1.65; }