From 75057a2a8fec51b8dbf221f3121f3727de0680c1 Mon Sep 17 00:00:00 2001
From: Aylur <k.demeter@protonmail.com>
Date: Sun, 22 Sep 2024 00:31:39 +0000
Subject: docs: add icon

---
 docs/index.md               |  25 +++++++++++++----
 docs/public/favicon.ico     | Bin 270398 -> 0 bytes
 docs/public/front-image.png | Bin 138489 -> 0 bytes
 docs/public/icon.svg        |  66 ++++++++++++++++++++++++++++++++++++++++++++
 docs/vitepress.config.ts    |  10 +++++--
 docs/vitepress.theme.css    |   2 +-
 6 files changed, 93 insertions(+), 10 deletions(-)
 delete mode 100644 docs/public/favicon.ico
 delete mode 100644 docs/public/front-image.png
 create mode 100644 docs/public/icon.svg

diff --git a/docs/index.md b/docs/index.md
index 2b80d9e..df4fea5 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -4,9 +4,9 @@ pageClass: home-page
 
 hero:
   name: "Astal"
-  text: "Library and Framework for building Desktop Shells"
-  tagline: "The best way to make <i>beautiful</i> <b>and</b> <i>functional</i> wayland widgets!"
-  image: /front-image.png
+  text: "Create Beautiful Widgets With Ease"
+  tagline: "The Framework to Craft Desktop Shells and <i>beautiful</i> <i>functional</i> Wayland Widgets with GTK!"
+  image: /icon.svg
   actions:
     - theme: brand
       text: What is Astal?
@@ -35,13 +35,14 @@ import Showcases from './showcases/Showcases.vue'
 
 <Showcases />
 
-<!--TODO: add feature icons-->
 <!--TODO: add icons for buttons https://github.com/vuejs/vitepress/pull/3795-->
 
 <style>
 :root {
   --vp-home-hero-name-color: transparent;
-  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--vp-c-brand-1), var(--vp-c-brand-3));
+  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--vp-c-purple-3), var(--vp-c-brand-3));
+
+  --vp-home-hero-image-background-image: linear-gradient(-45deg, var(--vp-c-purple-3), var(--vp-c-brand-3));
 }
 
 :root {
@@ -62,7 +63,7 @@ import Showcases from './showcases/Showcases.vue'
     font-weight: bold;
   }
 
-  .VPNavBar {
+  .VPNavBar:not(.top) {
     background-color: transparent !important;
     -webkit-backdrop-filter: blur(16px);
     backdrop-filter: blur(16px);
@@ -72,4 +73,16 @@ import Showcases from './showcases/Showcases.vue'
     }
   }
 }
+
+@media (min-width: 640px) {
+  :root {
+    --vp-home-hero-image-filter: blur(46px);
+  }
+}
+
+@media (min-width: 960px) {
+  :root {
+    --vp-home-hero-image-filter: blur(58px);
+  }
+}
 </style>
diff --git a/docs/public/favicon.ico b/docs/public/favicon.ico
deleted file mode 100644
index fc02738..0000000
Binary files a/docs/public/favicon.ico and /dev/null differ
diff --git a/docs/public/front-image.png b/docs/public/front-image.png
deleted file mode 100644
index 0fbfcca..0000000
Binary files a/docs/public/front-image.png and /dev/null differ
diff --git a/docs/public/icon.svg b/docs/public/icon.svg
new file mode 100644
index 0000000..50140b4
--- /dev/null
+++ b/docs/public/icon.svg
@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="paint0_linear_155_68" x1="16.5124" y1="53.7019" x2="19.6099" y2="53.7019" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#EDEDED"/>
+      <stop offset="0.4575" stop-color="#D9D9D9"/>
+    </linearGradient>
+    <linearGradient id="paint1_linear_155_68" x1="46.2486" y1="53.7019" x2="49.3461" y2="53.7019" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#EDEDED"/>
+      <stop offset="0.4575" stop-color="#D9D9D9"/>
+    </linearGradient>
+    <linearGradient id="paint2_linear_155_68" x1="7.63128" y1="51.6043" x2="10.9639" y2="51.6043" gradientUnits="userSpaceOnUse">
+      <stop stop-color="white" stop-opacity="0"/>
+      <stop offset="0.5" stop-color="white"/>
+      <stop offset="1" stop-color="white" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="paint3_linear_155_68" x1="0.411461" y1="9.90922" x2="3.74407" y2="9.90922" gradientUnits="userSpaceOnUse">
+      <stop stop-color="white" stop-opacity="0"/>
+      <stop offset="0.5" stop-color="white"/>
+      <stop offset="1" stop-color="white" stop-opacity="0"/>
+    </linearGradient>
+    <radialGradient id="paint4_radial_155_68" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(32 13.1629) rotate(180) scale(24.7802 3.0436)">
+      <stop stop-color="#1C50B6"/>
+      <stop offset="1" stop-color="#1C50B6" stop-opacity="0"/>
+    </radialGradient>
+    <radialGradient id="paint5_radial_155_68" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(32 46.5099) rotate(180) scale(24.7802 2.59749)">
+      <stop stop-color="#1C50B6"/>
+      <stop offset="1" stop-color="#1C50B6" stop-opacity="0"/>
+    </radialGradient>
+    <radialGradient id="paint6_radial_155_68" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(12.5891 9.18176) rotate(54.9832) scale(3.12674)">
+      <stop stop-color="#FFDE85"/>
+      <stop offset="1" stop-color="#FEC767"/>
+    </radialGradient>
+    <radialGradient id="paint7_radial_155_68" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(49.6169 9.18176) rotate(54.9832) scale(3.12674)">
+      <stop stop-color="#FFDE85"/>
+      <stop offset="1" stop-color="#FEC767"/>
+    </radialGradient>
+    <radialGradient id="paint8_radial_155_68" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(30.9016 9.84875) rotate(29.9036) scale(2.87874 2.64733)">
+      <stop stop-color="#FFDE85"/>
+      <stop offset="1" stop-color="#FEC767"/>
+    </radialGradient>
+  </defs>
+  <rect x="13.4149" y="44.4093" width="6.19505" height="14.8681" rx="2.47802" fill="url(#paint0_linear_155_68)"/>
+  <rect x="43.1511" y="44.4093" width="6.19505" height="14.8681" rx="2.47802" fill="url(#paint1_linear_155_68)"/>
+  <path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M13.4149 53.4426V49.3654H19.6099V53.4426H13.4149Z" fill="black"/>
+  <path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M43.1511 53.4426V49.3654H49.3461V53.4426H43.1511Z" fill="black"/>
+  <rect x="7.21982" y="7.23901" width="49.5604" height="44.6043" rx="4.95604" fill="#D4D4D4"/>
+  <rect opacity="0.8" x="7.21982" y="41.6951" width="12.7351" height="10.1483" rx="4.95604" fill="url(#paint2_linear_155_68)"/>
+  <rect opacity="0.8" width="12.7351" height="10.1483" rx="4.95604" transform="matrix(-1, 0, 0, 1, 56.774200439453125, 41.695098876953125)" fill="url(#paint3_linear_155_68)"/>
+  <rect x="7.21982" y="6" width="49.5604" height="43.3653" rx="4.95604" fill="white"/>
+  <rect opacity="0.4" x="7.21982" y="9.81702" width="49.5604" height="6.69174" rx="2.47802" fill="url(#paint4_radial_155_68)"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M10.5693 11.2766C10.5693 11.279 10.5693 11.2815 10.5693 11.2839C10.5693 11.2863 10.5693 11.2888 10.5693 11.2912V11.3582H10.5705C10.6097 12.5602 11.5965 13.5226 12.808 13.5226H51.192C52.4035 13.5226 53.3903 12.5602 53.4295 11.3582H53.4307V10.593H53.3221C53.0309 9.6947 52.1873 9.04517 51.192 9.04517H12.808C11.8127 9.04517 10.9691 9.6947 10.6779 10.593H10.5693V11.2766Z" fill="#529DF2"/>
+  <rect x="10.5693" y="8.22339" width="42.8614" height="4.47747" rx="2.23873" fill="#68ACFA"/>
+  <rect opacity="0.5" x="7.21982" y="43.6544" width="49.5604" height="5.71091" rx="2.47802" fill="url(#paint5_radial_155_68)"/>
+  <rect x="10.5693" y="40.5872" width="42.8614" height="7.18783" rx="2.47802" fill="#529DF2"/>
+  <rect x="10.5693" y="39.3481" width="42.8614" height="7.18783" rx="2.47802" fill="#68ACFA"/>
+  <rect x="17.2053" y="36.561" width="8.21114" height="8.21114" rx="2.47802" fill="#EBB75F"/>
+  <rect x="17.2053" y="35.8337" width="8.21114" height="8.21114" rx="2.47802" fill="#FED667"/>
+  <rect x="27.8944" y="36.561" width="8.21114" height="8.21114" rx="2.47802" fill="#EBB75F"/>
+  <rect x="27.8944" y="35.8337" width="8.21114" height="8.21114" rx="2.47802" fill="#FED667"/>
+  <rect x="38.5836" y="36.561" width="8.21114" height="8.21114" rx="2.47802" fill="#EBB75F"/>
+  <rect x="38.5836" y="35.8337" width="8.21114" height="8.21114" rx="2.47802" fill="#FED667"/>
+  <circle cx="13.3788" cy="10.4621" r="1.28037" fill="url(#paint6_radial_155_68)"/>
+  <circle cx="50.4066" cy="10.4621" r="1.28037" fill="url(#paint7_radial_155_68)"/>
+  <rect x="30.2191" y="9.84875" width="3.5617" height="1.43518" rx="0.717588" fill="url(#paint8_radial_155_68)"/>
+</svg>
\ No newline at end of file
diff --git a/docs/vitepress.config.ts b/docs/vitepress.config.ts
index 455020f..aa6aae2 100644
--- a/docs/vitepress.config.ts
+++ b/docs/vitepress.config.ts
@@ -16,12 +16,16 @@ export default defineConfig({
     ignoreDeadLinks: true, // FIXME:
 
     head: [
-        ["link", { rel: "icon", href: "/astal/favicon.ico" }],
+        ["link", { rel: "icon", href: "/astal/icon.svg" }],
     ],
 
     themeConfig: {
-        // logo: "",
-        //
+        logo: "/icon.svg",
+
+        footer: {
+            message: 'Released under the LGPL v2.1 License',
+            copyright: 'Logo is created by VDawg'
+        },
 
         nav: [{
             text: "0.1.0",
diff --git a/docs/vitepress.theme.css b/docs/vitepress.theme.css
index 64d85a0..7bd694f 100644
--- a/docs/vitepress.theme.css
+++ b/docs/vitepress.theme.css
@@ -3,7 +3,7 @@
  */
 
 .VPNavBar .VPNavBarTitle span {
-    font-size: 1.4em;
+    font-size: 1.2em;
     font-weight: bold;
     background: linear-gradient(120deg, var(--vp-c-brand-3), var(--vp-c-brand-1));
     -webkit-background-clip: text;
-- 
cgit v1.2.3