main 🧊 add logo

Author: debabin

packages/docs/app/.vitepress/config.mts

@@ -74,6 +74,10 @@ export default async () => {
         label: 'English',
         lang: 'en',
         themeConfig: {
+          logo: {
+            src: '/logo.svg',
+            alt: 'reactuse'
+          },
           editLink: {
             pattern: ({ filePath, params }) => {
               if (filePath.includes('hooks') && params?.name) {

packages/docs/app/.vitepress/theme/global.css

@@ -4,15 +4,18 @@
 :root {
   --vp-home-hero-name-color: transparent;
   --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #61dafb, #205dae);
-
+  --vp-home-hero-image-background-image: linear-gradient(130deg, #006EFF, #00C8FF);
+  --vp-home-hero-image-filter: blur(40px) opacity(0.35);
+  
   --vp-c-bg: #ffffff;
 
-  --vp-c-brand-1: #52b6d2;
+  --vp-c-brand-1: #087EA4;
   --vp-c-brand-2: #4ca8c6;
-  --vp-c-brand-3: #5fc6e9;
+  --vp-c-brand-3: #52BDE9;
 }
 
 .dark {
+  --vp-c-brand-1: #58C4DC;
   --vp-c-bg: #181818;
   --vp-c-bg-soft: #1f1f1f;
   --vp-c-bg-alt: #1d1c1c;

packages/docs/app/index.md

@@ -6,6 +6,9 @@ hero:
   name: reactuse
   text: the largest and most useful hook library
   tagline: Improve your react applications with our library 📦 designed for comfort and speed
+  image:
+    src: /logo.svg
+    alt: reactuse
   actions:
     - theme: brand
       text: Get Started