Hero images

dphfox · Aug 28, 2024 · e4ea5c0 · e4ea5c0
1 parent c4dd4b0
commit e4ea5c0
Show file tree

Hide file tree

Showing 9 changed files with 44 additions and 12 deletions.
diff --git a/docs/api-reference/index.md b/docs/api-reference/index.md
@@ -1,5 +1,6 @@
 ---
 title: API Reference
+hero_img: ../heroes/api-reference.jpg
 ---
 
 # API Reference

diff --git a/docs/assets/heroes/api-reference.jpg b/docs/assets/heroes/api-reference.jpg
diff --git a/docs/assets/overrides/main.html b/docs/assets/overrides/main.html
@@ -25,3 +25,10 @@
 		</style>
 	{% endif %}
 {% endblock %}
+
+{% block hero %}
+	{% if page.meta and page.meta.hero_img %}
+		<div class="fusiondoc-hero" style="--hero-img: url({{ page.meta.hero_img }});"></div>
+	{% endif %}
+	{{ super() }}
+{% endblock %}
diff --git a/docs/assets/theme/admonition.css b/docs/assets/theme/admonition.css
@@ -8,7 +8,7 @@
 	border-width: 0.1rem !important;
 	box-shadow: 
 		0 0.25em 1.5em -0.75em var(--admonition-color),
-		inset 0 1em 2em -2em var(--admonition-color)
+		inset 0 1em 2em -2.25em var(--admonition-color)
 		!important;
 }
 

diff --git a/docs/assets/theme/page.css b/docs/assets/theme/page.css
@@ -11,7 +11,7 @@
 .md-header,
 .md-tabs {
 	color: var(--md-default-fg-color);
-	background-color: var(--md-default-bg-color);
+	background-color: transparent;
 }
 
 .md-header[data-md-state=shadow] {
@@ -307,4 +307,30 @@
 
 #fusiondoc-home {
 	opacity: 0;
+}
+
+
+.fusiondoc-hero {
+	display: block;
+	position: relative;
+	width: 100%;
+	margin-top: -5em;
+	margin-bottom: -5em;
+	height: 10em;
+	max-height: 30svh;
+}
+
+.fusiondoc-hero::before {
+	content: " ";
+	display: block;
+	position: absolute;
+	inset: 0;
+	bottom: -20em;
+	z-index: -1;
+	opacity: 0.2;
+	background: radial-gradient(farthest-corner at 50% 0%, transparent, var(--fusiondoc-bg-1)), var(--hero-img);
+	background-position: center;
+	background-size: cover;
+	box-shadow: inset 0 -15em 15em -1em var(--fusiondoc-bg-1);
+	filter: blur(0.5em);
 }
diff --git a/docs/examples/index.md b/docs/examples/index.md
@@ -1,5 +1,5 @@
 ---
-title: Examples
+  hero_img: ../../examples/place-thumbnails/Fusion-Obby.jpg
 ---
 
 # Examples

diff --git a/docs/index.md b/docs/index.md
@@ -5,12 +5,6 @@
     - navigation
 ---
 
-
-
-
-
-
-
 <div id="fusiondoc-home" markdown>
 <section id="fusiondoc-home-main">
 <section id="fusiondoc-home-main-inner">

diff --git a/docs/tutorials/index.md b/docs/tutorials/index.md
@@ -1,3 +1,7 @@
+---
+  hero_img: ../home/Hero-Light.svg
+---
+
 Welcome to the Fusion tutorial section! Here, you'll learn how to build great
 things with Fusion, even if you're a complete newcomer to the library.
 

diff --git a/mkdocs.yml b/mkdocs.yml
@@ -54,7 +54,7 @@ extra_javascript:
 nav:
   - Home: index.md
   - Tutorials:
-    - Get Started: tutorials/index.md
+    - Tutorials: tutorials/index.md
     - Installing Fusion: tutorials/get-started/installing-fusion.md
     - Developer Tools: tutorials/get-started/developer-tools.md
     - Getting Help: tutorials/get-started/getting-help.md
@@ -88,7 +88,7 @@ nav:
       - Optimisation: tutorials/best-practices/optimisation.md
 
   - Examples:
-    - Home: examples/index.md
+    - Examples: examples/index.md
     - Cookbook:
       - examples/cookbook/index.md
       - Player List: examples/cookbook/player-list.md
@@ -99,7 +99,7 @@ nav:
       - Loading Spinner: examples/cookbook/loading-spinner.md
       - Drag & Drop: examples/cookbook/drag-and-drop.md
   - API Reference:
-    - api-reference/index.md
+    - API Reference: api-reference/index.md
     - General:
       - Errors: api-reference/general/errors.md
       - Types: