From 9e07f00899731c257e055a2ec838506423a91b43 Mon Sep 17 00:00:00 2001 From: Laurent <58115082+naaturel@users.noreply.github.com> Date: Sat, 12 Oct 2024 00:11:23 +0200 Subject: [PATCH] Add some other style legally stolen on https://codepen.io/ --- package.json | 5 +- src/app.css | 16 +++--- src/app.html | 6 +- src/lib/components/NavLink.svelte | 4 +- src/routes/+layout.svelte | 35 +++++++++--- static/style/menu.css | 94 +++++++++++++++++++++++++++++++ 6 files changed, 142 insertions(+), 18 deletions(-) create mode 100644 static/style/menu.css diff --git a/package.json b/package.json index 0aabdae..1a93e43 100644 --- a/package.json +++ b/package.json @@ -33,5 +33,8 @@ "vite": "^5.0.3", "vitest": "^2.0.0" }, - "type": "module" + "type": "module", + "dependencies": { + "jquery": "^3.7.1" + } } diff --git a/src/app.css b/src/app.css index e0fe217..4ea292b 100644 --- a/src/app.css +++ b/src/app.css @@ -22,17 +22,18 @@ h1 html { - /*background: linear-gradient(45deg, #102eff, #d2379b);*/ background: linear-gradient(45deg, #b9b9c9, #d2379b); height: 100vh; + } body { display: flex; + flex-direction: row; + height: 100vh; align-items: center; - flex-direction: column; } .container @@ -57,13 +58,14 @@ hr { nav { display: flex; + flex-direction: column; align-self: start; - justify-content: space-around; + justify-content: center; align-items: center; + gap: 3vh; + height: fit-content; - height: 5vh; - - margin-top: 2vh; + margin-top: 10vh; margin-bottom: 2vh; } @@ -122,4 +124,4 @@ footer footer a { margin-right: 2vh; -} \ No newline at end of file +} diff --git a/src/app.html b/src/app.html index 284c860..336f516 100644 --- a/src/app.html +++ b/src/app.html @@ -2,9 +2,13 @@ Unluckiest + - + + + + %sveltekit.head% diff --git a/src/lib/components/NavLink.svelte b/src/lib/components/NavLink.svelte index b37db96..9445026 100644 --- a/src/lib/components/NavLink.svelte +++ b/src/lib/components/NavLink.svelte @@ -12,7 +12,7 @@ a { - color: #303633; + color: #f1ecec; display: flex; justify-content: center; align-items: center; @@ -30,7 +30,7 @@ a:hover { transform: scale(1.1); - color: #f1ecec; + color: #303633; } diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 940375a..e80cc7b 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,20 +1,41 @@ - +
- +
+ +