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

Rename landing component

Browse Source
This commit is contained in:
Matthias Meister
2026-05-06 08:29:44 +02:00
parent 243978bfdd
commit 67411ecaff
4 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/superpowers/plans/2026-05-05-canva-redesign.md
View File

@@ -22,12 +22,12 @@
### Task 2: Canva-Inspired Landing Page
**Files:**
- Create: `src/components/canva-landing.tsx`
- Create: `src/components/landing.tsx`
- Modify: `src/pages/index.astro`
- Modify: `src/styles/global.css`
- [ ] Build a single-page layout with a dark editorial shell, red accent panels, large German headline, numbered sections, pricing/service strips, and a contact brief section.
- [ ] Replace the existing homepage component stack with the new `CanvaLanding` component.
- [ ] Replace the existing homepage component stack with the new `Landing` component.
- [ ] Update global tokens for the dark, high-contrast Canva reference style.
### Task 3: Verification

4
src/components/canva-landing.tsx → src/components/landing.tsx
View File

@@ -51,7 +51,7 @@ const packages = [
},
];
const CanvaLanding = () => {
const Landing = () => {
return (
<main className="min-h-screen overflow-hidden bg-background text-foreground">
<section className="relative grid min-h-screen grid-cols-1 border-b border-border lg:grid-cols-[1.08fr_0.92fr]">
@@ -246,4 +246,4 @@ const CanvaLanding = () => {
);
};
export { CanvaLanding };
export { Landing };

4
src/pages/index.astro
View File

@@ -1,5 +1,5 @@
---
import { CanvaLanding } from "@/components/canva-landing";
import { Landing } from "@/components/landing";
import "@/styles/global.css";
---
@@ -17,6 +17,6 @@ import "@/styles/global.css";
defer></script>
</head>
<body>
<CanvaLanding />
<Landing />
</body>
</html>

6
tests/landing-content.test.mjs
View File

@@ -2,9 +2,9 @@ import { readFile } from "node:fs/promises";
import test from "node:test";
import assert from "node:assert/strict";
const componentPath = new URL("../src/components/canva-landing.tsx", import.meta.url);
const componentPath = new URL("../src/components/landing.tsx", import.meta.url);
test("Canva landing component contains the core brief anchors", async () => {
test("Landing component contains the core brief anchors", async () => {
const source = await readFile(componentPath, "utf8");
for (const phrase of ["Projektbrief", "01", "Website", "Kontakt", "für", "müssen", "Änderungen"]) {
@@ -12,7 +12,7 @@ test("Canva landing component contains the core brief anchors", async () => {
}
});
test("Canva landing component uses real German umlauts in visible copy", async () => {
test("Landing component uses real German umlauts in visible copy", async () => {
const source = await readFile(componentPath, "utf8");
for (const asciiFallback of [