From 99935d9f78982fa34f0668a5169eb82fd4d677ae Mon Sep 17 00:00:00 2001
From: Mid <mrrmiddynight@gmail.com>
Date: Sat, 7 Oct 2023 02:28:12 +0200
Subject: [PATCH] Visual improvements

---
 src/lib/home/Portfolio.svelte       |  2 +-
 src/lib/home/Sona.svelte            | 10 +++++-----
 src/lib/home/Virtual.svelte         |  2 +-
 src/routes/+page.svelte             |  5 ++---
 static/homepage/bottomfadedark.svg  |  1 -
 static/homepage/bottomfadelight.svg |  1 -
 static/homepage/topfade.svg         |  1 +
 static/homepage/topfadedark.svg     |  1 -
 static/homepage/topfadelight.svg    |  1 -
 static/homepage/wave.svg            |  2 ++
 10 files changed, 12 insertions(+), 14 deletions(-)
 delete mode 100644 static/homepage/bottomfadedark.svg
 delete mode 100644 static/homepage/bottomfadelight.svg
 create mode 100644 static/homepage/topfade.svg
 delete mode 100644 static/homepage/topfadedark.svg
 delete mode 100644 static/homepage/topfadelight.svg
 create mode 100644 static/homepage/wave.svg

diff --git a/src/lib/home/Portfolio.svelte b/src/lib/home/Portfolio.svelte
index 7ed2994..a854712 100644
--- a/src/lib/home/Portfolio.svelte
+++ b/src/lib/home/Portfolio.svelte
@@ -61,7 +61,7 @@
     <div class="@container flex flex-col justify-center">
         <div class="flex flex-col gap-2 whitepigeon text-white text-center bg-[#3A53FF]">
             <h2 class="font-bold text-4xl lg:text-8xl">Portfolio</h2>
-            <p class="lg:text-lg">A collection of some of my past and current projects and experiences</p>
+            <p class="lg:text-lg">A collection of some of the projects and experiences I am most proud of</p>
         </div>
 
         <div class="container px-5 my-5 lg:my-20 grid grid-cols-1 @2xl:grid-cols-2 @6xl:grid-cols-3 gap-5 justify-between">
diff --git a/src/lib/home/Sona.svelte b/src/lib/home/Sona.svelte
index 7f4868d..a7e5322 100644
--- a/src/lib/home/Sona.svelte
+++ b/src/lib/home/Sona.svelte
@@ -15,14 +15,14 @@
     </h3>
     <div class="grid lg:grid-cols-5 gap-5">
 		<div class="lg:col-span-3 flex flex-col gap-5">
-			<div class="flex flex-wrap gap-2 bg-black bg-opacity-5 dark:bg-opacity-50 p-5">
+			<div class="flex flex-wrap gap-2 bg-black bg-opacity-5 dark:bg-opacity-40 p-5">
 				<p class="font-bold">
 					Hey there! I'm Pascal, but my internet name is Mid. Nice to have you here on my website. I'm a {calculateAge(new Date("2001-10-30"))} year old programmer and tech enthusiast from The Netherlands.
 					If you wanna know a little more about me then here are some of the things I like to do. For my past experience and portfolio visit <a href="#portfolio" class="a">my portfolio section</a>.
 				</p>
 			</div>
 
-			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4">
+			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
 				<span id="about-computers" class="absolute top-0 -mt-40"></span>
 
 				<h4 class="text-lg font-bold">🖥 Computers</h4>
@@ -37,7 +37,7 @@
 				<img src="/homepage/proxmox.png" alt="proxmox environment" />
 			</div>
 
-			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4">
+			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
 				<span id="about-furry" class="absolute top-0 -mt-40"></span>
 
 				<h4 class="text-lg font-bold">🦊 Furry</h4>
@@ -55,7 +55,7 @@
 				</div>
 			</div>
 
-			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4">
+			<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
 				<span id="about-drones" class="absolute top-0 -mt-40"></span>
 
 				<h4 class="text-lg font-bold">🛩️ Drones</h4>
@@ -72,7 +72,7 @@
 		</div>
 
 		<div class="lg:col-span-2 flex flex-col gap-5 overflow-x-hidden pt-10">
-			<div class="flex flex-col gap-1 text-sm p-5 border-black border-opacity-20 dark:border-opacity-60 border-dashed border-4">
+			<div class="flex flex-col gap-1 text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-dashed border-4">
 				<h4 class="-mt-12 lg:-mt-16 lg:text-lg bg-gray-200 dark:bg-gray-800 -mx-3 text-blue-500 overflow-x-hidden">
 					<b>////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////</b><br/>
 					<b>//</b> user details<br/>
diff --git a/src/lib/home/Virtual.svelte b/src/lib/home/Virtual.svelte
index 0597da6..57e628e 100644
--- a/src/lib/home/Virtual.svelte
+++ b/src/lib/home/Virtual.svelte
@@ -76,7 +76,7 @@
 			<img src="/homepage/vr/fancy.png" class="skew-x-3 object-cover @6xl:aspect-[1/1] w-full h-full" alt="couch" />
 
 			<div class="object-cover @6xl:aspect-[2/1] h-full w-full @6xl:col-span-2 flex flex-col gap-5 text-lg relative">
-				<div class="absolute inset-0 w-full h-full bg-white dark:bg-black skew-x-3"></div>
+				<div class="absolute inset-0 w-full h-full dark:bg-black skew-x-3"></div>
 				<p class="absolute inset-0 w-full h-full lg:p-10">
 					VR is a world where anything is possible. A place where cities can be built with just a few button clicks. A place where friendships and communities are built on creativity and compassion. A place where anyone can be what they want to be without limitation. A place where freedom flourishes and humanity's light shines brighter than anywhere else.
 					<br/><br/>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 7a3fbf7..4558db9 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -18,10 +18,9 @@
 		<Blog/>
 	</div>
 
-	<img class="dark:hidden block scale-100" src="/homepage/topfadelight.svg" />
-    <img class="hidden dark:block scale-100" src="/homepage/topfadedark.svg" />
+	<div class="bg-gray-200 dark:bg-gray-800" style="height: 150px; overflow: hidden;"><svg viewBox="0 0 500 150" preserveAspectRatio="none" style="height: 100%; width: 100%;"><path d="M-65.62,-22.99 C146.87,168.99 238.74,166.00 589.37,-22.99 L543.74,181.99 L0.00,150.00 Z" style="stroke: none; fill: rgb(58, 83, 255);"></path></svg></div>
 
-	<div class="bg-[#3A53FF]">
+	<div class="bg-[#3A53FF] pt-20">
 		<Portfolio/>
 	</div>
 
diff --git a/static/homepage/bottomfadedark.svg b/static/homepage/bottomfadedark.svg
deleted file mode 100644
index a5eabfa..0000000
--- a/static/homepage/bottomfadedark.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 13L83.3 13C166.7 13 333.3 13 500 13.3C666.7 13.7 833.3 14.3 916.7 14.7L1000 15L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#3a53ff"></path><path d="M0 51L83.3 50.7C166.7 50.3 333.3 49.7 500 51.3C666.7 53 833.3 57 916.7 59L1000 61L1000 13L916.7 12.7C833.3 12.3 666.7 11.7 500 11.3C333.3 11 166.7 11 83.3 11L0 11Z" fill="#2950eb"></path><path d="M0 59L83.3 58.7C166.7 58.3 333.3 57.7 500 59.3C666.7 61 833.3 65 916.7 67L1000 69L1000 59L916.7 57C833.3 55 666.7 51 500 49.3C333.3 47.7 166.7 48.3 83.3 48.7L0 49Z" fill="#194bd7"></path><path d="M0 67L83.3 66.7C166.7 66.3 333.3 65.7 500 67C666.7 68.3 833.3 71.7 916.7 73.3L1000 75L1000 67L916.7 65C833.3 63 666.7 59 500 57.3C333.3 55.7 166.7 56.3 83.3 56.7L0 57Z" fill="#0847c2"></path><path d="M0 75L83.3 75C166.7 75 333.3 75 500 76.3C666.7 77.7 833.3 80.3 916.7 81.7L1000 83L1000 73L916.7 71.3C833.3 69.7 666.7 66.3 500 65C333.3 63.7 166.7 64.3 83.3 64.7L0 65Z" fill="#0042ae"></path><path d="M0 101L83.3 101C166.7 101 333.3 101 500 101.7C666.7 102.3 833.3 103.7 916.7 104.3L1000 105L1000 81L916.7 79.7C833.3 78.3 666.7 75.7 500 74.3C333.3 73 166.7 73 83.3 73L0 73Z" fill="#003d9a"></path><path d="M0 109L83.3 109C166.7 109 333.3 109 500 109.7C666.7 110.3 833.3 111.7 916.7 112.3L1000 113L1000 103L916.7 102.3C833.3 101.7 666.7 100.3 500 99.7C333.3 99 166.7 99 83.3 99L0 99Z" fill="#003786"></path><path d="M0 123L83.3 122.3C166.7 121.7 333.3 120.3 500 121C666.7 121.7 833.3 124.3 916.7 125.7L1000 127L1000 111L916.7 110.3C833.3 109.7 666.7 108.3 500 107.7C333.3 107 166.7 107 83.3 107L0 107Z" fill="#013172"></path><path d="M0 137L83.3 136C166.7 135 333.3 133 500 133.3C666.7 133.7 833.3 136.3 916.7 137.7L1000 139L1000 125L916.7 123.7C833.3 122.3 666.7 119.7 500 119C333.3 118.3 166.7 119.7 83.3 120.3L0 121Z" fill="#072b5f"></path><path d="M0 153L83.3 153C166.7 153 333.3 153 500 153.3C666.7 153.7 833.3 154.3 916.7 154.7L1000 155L1000 137L916.7 135.7C833.3 134.3 666.7 131.7 500 131.3C333.3 131 166.7 133 83.3 134L0 135Z" fill="#0d254c"></path><path d="M0 159L83.3 159C166.7 159 333.3 159 500 159.7C666.7 160.3 833.3 161.7 916.7 162.3L1000 163L1000 153L916.7 152.7C833.3 152.3 666.7 151.7 500 151.3C333.3 151 166.7 151 83.3 151L0 151Z" fill="#101e39"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 161L916.7 160.3C833.3 159.7 666.7 158.3 500 157.7C333.3 157 166.7 157 83.3 157L0 157Z" fill="#111827"></path></svg>
\ No newline at end of file
diff --git a/static/homepage/bottomfadelight.svg b/static/homepage/bottomfadelight.svg
deleted file mode 100644
index 4ccbf8a..0000000
--- a/static/homepage/bottomfadelight.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 13L83.3 13C166.7 13 333.3 13 500 13.3C666.7 13.7 833.3 14.3 916.7 14.7L1000 15L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#3a53ff"></path><path d="M0 51L83.3 50.7C166.7 50.3 333.3 49.7 500 51.3C666.7 53 833.3 57 916.7 59L1000 61L1000 13L916.7 12.7C833.3 12.3 666.7 11.7 500 11.3C333.3 11 166.7 11 83.3 11L0 11Z" fill="#4465ff"></path><path d="M0 59L83.3 58.7C166.7 58.3 333.3 57.7 500 59.3C666.7 61 833.3 65 916.7 67L1000 69L1000 59L916.7 57C833.3 55 666.7 51 500 49.3C333.3 47.7 166.7 48.3 83.3 48.7L0 49Z" fill="#5275ff"></path><path d="M0 67L83.3 66.7C166.7 66.3 333.3 65.7 500 67C666.7 68.3 833.3 71.7 916.7 73.3L1000 75L1000 67L916.7 65C833.3 63 666.7 59 500 57.3C333.3 55.7 166.7 56.3 83.3 56.7L0 57Z" fill="#6084ff"></path><path d="M0 75L83.3 75C166.7 75 333.3 75 500 76.3C666.7 77.7 833.3 80.3 916.7 81.7L1000 83L1000 73L916.7 71.3C833.3 69.7 666.7 66.3 500 65C333.3 63.7 166.7 64.3 83.3 64.7L0 65Z" fill="#7093ff"></path><path d="M0 101L83.3 101C166.7 101 333.3 101 500 101.7C666.7 102.3 833.3 103.7 916.7 104.3L1000 105L1000 81L916.7 79.7C833.3 78.3 666.7 75.7 500 74.3C333.3 73 166.7 73 83.3 73L0 73Z" fill="#81a2ff"></path><path d="M0 109L83.3 109C166.7 109 333.3 109 500 109.7C666.7 110.3 833.3 111.7 916.7 112.3L1000 113L1000 103L916.7 102.3C833.3 101.7 666.7 100.3 500 99.7C333.3 99 166.7 99 83.3 99L0 99Z" fill="#93b0ff"></path><path d="M0 123L83.3 122.3C166.7 121.7 333.3 120.3 500 121C666.7 121.7 833.3 124.3 916.7 125.7L1000 127L1000 111L916.7 110.3C833.3 109.7 666.7 108.3 500 107.7C333.3 107 166.7 107 83.3 107L0 107Z" fill="#a5befe"></path><path d="M0 137L83.3 136C166.7 135 333.3 133 500 133.3C666.7 133.7 833.3 136.3 916.7 137.7L1000 139L1000 125L916.7 123.7C833.3 122.3 666.7 119.7 500 119C333.3 118.3 166.7 119.7 83.3 120.3L0 121Z" fill="#b8ccfc"></path><path d="M0 153L83.3 153C166.7 153 333.3 153 500 153.3C666.7 153.7 833.3 154.3 916.7 154.7L1000 155L1000 137L916.7 135.7C833.3 134.3 666.7 131.7 500 131.3C333.3 131 166.7 133 83.3 134L0 135Z" fill="#cbd9fb"></path><path d="M0 159L83.3 159C166.7 159 333.3 159 500 159.7C666.7 160.3 833.3 161.7 916.7 162.3L1000 163L1000 153L916.7 152.7C833.3 152.3 666.7 151.7 500 151.3C333.3 151 166.7 151 83.3 151L0 151Z" fill="#dfe7f8"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 161L916.7 160.3C833.3 159.7 666.7 158.3 500 157.7C333.3 157 166.7 157 83.3 157L0 157Z" fill="#f3f4f6"></path></svg>
\ No newline at end of file
diff --git a/static/homepage/topfade.svg b/static/homepage/topfade.svg
new file mode 100644
index 0000000..4f11514
--- /dev/null
+++ b/static/homepage/topfade.svg
@@ -0,0 +1 @@
+<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 61L23.8 61C47.7 61 95.3 61 143 57.5C190.7 54 238.3 47 286 44.3C333.7 41.7 381.3 43.3 428.8 55.2C476.3 67 523.7 89 571.2 99.2C618.7 109.3 666.3 107.7 714 96C761.7 84.3 809.3 62.7 857 61.8C904.7 61 952.3 81 976.2 91L1000 101L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#7d89ff"></path><path d="M0 105L23.8 102.8C47.7 100.7 95.3 96.3 143 95.7C190.7 95 238.3 98 286 99.3C333.7 100.7 381.3 100.3 428.8 96.2C476.3 92 523.7 84 571.2 77C618.7 70 666.3 64 714 65.8C761.7 67.7 809.3 77.3 857 81.8C904.7 86.3 952.3 85.7 976.2 85.3L1000 85L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#6574ff"></path><path d="M0 124L23.8 126.3C47.7 128.7 95.3 133.3 143 134.8C190.7 136.3 238.3 134.7 286 135.2C333.7 135.7 381.3 138.3 428.8 130.3C476.3 122.3 523.7 103.7 571.2 103.3C618.7 103 666.3 121 714 125.3C761.7 129.7 809.3 120.3 857 110.3C904.7 100.3 952.3 89.7 976.2 84.3L1000 79L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#4a5eff"></path><path d="M0 145L23.8 138.3C47.7 131.7 95.3 118.3 143 119.2C190.7 120 238.3 135 286 142.5C333.7 150 381.3 150 428.8 149.8C476.3 149.7 523.7 149.3 571.2 144C618.7 138.7 666.3 128.3 714 122.8C761.7 117.3 809.3 116.7 857 122.2C904.7 127.7 952.3 139.3 976.2 145.2L1000 151L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#374df2"></path><path d="M0 135L23.8 140.7C47.7 146.3 95.3 157.7 143 159C190.7 160.3 238.3 151.7 286 146.2C333.7 140.7 381.3 138.3 428.8 142.5C476.3 146.7 523.7 157.3 571.2 161C618.7 164.7 666.3 161.3 714 157.8C761.7 154.3 809.3 150.7 857 147C904.7 143.3 952.3 139.7 976.2 137.8L1000 136L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#3043d9"></path><path d="M0 182L23.8 182C47.7 182 95.3 182 143 180.2C190.7 178.3 238.3 174.7 286 171.5C333.7 168.3 381.3 165.7 428.8 165C476.3 164.3 523.7 165.7 571.2 166.8C618.7 168 666.3 169 714 171.8C761.7 174.7 809.3 179.3 857 177C904.7 174.7 952.3 165.3 976.2 160.7L1000 156L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#2838c0"></path></svg>
\ No newline at end of file
diff --git a/static/homepage/topfadedark.svg b/static/homepage/topfadedark.svg
deleted file mode 100644
index 9f69af8..0000000
--- a/static/homepage/topfadedark.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 33L83.3 34.7C166.7 36.3 333.3 39.7 500 40C666.7 40.3 833.3 37.7 916.7 36.3L1000 35L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#1f2937"></path><path d="M0 41L83.3 42.7C166.7 44.3 333.3 47.7 500 48C666.7 48.3 833.3 45.7 916.7 44.3L1000 43L1000 33L916.7 34.3C833.3 35.7 666.7 38.3 500 38C333.3 37.7 166.7 34.3 83.3 32.7L0 31Z" fill="#1b2f49"></path><path d="M0 53L83.3 54.3C166.7 55.7 333.3 58.3 500 59C666.7 59.7 833.3 58.3 916.7 57.7L1000 57L1000 41L916.7 42.3C833.3 43.7 666.7 46.3 500 46C333.3 45.7 166.7 42.3 83.3 40.7L0 39Z" fill="#15355b"></path><path d="M0 61L83.3 62C166.7 63 333.3 65 500 65.7C666.7 66.3 833.3 65.7 916.7 65.3L1000 65L1000 55L916.7 55.7C833.3 56.3 666.7 57.7 500 57C333.3 56.3 166.7 53.7 83.3 52.3L0 51Z" fill="#0c3a6e"></path><path d="M0 69L83.3 70C166.7 71 333.3 73 500 73.7C666.7 74.3 833.3 73.7 916.7 73.3L1000 73L1000 63L916.7 63.3C833.3 63.7 666.7 64.3 500 63.7C333.3 63 166.7 61 83.3 60L0 59Z" fill="#013f80"></path><path d="M0 97L83.3 97.3C166.7 97.7 333.3 98.3 500 98.3C666.7 98.3 833.3 97.7 916.7 97.3L1000 97L1000 71L916.7 71.3C833.3 71.7 666.7 72.3 500 71.7C333.3 71 166.7 69 83.3 68L0 67Z" fill="#004493"></path><path d="M0 105L83.3 105.3C166.7 105.7 333.3 106.3 500 106.3C666.7 106.3 833.3 105.7 916.7 105.3L1000 105L1000 95L916.7 95.3C833.3 95.7 666.7 96.3 500 96.3C333.3 96.3 166.7 95.7 83.3 95.3L0 95Z" fill="#0048a5"></path><path d="M0 119L83.3 119C166.7 119 333.3 119 500 119.7C666.7 120.3 833.3 121.7 916.7 122.3L1000 123L1000 103L916.7 103.3C833.3 103.7 666.7 104.3 500 104.3C333.3 104.3 166.7 103.7 83.3 103.3L0 103Z" fill="#004bb8"></path><path d="M0 131L83.3 131C166.7 131 333.3 131 500 131.3C666.7 131.7 833.3 132.3 916.7 132.7L1000 133L1000 121L916.7 120.3C833.3 119.7 666.7 118.3 500 117.7C333.3 117 166.7 117 83.3 117L0 117Z" fill="#004eca"></path><path d="M0 153L83.3 152.3C166.7 151.7 333.3 150.3 500 149.7C666.7 149 833.3 149 916.7 149L1000 149L1000 131L916.7 130.7C833.3 130.3 666.7 129.7 500 129.3C333.3 129 166.7 129 83.3 129L0 129Z" fill="#1051dc"></path><path d="M0 161L83.3 161C166.7 161 333.3 161 500 160.3C666.7 159.7 833.3 158.3 916.7 157.7L1000 157L1000 147L916.7 147C833.3 147 666.7 147 500 147.7C333.3 148.3 166.7 149.7 83.3 150.3L0 151Z" fill="#2652ee"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 155L916.7 155.7C833.3 156.3 666.7 157.7 500 158.3C333.3 159 166.7 159 83.3 159L0 159Z" fill="#3a53ff"></path></svg>
\ No newline at end of file
diff --git a/static/homepage/topfadelight.svg b/static/homepage/topfadelight.svg
deleted file mode 100644
index 999edd8..0000000
--- a/static/homepage/topfadelight.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 33L83.3 34.7C166.7 36.3 333.3 39.7 500 40C666.7 40.3 833.3 37.7 916.7 36.3L1000 35L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#e5e7eb"></path><path d="M0 41L83.3 42.7C166.7 44.3 333.3 47.7 500 48C666.7 48.3 833.3 45.7 916.7 44.3L1000 43L1000 33L916.7 34.3C833.3 35.7 666.7 38.3 500 38C333.3 37.7 166.7 34.3 83.3 32.7L0 31Z" fill="#d2dbf0"></path><path d="M0 53L83.3 54.3C166.7 55.7 333.3 58.3 500 59C666.7 59.7 833.3 58.3 916.7 57.7L1000 57L1000 41L916.7 42.3C833.3 43.7 666.7 46.3 500 46C333.3 45.7 166.7 42.3 83.3 40.7L0 39Z" fill="#bfcff4"></path><path d="M0 61L83.3 62C166.7 63 333.3 65 500 65.7C666.7 66.3 833.3 65.7 916.7 65.3L1000 65L1000 55L916.7 55.7C833.3 56.3 666.7 57.7 500 57C333.3 56.3 166.7 53.7 83.3 52.3L0 51Z" fill="#adc3f8"></path><path d="M0 69L83.3 70C166.7 71 333.3 73 500 73.7C666.7 74.3 833.3 73.7 916.7 73.3L1000 73L1000 63L916.7 63.3C833.3 63.7 666.7 64.3 500 63.7C333.3 63 166.7 61 83.3 60L0 59Z" fill="#9cb6fb"></path><path d="M0 97L83.3 97.3C166.7 97.7 333.3 98.3 500 98.3C666.7 98.3 833.3 97.7 916.7 97.3L1000 97L1000 71L916.7 71.3C833.3 71.7 666.7 72.3 500 71.7C333.3 71 166.7 69 83.3 68L0 67Z" fill="#8baafe"></path><path d="M0 105L83.3 105.3C166.7 105.7 333.3 106.3 500 106.3C666.7 106.3 833.3 105.7 916.7 105.3L1000 105L1000 95L916.7 95.3C833.3 95.7 666.7 96.3 500 96.3C333.3 96.3 166.7 95.7 83.3 95.3L0 95Z" fill="#7b9cff"></path><path d="M0 119L83.3 119C166.7 119 333.3 119 500 119.7C666.7 120.3 833.3 121.7 916.7 122.3L1000 123L1000 103L916.7 103.3C833.3 103.7 666.7 104.3 500 104.3C333.3 104.3 166.7 103.7 83.3 103.3L0 103Z" fill="#6c8fff"></path><path d="M0 131L83.3 131C166.7 131 333.3 131 500 131.3C666.7 131.7 833.3 132.3 916.7 132.7L1000 133L1000 121L916.7 120.3C833.3 119.7 666.7 118.3 500 117.7C333.3 117 166.7 117 83.3 117L0 117Z" fill="#5d81ff"></path><path d="M0 153L83.3 152.3C166.7 151.7 333.3 150.3 500 149.7C666.7 149 833.3 149 916.7 149L1000 149L1000 131L916.7 130.7C833.3 130.3 666.7 129.7 500 129.3C333.3 129 166.7 129 83.3 129L0 129Z" fill="#5072ff"></path><path d="M0 161L83.3 161C166.7 161 333.3 161 500 160.3C666.7 159.7 833.3 158.3 916.7 157.7L1000 157L1000 147L916.7 147C833.3 147 666.7 147 500 147.7C333.3 148.3 166.7 149.7 83.3 150.3L0 151Z" fill="#4463ff"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 155L916.7 155.7C833.3 156.3 666.7 157.7 500 158.3C333.3 159 166.7 159 83.3 159L0 159Z" fill="#3a53ff"></path></svg>
\ No newline at end of file
diff --git a/static/homepage/wave.svg b/static/homepage/wave.svg
new file mode 100644
index 0000000..8311c2f
--- /dev/null
+++ b/static/homepage/wave.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?>
+<svg xmlns:xlink="http://www.w3.org/1999/xlink" id="wave" style="transform:rotate(0deg); transition: 0.3s" viewBox="0 0 1440 290" version="1.1" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="sw-gradient-0" x1="0" x2="0" y1="1" y2="0"><stop stop-color="rgba(58, 83, 255, 1)" offset="0%"/><stop stop-color="rgba(194.454, 202.137, 255, 1)" offset="100%"/></linearGradient></defs><path style="transform:translate(0, 0px); opacity:1" fill="url(#sw-gradient-0)" d="M0,145L40,149.8C80,155,160,164,240,159.5C320,155,400,135,480,149.8C560,164,640,213,720,236.8C800,261,880,261,960,232C1040,203,1120,145,1200,125.7C1280,106,1360,126,1440,125.7C1520,126,1600,106,1680,116C1760,126,1840,164,1920,154.7C2000,145,2080,87,2160,96.7C2240,106,2320,184,2400,203C2480,222,2560,184,2640,145C2720,106,2800,68,2880,48.3C2960,29,3040,29,3120,62.8C3200,97,3280,164,3360,193.3C3440,222,3520,213,3600,217.5C3680,222,3760,242,3840,212.7C3920,184,4000,106,4080,101.5C4160,97,4240,164,4320,183.7C4400,203,4480,174,4560,159.5C4640,145,4720,145,4800,135.3C4880,126,4960,106,5040,106.3C5120,106,5200,126,5280,111.2C5360,97,5440,48,5520,67.7C5600,87,5680,174,5720,217.5L5760,261L5760,290L5720,290C5680,290,5600,290,5520,290C5440,290,5360,290,5280,290C5200,290,5120,290,5040,290C4960,290,4880,290,4800,290C4720,290,4640,290,4560,290C4480,290,4400,290,4320,290C4240,290,4160,290,4080,290C4000,290,3920,290,3840,290C3760,290,3680,290,3600,290C3520,290,3440,290,3360,290C3280,290,3200,290,3120,290C3040,290,2960,290,2880,290C2800,290,2720,290,2640,290C2560,290,2480,290,2400,290C2320,290,2240,290,2160,290C2080,290,2000,290,1920,290C1840,290,1760,290,1680,290C1600,290,1520,290,1440,290C1360,290,1280,290,1200,290C1120,290,1040,290,960,290C880,290,800,290,720,290C640,290,560,290,480,290C400,290,320,290,240,290C160,290,80,290,40,290L0,290Z"/><defs><linearGradient id="sw-gradient-1" x1="0" x2="0" y1="1" y2="0"><stop stop-color="rgba(58, 83, 255, 1)" offset="0%"/><stop stop-color="rgba(191.574, 199.623, 255, 1)" offset="100%"/></linearGradient></defs><path style="transform:translate(0, 50px); opacity:0.9" fill="url(#sw-gradient-1)" d="M0,0L40,19.3C80,39,160,77,240,106.3C320,135,400,155,480,145C560,135,640,97,720,87C800,77,880,97,960,116C1040,135,1120,155,1200,164.3C1280,174,1360,174,1440,169.2C1520,164,1600,155,1680,159.5C1760,164,1840,184,1920,183.7C2000,184,2080,164,2160,169.2C2240,174,2320,203,2400,207.8C2480,213,2560,193,2640,183.7C2720,174,2800,174,2880,178.8C2960,184,3040,193,3120,193.3C3200,193,3280,184,3360,193.3C3440,203,3520,232,3600,203C3680,174,3760,87,3840,43.5C3920,0,4000,0,4080,9.7C4160,19,4240,39,4320,77.3C4400,116,4480,174,4560,203C4640,232,4720,232,4800,193.3C4880,155,4960,77,5040,38.7C5120,0,5200,0,5280,43.5C5360,87,5440,174,5520,203C5600,232,5680,203,5720,188.5L5760,174L5760,290L5720,290C5680,290,5600,290,5520,290C5440,290,5360,290,5280,290C5200,290,5120,290,5040,290C4960,290,4880,290,4800,290C4720,290,4640,290,4560,290C4480,290,4400,290,4320,290C4240,290,4160,290,4080,290C4000,290,3920,290,3840,290C3760,290,3680,290,3600,290C3520,290,3440,290,3360,290C3280,290,3200,290,3120,290C3040,290,2960,290,2880,290C2800,290,2720,290,2640,290C2560,290,2480,290,2400,290C2320,290,2240,290,2160,290C2080,290,2000,290,1920,290C1840,290,1760,290,1680,290C1600,290,1520,290,1440,290C1360,290,1280,290,1200,290C1120,290,1040,290,960,290C880,290,800,290,720,290C640,290,560,290,480,290C400,290,320,290,240,290C160,290,80,290,40,290L0,290Z"/></svg>
\ No newline at end of file