Head parity: pin brand-colour swatch cases (E, F) from the WHP script
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
faecc76384
commit
c388be7fe7
1 file changed
+29
@@ -20,11 +20,16 @@ const PINNED_HEAD: Record<string, string> = {
|
||||
D_body_font_and_blank_tokens: "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Services</title>\n <meta property=\"og:title\" content=\"Services\">\n <meta property=\"og:type\" content=\"website\">\n <link rel=\"canonical\" href=\"https://example.com/services\">\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\n <link href=\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Montserrat:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n <style>*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:clip}body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;color:#1f2937;-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto;display:block}a{color:inherit}@media(max-width:767px){[style*=\"display: flex\"][style*=\"flex-direction: row\"],[style*=\"display:flex\"][style*=\"flex-direction:row\"]{flex-direction:column!important}}@media(min-width:992px){[data-hide-desktop]{display:none!important}}@media(min-width:768px) and (max-width:991px){[data-hide-tablet]{display:none!important}}@media(max-width:767px){[data-hide-mobile]{display:none!important}}:root{--wsb-primary:#3b82f6;--wsb-secondary:#8b5cf6;--wsb-accent:#10b981;--wsb-link:#3b82f6;--wsb-success:#10b981;--wsb-warning:#f59e0b;--wsb-error:#ef4444;--wsb-bg:#ffffff;--wsb-text:#111111;--wsb-muted:#6b7280;--wsb-border:#e5e7eb;--wsb-radius:8px;--wsb-heading-font:Inter, sans-serif;--wsb-body-font:Inter, sans-serif;--wsb-button-font:Inter, sans-serif;--wsb-button-radius:8px}body{font-family:var(--wsb-body-font);color:var(--wsb-text);background:var(--wsb-bg)}h1,h2,h3,h4,h5,h6{font-family:var(--wsb-heading-font)}a{color:var(--wsb-link)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--wsb-accent);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}</style>\n</head>",
|
||||
};
|
||||
|
||||
PINNED_HEAD.E_brand_swatches = "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Brand</title>\n <meta property=\"og:title\" content=\"Brand\">\n <meta property=\"og:type\" content=\"website\">\n <link rel=\"canonical\" href=\"https://example.com/\">\n <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https://fonts.gstatic.com\" crossorigin>\n <link href=\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n <style>*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:clip}body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;color:#1f2937;-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto;display:block}a{color:inherit}@media(max-width:767px){[style*=\"display: flex\"][style*=\"flex-direction: row\"],[style*=\"display:flex\"][style*=\"flex-direction:row\"]{flex-direction:column!important}}@media(min-width:992px){[data-hide-desktop]{display:none!important}}@media(min-width:768px) and (max-width:991px){[data-hide-tablet]{display:none!important}}@media(max-width:767px){[data-hide-mobile]{display:none!important}}:root{--wsb-primary:#3b82f6;--wsb-secondary:#8b5cf6;--wsb-accent:#10b981;--wsb-link:#3b82f6;--wsb-success:#10b981;--wsb-warning:#f59e0b;--wsb-error:#ef4444;--wsb-bg:#ffffff;--wsb-text:#1f2937;--wsb-muted:#6b7280;--wsb-border:#e5e7eb;--wsb-radius:8px;--wsb-heading-font:Inter, sans-serif;--wsb-body-font:Inter, sans-serif;--wsb-button-font:Inter, sans-serif;--wsb-button-radius:8px;--wsb-brand-1:#FFcc00;--wsb-brand-3:#0A7}body{font-family:var(--wsb-body-font);color:var(--wsb-text);background:var(--wsb-bg)}h1,h2,h3,h4,h5,h6{font-family:var(--wsb-heading-font)}a{color:var(--wsb-link)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--wsb-accent);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}</style>\n</head>";
|
||||
PINNED_HEAD.F_swatches_no_brand = PINNED_HEAD.A_defaults;
|
||||
|
||||
const PINNED_BODY: Record<string, string> = {
|
||||
A_defaults: "<div></div>",
|
||||
B_full: "<div data-animation=\"fade-in\" data-animation-delay=\"0.3\"></div>",
|
||||
C_unknown_font: "<div></div>",
|
||||
D_body_font_and_blank_tokens: "<div style=\"font-family:Montserrat, sans-serif\"></div>",
|
||||
E_brand_swatches: "<div></div>",
|
||||
F_swatches_no_brand: "<div></div>",
|
||||
};
|
||||
|
||||
|
||||
@@ -77,6 +82,30 @@ const CASES: Record<string, { state: string; opts: ExportOptions }> = {
|
||||
design: merged({ accentColor: '', textColor: ' #111111 ' }),
|
||||
},
|
||||
},
|
||||
// Brand colours (design.swatches): same inputs as the WHP script's E / F cases.
|
||||
E_brand_swatches: {
|
||||
state: root({}),
|
||||
opts: {
|
||||
title: 'Brand', includeFonts: true, canonicalUrl: U,
|
||||
design: merged({ swatches: [
|
||||
{ id: 'a', label: 'Sea', hex: '#0A7', brand: true, slot: 3 },
|
||||
{ id: 'b', label: 'Sun', hex: '#FFcc00', brand: true, slot: 1 },
|
||||
{ id: 'c', label: 'Grey', hex: '#888888', brand: false },
|
||||
{ id: 'd', label: 'Bad', hex: 'red', brand: true, slot: 2 },
|
||||
] }),
|
||||
},
|
||||
},
|
||||
F_swatches_no_brand: {
|
||||
state: root({}),
|
||||
opts: {
|
||||
title: "Joe's Pizza & Grill", includeFonts: true, canonicalUrl: U,
|
||||
design: merged({ swatches: [
|
||||
{ id: 'c', label: 'Grey', hex: '#888888', brand: false },
|
||||
{ id: 'd', label: 'Bad', hex: 'red', brand: true, slot: 2 },
|
||||
{ id: 'e', label: 'Far', hex: '#123456', brand: true, slot: 7 },
|
||||
] }),
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const headOf = (doc: string) => doc.slice(0, doc.indexOf('</head>') + '</head>'.length);
|
||||
|
||||
Reference in new issue
Block a user