From ee421b874c2e368b431054c2ee0fde3caf835f94 Mon Sep 17 00:00:00 2001
From: JBierenbroodspot <jim12.brood@gmail.com>
Date: Mon, 10 Jul 2023 00:02:57 +0200
Subject: [PATCH] Set background styling

---
 src/lib/styles/app.scss       | 34 ++++++++++++++++++++++++++++++++++
 src/lib/styles/variables.scss |  5 ++++-
 src/routes/+layout.svelte     |  8 ++++++++
 3 files changed, 46 insertions(+), 1 deletion(-)

diff --git a/src/lib/styles/app.scss b/src/lib/styles/app.scss
index ca963d7..0209937 100644
--- a/src/lib/styles/app.scss
+++ b/src/lib/styles/app.scss
@@ -1,6 +1,40 @@
 @use './variables.scss' as vars;
 
 body {
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0c1a31",endColorstr="#162439",GradientType=1);
+	background: -moz-linear-gradient(
+		236deg,
+		rgba(12, 26, 49, 1) 26%,
+		rgba(12, 26, 49, 1) 31%,
+		rgba(12, 26, 49, 1) 43%,
+		rgba(12, 26, 49, 1) 52%,
+		rgba(13, 27, 50, 1) 60%,
+		rgba(14, 28, 51, 1) 67%,
+		rgba(22, 36, 57, 1) 72%
+	);
+	background: -webkit-linear-gradient(
+		236deg,
+		rgba(12, 26, 49, 1) 26%,
+		rgba(12, 26, 49, 1) 31%,
+		rgba(12, 26, 49, 1) 43%,
+		rgba(12, 26, 49, 1) 52%,
+		rgba(13, 27, 50, 1) 60%,
+		rgba(14, 28, 51, 1) 67%,
+		rgba(22, 36, 57, 1) 72%
+	);
+	background: linear-gradient(
+		236deg,
+		rgba(12, 26, 49, 1) 26%,
+		rgba(12, 26, 49, 1) 31%,
+		rgba(12, 26, 49, 1) 43%,
+		rgba(12, 26, 49, 1) 52%,
+		rgba(13, 27, 50, 1) 60%,
+		rgba(14, 28, 51, 1) 67%,
+		rgba(22, 36, 57, 1) 72%
+	);
+	background-size: cover;
+	background-repeat: no-repeat;
 	background-color: vars.$bg-color-main;
+	min-height: 100vh;
 	color: vars.$text-color-main;
 }
diff --git a/src/lib/styles/variables.scss b/src/lib/styles/variables.scss
index 57c98b3..43d2db9 100644
--- a/src/lib/styles/variables.scss
+++ b/src/lib/styles/variables.scss
@@ -4,5 +4,8 @@ $bg-color-main: #0c1a31;
 $bg-color-main-d10: color.scale($bg-color-main, $lightness: -10%);
 $bg-color-main-d20: color.scale($bg-color-main, $lightness: -20%);
 $bg-color-main-d30: color.scale($bg-color-main, $lightness: -30%);
+$bg-color-main-l10: color.scale($bg-color-main, $lightness: 10%);
+$bg-color-main-l20: color.scale($bg-color-main, $lightness: 20%);
+$bg-color-main-l30: color.scale($bg-color-main, $lightness: 30%);
 
-$text-color-main: silver;
+$text-color-main: #c0c0c0;
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index e12a035..a40814f 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -5,3 +5,11 @@
 </main>
 
 <footer></footer>
+
+<style lang="scss">
+	$padding: #{8px 24px 8px 24px};
+	
+	main {
+		padding: $padding;
+	}
+</style>