From 3d628f8f7a50504d684ffbc699420eb23f87398b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Orhun=20Parmaks=C4=B1z?= <orhunparmaksiz@gmail.com>
Date: Sat, 17 Aug 2024 22:54:55 +0200
Subject: [PATCH] chore(website): add demo image before the hero

---
 website/astro.config.mjs            |  1 +
 website/src/components/Footer.astro |  1 +
 website/src/components/Hero.astro   | 16 ++++++++++++++++
 website/src/content/docs/index.mdx  |  8 +-------
 website/src/styles/custom.css       |  2 +-
 5 files changed, 20 insertions(+), 8 deletions(-)
 create mode 100644 website/src/components/Hero.astro

diff --git a/website/astro.config.mjs b/website/astro.config.mjs
index 608fd88..c51f81b 100644
--- a/website/astro.config.mjs
+++ b/website/astro.config.mjs
@@ -22,6 +22,7 @@ export default defineConfig({
       },
       components: {
         Header: "./src/components/Header.astro",
+        Hero: "./src/components/Hero.astro",
         Footer: "./src/components/Footer.astro",
       },
       customCss: [
diff --git a/website/src/components/Footer.astro b/website/src/components/Footer.astro
index cb009bd..71de21d 100644
--- a/website/src/components/Footer.astro
+++ b/website/src/components/Footer.astro
@@ -8,6 +8,7 @@ const isHomepage = Astro.props.slug === '';
 
 {
   isHomepage ? (
+    <hr style="border: 0; border-top: 1px solid var(--sl-color-gray-5); width: 50%; margin: 20px auto;">
     <footer class="footer">
       <div class="container">
         <p>
diff --git a/website/src/components/Hero.astro b/website/src/components/Hero.astro
new file mode 100644
index 0000000..45cdd92
--- /dev/null
+++ b/website/src/components/Hero.astro
@@ -0,0 +1,16 @@
+---
+import type { Props } from '@astrojs/starlight/props';
+import Default from '@astrojs/starlight/components/Hero.astro';
+
+import demoImage from '../../src/assets/binsider-general-tab.png';
+---
+
+<div style="text-align: center;">
+  <img
+    src={demoImage.src}
+    style="margin: 0;"
+    alt="demo"
+  />
+</div>
+
+<Default {...Astro.props}><slot /></Default>
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 20323a2..160cdb5 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -17,12 +17,6 @@ hero:
       link: /about/intro/
       icon: open-book
     - text: Get source
-      link: 'https://github.com/orhun/binsider'
+      link: "https://github.com/orhun/binsider"
       icon: github
 ---
-<img
-  src="src/assets/binsider-general-tab.png"
-  alt="Binsider logo"
-  style="margin: 0 auto; display:block;"
-/>
-;
diff --git a/website/src/styles/custom.css b/website/src/styles/custom.css
index fe981d3..a986018 100644
--- a/website/src/styles/custom.css
+++ b/website/src/styles/custom.css
@@ -35,7 +35,7 @@
 }
 
 .hero .copy {
-  align-items: center;
+  display: none;
 }
 
 .hero .actions {