diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte index 7854e85..4914b63 100644 --- a/src/lib/components/Footer.svelte +++ b/src/lib/components/Footer.svelte @@ -34,8 +34,10 @@ align-items: center; justify-content: center; gap: 1rem; + margin-top: 5rem; padding: 2rem; + background-color: var(--color-footer-background); } diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte index 156ce23..00887fa 100644 --- a/src/lib/components/Header.svelte +++ b/src/lib/components/Header.svelte @@ -34,17 +34,20 @@ font-size: 0.75rem; font-weight: bold; - background-color: var(--color-dark-blue); + background-color: var(--color-header-background); backdrop-filter: blur(1rem); @media (min-width: 768px) { + position: sticky; top: 0; bottom: unset; width: auto; padding: 1rem; + border: unset; + border-bottom: 1px solid var(--color-header-border); border-radius: unset; font-size: 1.125rem; diff --git a/src/lib/components/Intro.svelte b/src/lib/components/Intro.svelte new file mode 100644 index 0000000..7a515ab --- /dev/null +++ b/src/lib/components/Intro.svelte @@ -0,0 +1,102 @@ + + +
+
+
+ +
+

{name}

+

{title}

+

{text}

+
+
+ + \ No newline at end of file diff --git a/src/lib/data/data.json b/src/lib/data/data.json index fd5f25f..a8b1d12 100644 --- a/src/lib/data/data.json +++ b/src/lib/data/data.json @@ -25,5 +25,10 @@ "linkedin": "https://www.linkedin.com/in/adrian-fennert-b3148920a/" }, "copyright": "© 2026 Adrian Fennert. Alle Rechte vorbehalten." + }, + "intro": { + "name": "Adrian Fennert", + "title": "Senior Fullstack Engineer", + "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." } } diff --git a/src/lib/styles/app.css b/src/lib/styles/app.css index 3c3c2a9..79adb4a 100644 --- a/src/lib/styles/app.css +++ b/src/lib/styles/app.css @@ -1,15 +1,24 @@ :root { --color-body-background: oklch(0.21 0.034 264.665); - --color-footer-background: oklch(0.13 0.028 261.692); - - --color-header-border: oklab(0.623 -0.0378409 -0.210628 / 0.3); - --color-dark-blue: oklab(0.21 -0.00316128 -0.0338527 / 0.95); --color-text-primary: oklch(0.872 0.01 258.338); --color-text-secondary: oklch(0.551 0.027 264.364); - --color-accent-primary: oklch(70.7% 0.165 254.624); - --color-accent-secondary:oklch(0.585 0.233 277.117); + --color-header-border: oklab(0.623 -0.0378409 -0.210628 / 0.3); + --color-header-background: oklab(0.21 -0.00316128 -0.0338527 / 0.95); + --color-header-hover: oklch(70.7% 0.165 254.624); + + --color-footer-background: oklch(0.13 0.028 261.692); + + --color-intro-background-primary: oklab(0.379 -0.0113992 -0.145554 / 0.2); + --color-intro-background-secondary: oklab(0.379 -0.0113992 -0.145554 / 0.2); + --color-intro-image-background-primary: oklch(0.623 0.214 259.815); + --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); --z-index-header: 50; } diff --git a/src/lib/types/data.ts b/src/lib/types/data.ts index da09f8e..19bf441 100644 --- a/src/lib/types/data.ts +++ b/src/lib/types/data.ts @@ -1,6 +1,7 @@ export type Data = { header: Header; footer: Footer; + intro: Intro; }; export type Header = { @@ -22,3 +23,9 @@ export type FooterLink = { }; export type FooterLinkKey = 'git' | 'linkedin'; + +export type Intro = { + name: string; + title: string; + text: string; +} \ No newline at end of file diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 7a3320e..be3eac5 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,172 +1,9 @@ -

Welcome to SvelteKit

-

Visit svelte.dev/docs/kit to read the documentation

-
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem debitis dicta distinctio dolores dolorum ea eum - facilis ipsum itaque labore maxime odio, qui vel vero voluptas? Debitis ea praesentium quibusdam! -
-
Cumque enim eos facere magnam vero! A autem, delectus dignissimos distinctio enim inventore laudantium natus nihil - non omnis quisquam repudiandae sequi ullam veritatis vitae voluptas voluptates voluptatibus. Doloribus perspiciatis, - velit. -
-
Ab aliquid consectetur cum ea enim, est fugit, hic iure modi necessitatibus nobis non obcaecati odio officiis quam - quia, quibusdam reprehenderit sunt suscipit tenetur vel vitae voluptas! Eos, impedit, quidem? -
-
Consequuntur facere fuga neque nulla praesentium vero vitae! A aliquam aperiam, commodi doloremque et harum maiores - suscipit unde. Ad architecto dicta fugiat impedit molestias quae qui quod sint? Consequatur, ipsam? -
-
Blanditiis consectetur dolore eum mollitia voluptatibus. Eveniet expedita facilis minima nisi quisquam? Id quasi, - soluta! A atque, deserunt dolores eveniet magni molestiae nulla quas quisquam repudiandae similique velit vero - voluptatum. -
-
Accusamus accusantium ad adipisci alias animi eos et eveniet hic, incidunt inventore iste itaque laboriosam - laudantium molestias necessitatibus nesciunt nisi nobis odio, officia porro possimus, praesentium rem rerum similique - totam. -
-
Autem culpa cumque fugiat hic natus reiciendis tenetur. Aperiam aspernatur atque debitis, dignissimos doloremque - ducimus fuga illo impedit itaque magnam minima nostrum numquam odio quos repudiandae unde voluptate. Ipsam, pariatur! -
-
Alias aspernatur, assumenda commodi delectus doloremque excepturi exercitationem fugiat inventore ipsam iste - necessitatibus numquam perferendis tempora veniam voluptatem. Accusamus dolor doloribus ducimus est nam, nobis officia - placeat reiciendis rem totam. -
-
Ad commodi culpa delectus ea, eius ex ipsam iusto magnam recusandae rem repellat saepe sed voluptatum? At - consequatur dolor, esse incidunt minima nulla officiis veritatis. Cum ipsum iure similique temporibus! -
-
Accusamus alias animi architecto atque blanditiis consequuntur dolorum, eligendi eum ex facilis hic ipsa iste nemo, - nobis omnis provident qui quia quis rem sunt tempore ullam unde. Id, magnam, quam. -
-
Accusantium atque consectetur dignissimos dolor doloribus dolorum ea et labore magni mollitia necessitatibus neque - omnis, porro quaerat qui quidem quod quos ratione rerum tempora veniam, vero vitae voluptatem? Animi, fugiat. -
-
Consectetur, debitis dolores doloribus ea minima pariatur placeat quidem tenetur veniam. Ab, beatae cumque deserunt - ducimus enim eum ex illum incidunt labore modi, natus nemo nihil omnis quasi quia voluptates! -
-
Alias asperiores autem blanditiis dolorem ea error illum iure, laborum necessitatibus quia quibusdam quidem, - reiciendis vel. Beatae corporis est laudantium libero quidem sed vero! Adipisci in iusto officiis ratione - reprehenderit. -
-
A animi dolorum id perspiciatis sequi tenetur voluptas? Accusantium beatae commodi dicta distinctio doloribus eos - odio provident quasi, quia rem reprehenderit sit, voluptates. Aliquid asperiores cumque inventore nulla quibusdam? - Natus. -
-
A animi architecto aut autem eius eum eveniet facere ipsam nulla odio quam quidem quis quos ratione, sit soluta - tempora tempore velit. Cum, dolorem hic illum quam rem tenetur vero! -
-
Accusantium ad adipisci aspernatur ea est eum ipsa nam porro. Accusantium architecto autem consequuntur cupiditate - deserunt doloribus dolorum error ex explicabo itaque iusto praesentium qui, repellendus sint sunt, velit veniam! -
-
Adipisci consequatur cum dicta et ex harum illum laudantium magni maxime nisi perferendis porro quasi quod, - recusandae reprehenderit rerum sint tempore vero vitae voluptas? Ad delectus libero nesciunt quod totam. -
-
Culpa dignissimos facere quam? Aliquid, atque deserunt dignissimos dolorem eius eos eveniet, fugiat iusto magnam - magni maxime nulla obcaecati sunt tenetur veniam voluptas voluptatibus. Adipisci consectetur corporis ducimus fugiat - incidunt? -
-
Dolorem explicabo minima odio quis recusandae. Accusantium amet earum fugit illo nostrum quasi sit voluptatibus! - Accusantium aliquam aspernatur blanditiis commodi debitis, doloremque inventore laboriosam molestias nesciunt, nulla - ratione, recusandae temporibus? -
-
Aperiam dicta dolor error ipsam iusto nostrum quas sint. Eius hic itaque sequi. Accusantium blanditiis, error - impedit, itaque laboriosam minima molestiae nisi possimus repellendus sequi sit soluta veniam? Quas, repudiandae! -
-
Ab aut beatae blanditiis, deleniti, dolor ducimus esse illo praesentium repellat repellendus, reprehenderit sed - similique velit. Aliquid aspernatur eligendi ex ipsam necessitatibus numquam, odit omnis, optio quisquam quod suscipit - unde. -
-
Animi consectetur consequatur delectus, enim eveniet illum recusandae unde. Accusantium amet autem, deserunt dolore - esse illo impedit magnam magni nobis quae repellat sapiente ut vitae! Esse modi natus optio quas? -
-
Aliquam aliquid est excepturi fuga illum inventore nostrum provident, similique soluta! Alias aperiam, consequuntur - corporis est eum id, illum in magnam, molestiae nisi quisquam sapiente soluta voluptate. Maxime quaerat, soluta. -
-
Accusantium aliquam aliquid autem consequatur culpa eaque et, facere fugiat iste minima necessitatibus quia - quisquam quo rem vitae! Aspernatur cum cumque est fuga, illum ipsa ipsam nostrum officia perspiciatis ullam! -
-
A impedit in iste, officiis pariatur porro quasi saepe. A adipisci atque aut dicta ducimus fuga nam neque nulla - pariatur perspiciatis sapiente, tempora velit vitae! Architecto doloribus et nihil voluptatibus! -
-
Eligendi eos magnam temporibus! Excepturi facere itaque vel! Ad amet autem beatae doloribus, harum ipsa ipsum - labore nisi nobis nostrum placeat, saepe sapiente sed sunt vel, veritatis voluptates! Minus, vel. -
-
A adipisci animi ducimus esse in minima mollitia, nihil quaerat ratione voluptatum! Accusantium assumenda aut - beatae eveniet fugiat incidunt nam necessitatibus nesciunt placeat, quis rerum, sed tenetur? Aspernatur, nihil, - veniam. -
-
Aliquam asperiores consequatur corporis debitis deleniti facilis impedit ipsum labore nemo odio porro, possimus - quam quia quos, similique sint voluptates! Ab accusamus amet consequatur eius illo impedit quidem veritatis - voluptatem. -
-
Aperiam consequatur dignissimos eius illum itaque obcaecati placeat recusandae sed. Aperiam aspernatur at - blanditiis deserunt ducimus eius excepturi fuga id impedit, modi, nam praesentium quod quos repellendus rerum sint - voluptatibus. -
-
Animi architecto aut autem corporis cum debitis dignissimos expedita facere ipsa magni molestiae molestias officia - optio, possimus quaerat repellendus reprehenderit unde vero! Cumque et eum fugiat maiores totam voluptate voluptatum! -
-
Accusantium alias amet autem, consequuntur, corporis cum doloremque ducimus eveniet excepturi hic magnam magni - maxime modi quam quia quibusdam quos recusandae repellat reprehenderit rerum sed similique tenetur velit? Omnis, - reprehenderit! -
-
Alias deserunt illum incidunt laborum maiores molestiae, quae quisquam sapiente veritatis voluptatem? Ab, aut - distinctio dolores enim hic nesciunt odio repudiandae temporibus velit voluptatem. Corporis doloremque expedita nisi - nulla qui. -
-
Magnam quae quo sint? Et facilis itaque magni nobis voluptatum? Atque delectus dolore dolorem dolores, dolorum - eligendi enim esse et harum in ipsam iste minus, nostrum quis recusandae unde ut. -
-
Accusantium distinctio eaque error id iure rem tenetur. Accusamus aperiam cumque hic id, iste laborum libero nihil - nobis praesentium quas quis reiciendis similique ut. Accusantium cumque cupiditate est fugit iste! -
-
Ab cumque dicta dolore exercitationem laboriosam nobis nostrum perferendis qui saepe vitae! Accusamus accusantium - aperiam, at autem culpa cumque ea eaque fuga ipsam rem, reprehenderit soluta veniam voluptate? Consequatur, cum. -
-
Libero, officiis, totam. A, asperiores atque dicta error eveniet ipsam labore laboriosam libero omnis. Aliquid ea - quidem tenetur totam voluptas? Ea exercitationem nulla perferendis. Debitis explicabo fuga laboriosam recusandae - tenetur? -
-
Atque error illo itaque necessitatibus numquam, perspiciatis quaerat qui quos tempore voluptates! Doloremque ea - quis tenetur unde. Accusantium dignissimos est ex exercitationem facere, fugit illo laborum quasi qui sapiente - voluptates! -
-
Aperiam assumenda culpa fugit harum, incidunt non, nostrum quidem ratione, sequi tempore voluptas voluptate - voluptates. Est expedita facilis harum illo magnam quam sed tenetur totam. Cum nihil quia quo vel! -
-
Corporis cumque enim eveniet, itaque perferendis repellat sit. Culpa fugiat officia saepe sit velit. Architecto - atque error fugit. Beatae consectetur cumque est ex laudantium, molestiae nobis officia rerum vero voluptas! -
-
Adipisci, architecto at commodi culpa dolor dolorem doloribus ducimus earum eligendi ex facilis illo magnam minima - nesciunt, officia perferendis praesentium quibusdam quisquam rerum, saepe sapiente sequi suscipit totam unde - voluptatum. -
-
Aperiam consectetur corporis cumque dolore error est eum inventore laboriosam magni molestias nisi, officiis quam - quasi, repellat repudiandae tempore totam? Accusamus cum eligendi, esse obcaecati officia similique? Sapiente, tempore - voluptate. -
-
Alias assumenda consectetur eligendi ipsa natus non odit optio rerum, tempore voluptates! Aut debitis magni maxime - minima qui. Cupiditate distinctio, doloribus fugiat laudantium maiores neque officiis rerum sed sit tempore? -
-
Accusantium adipisci alias amet animi atque, corporis cumque eaque esse et eum facilis fugit, minus nemo nihil - nobis officiis quos veniam veritatis, vero voluptatum. Consequatur cum dignissimos exercitationem nulla sunt! -
-
Ad aperiam cum cupiditate delectus dignissimos doloribus, ex facere fugit hic illum ipsa ipsum, iusto labore - laboriosam, laborum omnis quidem sapiente tempore totam vel. Consequuntur dignissimos dolores neque quisquam - repellendus. -
-
A cum, exercitationem id neque nobis omnis. Minima nihil pariatur sit? Adipisci aliquam aliquid assumenda delectus - deleniti est excepturi labore minima necessitatibus placeat quaerat quasi, quod recusandae repellendus saepe voluptas. -
-
Ad animi dolorem ea, iusto magnam quas reiciendis voluptatum. Ad alias blanditiis corporis cumque deleniti id - laborum molestias, nobis, perspiciatis porro, possimus qui rem reprehenderit repudiandae rerum! Aliquam, deserunt, - fugiat. -
-
Autem consectetur debitis deserunt ducimus illum mollitia reprehenderit soluta tempora tempore voluptatibus? Culpa - cumque dolor est illo iste itaque magni, minima omnis, pariatur quam qui sit ullam velit vitae voluptatibus! -
-
Accusamus consectetur cumque ea fugit id itaque iure, magnam nesciunt pariatur quisquam, quos ut. Aliquid deleniti - expedita, ipsam magnam maiores nulla officiis, quia, quidem rem repellat sed tempora temporibus voluptatem! -
-
Aspernatur dolorum error fuga inventore nam quo reprehenderit veniam. Accusamus aliquid, asperiores deleniti dolor - dolore dolores ea facere incidunt inventore, iure molestiae nihil odio odit officiis optio, qui vitae voluptate? -
-
Deleniti eveniet laboriosam molestiae nisi odio omnis pariatur, perspiciatis tempora? Architecto culpa cumque - delectus distinctio doloremque dolorum hic incidunt ipsa ipsum labore laborum, odio quam sint sit tempore veniam vero? -
+ + + \ No newline at end of file