diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte index 4914b63..b643689 100644 --- a/src/lib/components/Footer.svelte +++ b/src/lib/components/Footer.svelte @@ -76,7 +76,7 @@ div { font-size: 0.875rem; - color: var(--color-text-secondary); + color: var(--color-text-tertiary); text-align: center; } \ No newline at end of file diff --git a/src/lib/components/Intro.svelte b/src/lib/components/Profile.svelte similarity index 80% rename from src/lib/components/Intro.svelte rename to src/lib/components/Profile.svelte index 7a515ab..cc1e6b4 100644 --- a/src/lib/components/Intro.svelte +++ b/src/lib/components/Profile.svelte @@ -1,18 +1,18 @@ -
+

{name}

-

{title}

-

{text}

+

{title}

+

{text}

@@ -33,7 +33,7 @@ div { display: flex; flex-direction: column; - align-items: center; + align-items: stretch; justify-content: center; gap: 1rem; @@ -65,11 +65,7 @@ margin: unset; color: transparent; font-size: 2.25rem; - background-image: linear-gradient( - to right, - var(--color-intro-subtitle-text-primary) 0%, - var(--color-intro-subtitle-text-secondary) 60%, - var(--color-intro-subtitle-text-tertiary) 100%); + background-image: var(--color-headline-background-image); background-clip: text; @media (min-width: 768px) { @@ -77,7 +73,7 @@ } } - h2 { + .title { margin: unset; margin-bottom: 1rem; @@ -89,7 +85,7 @@ } } - p { + .text { margin: unset; color: var(--color-intro-text); font-size: 1.125rem; diff --git a/src/lib/components/ProjectEntry.svelte b/src/lib/components/ProjectEntry.svelte new file mode 100644 index 0000000..53097ff --- /dev/null +++ b/src/lib/components/ProjectEntry.svelte @@ -0,0 +1,20 @@ + + +
+ +
+ + \ No newline at end of file diff --git a/src/lib/components/Projects.svelte b/src/lib/components/Projects.svelte new file mode 100644 index 0000000..9c9e763 --- /dev/null +++ b/src/lib/components/Projects.svelte @@ -0,0 +1,63 @@ + + +
+

{title}

+ {#if (subtitle)} +

{subtitle}

+ {/if} +
+ {#each entries as entry, i (i)} + + {/each} +
+
+ + \ No newline at end of file diff --git a/src/lib/data/data.json b/src/lib/data/data.json index a8b1d12..82baeea 100644 --- a/src/lib/data/data.json +++ b/src/lib/data/data.json @@ -26,9 +26,93 @@ }, "copyright": "© 2026 Adrian Fennert. Alle Rechte vorbehalten." }, - "intro": { + "profile": { "name": "Adrian Fennert", "title": "Senior Fullstack Engineer", + "anchorId": "profile", "text": "Erfahrener Full-Stack Developer mit Fokus auf moderne Web-Technologien. Spezialisiert auf skalierbare Anwendungen, Teamführung und Integration komplexer Systeme. Leidenschaft für sauberen Code und benutzerzentrierte Lösungen." + }, + "projects": { + "title": "Projekte", + "anchorId": "projects", + "subtitle": "Aktuelle und Vergangenne Projekte and denen ich erfolgreich mitgewirkt habe", + "entries": [ + { + "title": "Custom Frontend für GPT-Anwendung mit Dokumentenverwaltung", + "description": "Entwicklung einer modernen Single-Page-Application für die interne KI-Nutzung mit umfassender Dokumentenverwaltung.", + "taskHeadline": "Tätigkeiten", + "tasks": "Konzeption und Implementierung benutzerspezifischer Dokument-Kollektionen, Integration von MSAL für SSO.", + "toolsHeadline": "Tools", + "tools": [ + "Next.JS", + "assistant-ui", + "Microsoft Authentication Library", + "Typescript", + "Model Context Protocol - MCP" + ] + }, + { + "title": "B2B-Customer-Portal Erweiterung", + "description": "Erweiterung eines Portals für Produktregistrierungen und Garantieabwicklungen.", + "taskHeadline": "Tätigkeiten", + "tasks": "Umsetzung kundenspezifischer Prozesse, Optimierung der User Journeys in Zusammenarbeit mit Fachbereichen.", + "toolsHeadline": "Tools", + "tools": [ + "SAP Commerce Cloud", + "SAP Composable Storefront", + "Smartedit", + "Angular", + "Typescript" + ] + }, + { + "title": "Frontend Lead für B2B-Portal", + "description": "Fachliche Führung und Entwicklung eines Customer-Portals.", + "taskHeadline": "Tätigkeiten", + "tasks": "Coaching des Teams, Know-how-Aufbau in Angular und Spartacus, Integration von Such- und IAM-Diensten.", + "toolsHeadline": "Tools", + "tools": [ + "SAP Commerce Cloud", + "SAP Composable Storefront", + "Smartedit", + "Angular", + "Typescript", + "Keyloak", + "Coveo" + ] + }, + { + "title": "Backend-Migrationen und Testframework upgrades", + "description": "Migration von Testumgebungen und Integrations-Frameworks.", + "taskHeadline": "Tätigkeiten", + "tasks": "Upgrade Unit- und Integrationstests, Migration Apache Camel zu Spring Integration.", + "toolsHeadline": "Tools", + "tools": [ + "SAP Commerce Cloud", + "Spring Boot", + "Spring Integration", + "SAP Integration Suite", + "Typescript", + "OData", + "SAP ERP" + ] + }, + { + "title": "Storefront-Migration zu SPA", + "description": "Rolling-Release-Migration und Neuentwicklung eines Online-Shops.", + "taskHeadline": "Tätigkeiten", + "tasks": "Integration Suchdienst und Headless CMS.", + "toolsHeadline": "Tools", + "tools": [ + "SAP Commerce Cloud", + "Spring Boot", + "React", + "Next.JS", + "Typescript", + "Algolia", + "Contentful" + ] + } + ] } } diff --git a/src/lib/styles/app.css b/src/lib/styles/app.css index 79adb4a..b0f1064 100644 --- a/src/lib/styles/app.css +++ b/src/lib/styles/app.css @@ -2,7 +2,9 @@ --color-body-background: oklch(0.21 0.034 264.665); --color-text-primary: oklch(0.872 0.01 258.338); - --color-text-secondary: oklch(0.551 0.027 264.364); + --color-text-secondary: oklch(0.707 0.022 261.325); + --color-text-tertiary: oklch(0.551 0.027 264.364); + --color-header-border: oklab(0.623 -0.0378409 -0.210628 / 0.3); --color-header-background: oklab(0.21 -0.00316128 -0.0338527 / 0.95); @@ -16,9 +18,15 @@ --color-intro-image-background-secondary: oklch(0.511 0.262 276.966); --color-intro-text: oklch(0.967 0.003 264.542); --color-intro-title-text: oklch(0.809 0.105 251.813); - --color-intro-subtitle-text-primary: oklch(0.707 0.165 254.624); - --color-intro-subtitle-text-secondary: oklch(0.673 0.182 276.935); - --color-intro-subtitle-text-tertiary: oklch(0.714 0.203 305.504); + + --color-headline-primary: oklch(0.707 0.165 254.624); + --color-headline-secondary: oklch(0.673 0.182 276.935); + --color-headline-tertiary: oklch(0.714 0.203 305.504); + --color-headline-background-image: linear-gradient( + to right, + var(--color-headline-primary) 0%, + var(--color-headline-secondary) 60%, + var(--color-headline-tertiary) 100%); --z-index-header: 50; } @@ -37,4 +45,5 @@ html, body { margin: unset; background-color: var(--color-body-background); font-family: 'AdwaitaSans', 'AdwaitaMono', sans-serif; + scroll-behavior: smooth; } \ No newline at end of file diff --git a/src/lib/types/data.ts b/src/lib/types/data.ts index 19bf441..f923f9f 100644 --- a/src/lib/types/data.ts +++ b/src/lib/types/data.ts @@ -1,7 +1,8 @@ export type Data = { header: Header; footer: Footer; - intro: Intro; + profile: Profile; + projects: Projects; }; export type Header = { @@ -24,8 +25,25 @@ export type FooterLink = { export type FooterLinkKey = 'git' | 'linkedin'; -export type Intro = { +export type Profile = { name: string; title: string; + anchorId: string; text: string; +} + +export type Projects = { + title: string; + anchorId: string; + subtitle?: string; + entries: ProjectEntry[]; +}; + +export type ProjectEntry = { + title: string; + description: string; + taskHeadline: string; + tasks: string; + toolsHeadline: string; + tools: string[]; } \ No newline at end of file diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index be3eac5..276a195 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,9 +1,11 @@ - \ No newline at end of file + + \ No newline at end of file