Sharang Parnerkar
8b5b9905a7
Build pitch-deck / build-push-deploy (push) Successful in 1m50s
CI / go-lint (push) Has been skipped
CI / python-lint (push) Has been skipped
CI / nodejs-lint (push) Has been skipped
CI / test-go-consent (push) Successful in 33s
CI / test-python-voice (push) Successful in 30s
CI / test-bqas (push) Successful in 27s
Adapts the visual language from the Claude Design reference (light theme) while
preserving our left-rule Page header and split-block cover.
Color palette: indigo (#4f46e5) → violet (#7c3aed) as primary accent across all
slides. COLORS.indigo* aliases kept so the existing 9 slide files inherit the
new palette without edits. New explicit COLORS.violet50..900 names available
for future code.
Body text shifted from pure slate to deep purple-tinted (#1a0f34) per Claude
tokens.fg.
Typography:
- Body / headings: Inter (was Plus Jakarta Sans)
- Mono utility: JetBrains Mono — applied to kicker tags, page numbers, footer,
the "At a glance" stat block on the cover, and the cover key-term labels
- Mono class .print-mono added to print.css
Background:
- New .print-page-bg utility paints a violet-tinted radial gradient
(white → #f5efff → #ebdfff) with a subtle 24px dotted grid SVG overlay
- Applied to every Page and the cover's right pane
Page chrome:
- Kicker label switched to JetBrains Mono with wider letter-spacing (0.18em)
- Right-of-kicker rule fades violet→transparent (was flat slate)
- New 2px violet gradient bar (700→400→700) below the title/subtitle —
the Claude Design "purple bar" accent, scaled down for print
- Footer restyled: mono caps "BREAKPILOT · COMPLAI" left, version (violet) middle,
page number right
Cover:
- Left block now a violet vertical gradient (was flat indigo)
- All small labels ("Investor Brief", "Auf einen Blick", "Confidential",
"Key Terms", and the term labels) restyled to JetBrains Mono with wider tracking
- Right pane carries the violet-tinted dotted bg, matching the rest of the deck
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
117 lines
3.6 KiB
CSS
117 lines
3.6 KiB
CSS
/* Fonts: Inter (body/headings) + JetBrains Mono (kickers, tickers, page numbers).
|
|
Plus Jakarta Sans is still loaded by globals.css; we don't need it for print. */
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap');
|
|
|
|
/* Named page — must be outside @media print */
|
|
@page slide-page {
|
|
size: A4 landscape;
|
|
margin: 0;
|
|
}
|
|
|
|
/*
|
|
* Page background: violet-tinted radial gradient with a faint dotted-grid
|
|
* overlay (printed via two layered background-images on .print-page).
|
|
*
|
|
* The radial mimics Claude Design's `radial-gradient(ellipse at 50% 12%, #fff 0%, #f5efff 55%, #ebdfff 100%)`.
|
|
* The dots are a tiny SVG repeat tile at 24px pitch, ~6% slate, so the grid is
|
|
* just barely visible — same role as the dot-grid in the design reference.
|
|
*/
|
|
.print-page-bg {
|
|
background-color: #ffffff;
|
|
background-image:
|
|
url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='1' cy='1' r='0.6' fill='%23a78bfa' fill-opacity='0.18'/%3E%3C/svg%3E"),
|
|
radial-gradient(ellipse at 50% 8%, #ffffff 0%, #f5efff 55%, #ebdfff 100%);
|
|
background-repeat: repeat, no-repeat;
|
|
background-size: 24px 24px, cover;
|
|
}
|
|
|
|
@media screen {
|
|
body { background: #d1d5db; }
|
|
}
|
|
|
|
@media print {
|
|
@page {
|
|
size: A4 landscape;
|
|
margin: 0;
|
|
}
|
|
|
|
html, body {
|
|
height: auto !important;
|
|
min-height: 0 !important;
|
|
overflow: visible !important;
|
|
background: #ffffff !important;
|
|
color: #1a0f34 !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
font-family: 'Inter', 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
|
|
-webkit-print-color-adjust: exact;
|
|
-moz-print-color-adjust: exact;
|
|
print-color-adjust: exact;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.no-print {
|
|
display: none !important;
|
|
}
|
|
|
|
.print-deck-wrapper {
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
display: block !important;
|
|
overflow: visible !important;
|
|
font-family: 'Inter', system-ui, sans-serif !important;
|
|
}
|
|
|
|
/* Block wrapper carries the height + page break. */
|
|
.print-page-break {
|
|
page: slide-page;
|
|
display: block !important;
|
|
width: 297mm !important;
|
|
height: 210mm !important;
|
|
overflow: hidden !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
/* New page before every slide except the first */
|
|
.print-page-break + .print-page-break {
|
|
break-before: page !important;
|
|
page-break-before: always !important;
|
|
}
|
|
|
|
/* Flex container fills the block wrapper */
|
|
.print-page {
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
overflow: hidden !important;
|
|
margin: 0 !important;
|
|
box-shadow: none !important;
|
|
font-family: 'Inter', system-ui, sans-serif !important;
|
|
color: #1a0f34 !important;
|
|
-webkit-print-color-adjust: exact;
|
|
-moz-print-color-adjust: exact;
|
|
print-color-adjust: exact;
|
|
}
|
|
|
|
/* Tabular numerals everywhere */
|
|
.print-page table, .print-page .num, .print-page .kpi {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
/* Mono utility — for kickers, page numbers, tickers, code-style tags */
|
|
.print-mono {
|
|
font-family: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace !important;
|
|
}
|
|
}
|
|
|
|
/* Screen preview: same fonts, applied to print-page on screen too */
|
|
.print-page, .print-page-break {
|
|
font-family: 'Inter', system-ui, sans-serif;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
.print-mono {
|
|
font-family: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
|
|
}
|