feat(ui): electric Bat-Computer redesign — cyan→magenta theme
build-and-deploy / build (push) Failing after 11m29s
build-and-deploy / build (push) Failing after 11m29s
Cinematic full-page backdrop: per-theme Bat-Computer board image, scroll-panned (S→E→SE→NE) via CSS scroll-driven animation behind a legibility scrim — replaces the grid/aura motif. - Accent retuned royal-blue → the board's cyan→magenta; headline runs a cyan→magenta electric sweep; gradient primary CTA + scroll-progress line. - Display face: self-hosted Chakra Petch (OFL) on hero + section titles. - Skill chips reworked as circuit-node chips (glowing via + gradient hover outline); frosted-glass cards with a cyan→magenta hover hairline; section eyebrows get a gradient tick. - Remove unused BackgroundGrid component + grid assets. All CSS-only / zero external requests / no inline JS — strict CSP and A+ security headers preserved.
This commit is contained in:
@@ -25,11 +25,27 @@ const { id, eyebrow, title, index } = Astro.props;
|
||||
.section__head {
|
||||
margin-bottom: var(--space-6);
|
||||
}
|
||||
/* A short cyan→magenta tick leads each section eyebrow — board palette. */
|
||||
.section__head .eyebrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
.section__head .eyebrow::before {
|
||||
content: "";
|
||||
width: 1.7rem;
|
||||
height: 2px;
|
||||
border-radius: 2px;
|
||||
background: linear-gradient(90deg, var(--accent), var(--accent-2));
|
||||
box-shadow: 0 0 8px var(--accent-glow);
|
||||
}
|
||||
.section__index {
|
||||
color: var(--text-faint);
|
||||
margin-right: 0.6rem;
|
||||
}
|
||||
.section__title {
|
||||
font-family: var(--font-display);
|
||||
letter-spacing: -0.01em;
|
||||
margin-top: var(--space-3);
|
||||
font-size: var(--step-3);
|
||||
max-width: 22ch;
|
||||
|
||||
Reference in New Issue
Block a user