From 83a7970ccaafcd096d87fd52b65b9bf866adb9c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20H=C3=B6lting?=
 <87192362+moritz-hoelting@users.noreply.github.com>
Date: Wed, 3 Apr 2024 13:57:10 +0200
Subject: [PATCH] Add custom CSS file for styling hero elements

---
 astro.config.mjs     | 1 +
 src/styles/style.css | 8 ++++++++
 2 files changed, 9 insertions(+)
 create mode 100644 src/styles/style.css

diff --git a/astro.config.mjs b/astro.config.mjs
index 3c70395..a285731 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -32,6 +32,7 @@ export default defineConfig({
 			editLink: {
 				baseUrl: 'https://github.com/moritz-hoelting/shulkerscript-webpage/edit/main',
 			},
+			customCss: ['./src/styles/style.css'],
 			plugins: [starlightLinksValidator({
 				errorOnFallbackPages: false,
 			})],
diff --git a/src/styles/style.css b/src/styles/style.css
new file mode 100644
index 0000000..1de03bc
--- /dev/null
+++ b/src/styles/style.css
@@ -0,0 +1,8 @@
+:root {
+    --purple-hsl: 255, 60%, 60%;
+    --overlay-blurple: hsla(var(--purple-hsl), .2);
+}
+
+[data-has-hero] .page {
+    background: linear-gradient(215deg,var(--overlay-blurple),transparent 40%),radial-gradient(var(--overlay-blurple),transparent 40%) no-repeat -30vw -20vh / 105vw 200vh,radial-gradient(var(--overlay-blurple),transparent 65%) no-repeat 50% calc(100% + 20rem) / 60rem 30rem
+}
\ No newline at end of file