From 69dd6426b3537cde6f7b2da4ccfcfb3a985aab5f Mon Sep 17 00:00:00 2001 From: nwrenger Date: Sat, 6 Apr 2024 19:29:00 +0200 Subject: [PATCH] :sparkles: Added some animations && Updated description --- src/lib/index.ts | 1 - src/lib/utils.ts | 6 +++ src/routes/+layout.svelte | 71 ++++++++++++++++++------------ src/routes/+page.svelte | 93 +++++++++++++++++++++++++-------------- 4 files changed, 108 insertions(+), 63 deletions(-) delete mode 100644 src/lib/index.ts create mode 100644 src/lib/utils.ts diff --git a/src/lib/index.ts b/src/lib/index.ts deleted file mode 100644 index 856f2b6..0000000 --- a/src/lib/index.ts +++ /dev/null @@ -1 +0,0 @@ -// place files you want to import through the `$lib` alias in this folder. diff --git a/src/lib/utils.ts b/src/lib/utils.ts new file mode 100644 index 0000000..acf4e3c --- /dev/null +++ b/src/lib/utils.ts @@ -0,0 +1,6 @@ +// Get random Integer in Range function, js doesn't have a native function for that... +export function getRandomInt(min: number, max: number): number { + min = Math.ceil(min); + max = Math.floor(max); + return Math.floor(Math.random() * (max - min + 1)) + min; +} diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 83dd0a5..2232908 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -6,10 +6,13 @@ type PopupSettings, AppShell, LightSwitch, - storePopup + storePopup, + setInitialClassState } from '@skeletonlabs/skeleton'; import { computePosition, autoUpdate, offset, shift, flip, arrow } from '@floating-ui/dom'; + import { fade } from 'svelte/transition'; + import { onMount } from 'svelte'; storePopup.set({ computePosition, autoUpdate, offset, shift, flip, arrow }); const profile: PopupSettings = { @@ -17,44 +20,54 @@ target: 'profileContents', placement: 'bottom' }; + + let mounted = false; + onMount(() => (mounted = true)); +{@html ''} + -
- + {#if mounted} +
+ -
-
-
-

Nils Wrenger

-

nwrenger

-
-

Hi, I use Fedora OS and have skills in programming with Rust btw

-
- 9 Followers - 11 Following +
+
+
+

Nils Wrenger

+

nwrenger

+
+

Hi, I use Fedora OS and have skills in programming with Rust btw

+
+ 9 Followers + 11 Following +
+ + View on Github +
- - View on Github - +
-
+
- -
+ {/if} diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index ed7fa2b..bea7a50 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,4 +1,8 @@ - @@ -81,39 +88,59 @@ /> -
-

Hi, there!

+{#if mounted} +
+

Hi, there!

-

- I'm Nils, a high school student passionate about coding, particularly in Rust + I'm Nils, a high school student passionate about coding, particularly in Rust + and in Svelte. I have done a + lot of things so far, so look for that under Projects. Feel free to + reach out for a chat about coding or anything else via my E-Mail + nils@wrenger.net! +

+ +
- and in Svelte. I have done a - lot of things so far, so look for that under Projects. Feel free to - reach out for a chat about coding or anything else via my E-Mail - nils@wrenger.net! -

+

Projects

+ Total: {projects.length} +
-
-

Projects

- Total: {projects.length} -
+
+ {#each projects as project, i} + +
+

{project.title}

+

{project.description}

+
+ + {/each} +
-
- {#each projects as project} - -
-

{project.title}

-

{project.description}

-
- - {/each} +

+ More details and other smaller Projects can be seen on + my Github +

- -

- More details and other smaller Projects can be seen on - my Github -

-
+{/if}