matthias/Dev-Landing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Cleanly separate hero color fields

Browse Source
This commit is contained in:
Matthias Meister
2026-05-05 22:37:20 +02:00
parent 55a189e78e
commit e57678a68d
2 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
backlog/tasks/task-1 - Redesign-dev-website-from-Canva-reference.md
View File

@@ -4,7 +4,7 @@ title: Redesign dev website from Canva reference
status: In Progress status: In Progress
assignee: [] assignee: []
created_date: '2026-05-05 20:20' created_date: '2026-05-05 20:20'
updated_date: '2026-05-05 20:35' updated_date: '2026-05-05 20:37'
labels: [] labels: []
dependencies: [] dependencies: []
priority: high priority: high
@@ -42,4 +42,6 @@ Created worktree at .worktrees/canva-redesign on branch codex/canva-redesign. Ba
Implemented a consolidated Canva-inspired landing page in src/components/canva-landing.tsx and switched src/pages/index.astro to it. Smoke test and CI=true pnpm run build pass. Local dev server responds with HTTP 200 at http://127.0.0.1:4321/. Browser screenshot tooling is not available in this session, so visual review remains open. Implemented a consolidated Canva-inspired landing page in src/components/canva-landing.tsx and switched src/pages/index.astro to it. Smoke test and CI=true pnpm run build pass. Local dev server responds with HTTP 200 at http://127.0.0.1:4321/. Browser screenshot tooling is not available in this session, so visual review remains open.
Converted visible German UI copy from ae/oe/ue fallbacks to real umlauts in the Canva landing page and legacy section components. Added smoke-test coverage for the Canva landing copy. Converted visible German UI copy from ae/oe/ue fallbacks to real umlauts in the Canva landing page and legacy section components. Added smoke-test coverage for the Canva landing copy.
Removed the black decorative cutout from the red hero panel and replaced it with a clean responsive border between the black and red surfaces.
<!-- SECTION:NOTES:END --> <!-- SECTION:NOTES:END -->

3
src/components/canva-landing.tsx
View File

@@ -93,12 +93,11 @@ const CanvaLanding = () => {
</div> </div>
</div> </div>
<aside className="relative flex min-h-[520px] flex-col justify-between bg-primary px-5 py-5 text-primary-foreground sm:px-8 lg:px-12"> <aside className="relative flex min-h-[520px] flex-col justify-between border-t border-primary-foreground/25 bg-primary px-5 py-5 text-primary-foreground sm:px-8 lg:border-l lg:border-t-0 lg:px-12">
<div className="flex items-start justify-between border-b border-primary-foreground/30 pb-5 text-xs uppercase tracking-[0.28em]"> <div className="flex items-start justify-between border-b border-primary-foreground/30 pb-5 text-xs uppercase tracking-[0.28em]">
<span>Creative Direction</span> <span>Creative Direction</span>
<span>2026</span> <span>2026</span>
</div> </div>
<div className="absolute left-0 top-28 h-28 w-28 bg-background" />
<div className="absolute bottom-32 right-10 h-36 w-36 border border-primary-foreground/35" /> <div className="absolute bottom-32 right-10 h-36 w-36 border border-primary-foreground/35" />
<div className="relative mt-28 max-w-xl"> <div className="relative mt-28 max-w-xl">
<p className="text-[clamp(4rem,10vw,9rem)] font-black uppercase leading-[0.75] tracking-normal"> <p className="text-[clamp(4rem,10vw,9rem)] font-black uppercase leading-[0.75] tracking-normal">