From 88db80859abe0a1aca04dd88107ea53384537ee3 Mon Sep 17 00:00:00 2001
From: DevvSakib <devvsakib@gmail.com>
Date: Mon, 27 Feb 2023 00:16:37 +0600
Subject: [PATCH] v1.0.1 released

---
 index.html                                   |  2 +-
 src/App.jsx                                  |  2 +-
 src/components/BGShape.jsx                   | 22 ++++++
 src/components/Contributors/contributors.jsx | 71 +++++++++++---------
 src/components/Doc/DocItem.jsx               |  2 +-
 src/components/Error/ErrorCard.jsx           |  2 +-
 src/components/Header/Header.jsx             | 50 ++++++++++++--
 src/main.jsx                                 |  4 +-
 8 files changed, 111 insertions(+), 44 deletions(-)
 create mode 100644 src/components/BGShape.jsx

diff --git a/index.html b/index.html
index 9c0e01b..2349d65 100644
--- a/index.html
+++ b/index.html
@@ -5,7 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>GitHub Error Solve - Opensource Projects</title>
-    <link rel="shortcut icon" href="public/assets/logo.png" type="image/x-icon">
+    <link rel="shortcut icon" href="/assets/logo.png" type="image/x-icon">
     <link rel="stylesheet" href="./dist/output.css" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
diff --git a/src/App.jsx b/src/App.jsx
index db5ee88..dbfa4ba 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -3,6 +3,7 @@ import "./index.css";
 import Error from "./components/Error/Error";
 import SearchInput from "./components/Search/SearchInput";
 import Layout from "./components/Layout/Layout";
+import BGShape from "./components/BGShape";
 
 function App() {
   const [search, setSearch] = useState('')
@@ -21,7 +22,6 @@ function App() {
           type={type}
         />
       </Layout>
-      
     </>
   );
 }
diff --git a/src/components/BGShape.jsx b/src/components/BGShape.jsx
new file mode 100644
index 0000000..e852cf8
--- /dev/null
+++ b/src/components/BGShape.jsx
@@ -0,0 +1,22 @@
+import React from 'react'
+
+const BGShape = () => {
+  return (
+    <div className='-z-[99999] fixed top-0 left-0 w-full h-full'>
+      {/* <div className='-z-[999] absolute top-0 left-0 w-full h-full bg-[#44ff15]/20 backdrop-blur-[5px] rounded-lg'></div>*/}
+      <div className='-z-[99999999999999] absolute -top-[70%] md:-top-[90%] -left-[50%] md:left-0 w-[800px] md:w-full h-[500px] rounded-full bg-[#16f8d2f3]/30 blur-[100px]'></div>
+      
+      <div className=' absolute right-[10%] md:right-[40%] top-[10%] rotate-45 w-[200px] h-[500px] bg-[#1aabff]/20 blur-[150px] rounded-lg'></div>
+      <div className=' absolute right-[20%] md:right-[40%] top-[30%] md:top-[10%] rotate-45 w-[200px] h-[500px] bg-[#ff22ed]/10 blur-[150px]  rounded-lg'></div>
+      
+      <div className='absolute  right-[70%] top-[30%] md:top-[10%] -rotate-90 w-[300px] h-[500px] bg-[#1aabff]/20 blur-[90px] rounded-lg'></div>
+      
+      <div className='absolute right-[40%] top-[30%] md:top-[10%] rotate-45 w-[200px] h-[500px] bg-[#ff22ed]/20 blur-[100px]  rounded-lg'></div>
+      
+      <div className='absolute  right-[0%] top-[70%] md:top-[20%] rotate-45 transform-gpu w-[200px] h-[500px] bg-[#44ff15]/10 blur-[90px] rounded-lg'></div>
+      <div className='absolute  right-[0%] top-[70%] md:top-[20%] rotate-45 transform-gpu w-[400px] h-[500px] bg-[#44ff15]/5 blur-[90px] rounded-lg'></div>
+    </div>
+  )
+}
+
+export default BGShape
\ No newline at end of file
diff --git a/src/components/Contributors/contributors.jsx b/src/components/Contributors/contributors.jsx
index 82c351e..76be958 100644
--- a/src/components/Contributors/contributors.jsx
+++ b/src/components/Contributors/contributors.jsx
@@ -4,7 +4,6 @@ import Layout from "../../components/Layout/Layout";
 import "./css/index.css";
 
 function Contribute() {
-  const userURL = "https://api.github.com/users/";
   const url = "https://api.github.com/repos/devvsakib/github-error-solve/contributors";
     
 
@@ -56,41 +55,47 @@ function Contribute() {
         {
           // User filtered by CONTRIBUTIONS number, contribute more to jump in first place
           
-          loading ? (
-            data.map((user) => (
-              <div key={user.login}
-              id="container"
-              className={`py-4 mb-4 col-span-12 md:col-span-6 xl:col-span-4 md:px-6 border-l-4 rounded-lg bg-dark-secondary flex flex-col mt-8 items-center mx-auto gap-2 px-3 border-[#${changeColor()}] hover:border-primary hover:text-primary`}
-              >
-                <img className="pfp mb-8 skeleton" src={user.avatar_url} />
-                <h1 className="text-center -mb-10 font-semibold uppercase">
-                  {user.login}{" "}
-                  <small className="text-violet-400 container:hover:text-white">
-                    {user.contributions}
-                  </small>
-                </h1>
-                <div className="links text-sm">
-                  <a className="spf-link" href={user.html_url}>
-                    GitHub
-                  </a>
-                  {user.twitter_username && <a className="spf-link" href={`https://twitter.com/${user.twitter_username}`}>
-                    Twitter
-                  </a>}
-                  {/* spf-link : abbreviation of (specific-link) for css */}
+          data && data.length !== 0 ? (
+            loading ? (
+              data.map((user) => (
+                <div key={user.login}
+                id="container"
+                className={`py-4 mb-4 col-span-12 md:col-span-6 xl:col-span-4 md:px-6 border-l-4 rounded-lg bg-dark-secondary flex flex-col mt-8 items-center mx-auto gap-2 px-3 border-[#${changeColor()}] hover:border-primary hover:text-primary`}
+                >
+                  <img className="pfp mb-8 skeleton" src={user.avatar_url} />
+                  <h1 className="text-center -mb-10 font-semibold uppercase">
+                    {user.login}{" "}
+                    <small className="text-violet-400 container:hover:text-white">
+                      {user.contributions}
+                    </small>
+                  </h1>
+                  <div className="links text-sm">
+                    <a className="spf-link" href={user.html_url}>
+                      GitHub
+                    </a>
+                    {user.twitter_username && <a className="spf-link" href={`https://twitter.com/${user.twitter_username}`}>
+                      Twitter
+                    </a>}
+                    {/* spf-link : abbreviation of (specific-link) for css */}
+                  </div>
                 </div>
+              ))
+            ) : (
+              <div className="translate-y-[4rem]">
+                <img
+                  src="/assets/run.gif"
+                  className="w-1/2 mx-auto"
+                  alt="Running.gif"
+                />
+                <h1 className="text-center md:text-2xl text-white">
+                  Contributors coming❤️‍🔥...
+                </h1>
               </div>
-            ))
+            )
           ) : (
-            <div className="translate-y-[4rem]">
-              <img
-                src="/assets/run.gif"
-                className="w-1/2 mx-auto"
-                alt="Running.gif"
-              />
-              <h1 className="text-center md:text-2xl text-white">
-                Contributors coming❤️‍🔥...
-              </h1>
-            </div>
+            <h1 className="text-center md:text-2xl text-white">
+              GitHub API Limit Exceeded
+            </h1>
           )
         }
       </section>
diff --git a/src/components/Doc/DocItem.jsx b/src/components/Doc/DocItem.jsx
index 567788e..35fdcf1 100644
--- a/src/components/Doc/DocItem.jsx
+++ b/src/components/Doc/DocItem.jsx
@@ -10,7 +10,7 @@ const DocItem = ({ title, content }) => {
   }
   
   return (
-    <div className={`p-4 rounded shadow-lg shadow-[#118d7c62] bg-[#${changeColor()}] backdrop-blur-sm`}>
+    <div className={`p-4 rounded shadow-lg shadow-[#118d7c22] bg-white/5 backdrop-blur-[10px]`}>
       <h6 className='font-semibold text-white text-opacity-80 mb-2'>{title}</h6>
       <p className='text-sm text-white leading-tight'>{content}</p>
     </div>
diff --git a/src/components/Error/ErrorCard.jsx b/src/components/Error/ErrorCard.jsx
index 07ef933..88590b7 100644
--- a/src/components/Error/ErrorCard.jsx
+++ b/src/components/Error/ErrorCard.jsx
@@ -32,7 +32,7 @@ function ErrorCard({ error }) {
   return (
     <div
     id="main-div"
-      className={`py-4 mb-4 col-span-12 md:col-span-6 xl:col-span-4 px-2 md:px-6 border-l-4 rounded-lg   items-start bg-dark-secondary flex flex-col hover:scale-105 duration-300 ${item === "add"
+      className={`py-4 mb-4 col-span-12 md:col-span-6 xl:col-span-4 px-2 md:px-6 border-l-4 rounded-lg   items-start bg-white/5 backdrop-blur-[10px] flex flex-col hover:scale-105 duration-300 ${item === "add"
           ? "border-[#4024e0]"
           : item === "commit"
             ? "border-[#1a5ba5]"
diff --git a/src/components/Header/Header.jsx b/src/components/Header/Header.jsx
index 52b63e3..e4123b5 100644
--- a/src/components/Header/Header.jsx
+++ b/src/components/Header/Header.jsx
@@ -1,8 +1,31 @@
-import { MdConstruction, MdInsertDriveFile } from "react-icons/md";
-import {AiFillGithub} from "react-icons/ai";
+import { MdPeople, MdInsertDriveFile } from "react-icons/md";
+import { AiFillGithub } from "react-icons/ai";
 import { Link } from "react-router-dom";
 
 function Header({ notice }) {
+  const navLink = [
+    {
+      name: 'Home',
+      link: '/',
+      icon: ''
+    },
+    {
+      name: 'Doc',
+      link: '/doc',
+      icon: <MdInsertDriveFile size='1rem'/>
+    },
+    {
+      name: 'Contributors',
+      link: '/Contributors',
+      icon: <MdPeople size='1.25rem'/>
+    },
+    {
+      name: '',
+      link: 'https://github.com/devvsakib/github-error-solve',
+      icon: <AiFillGithub size='1.25rem' />
+    }
+  ]
+
   return (
     <header className="p-4 bg-dark-secondary sticky top-0 z-50">
       <div className="w-full md:w-5/6 mx-auto flex flex-col md:flex-row justify-between items-center">
@@ -12,15 +35,30 @@ function Header({ notice }) {
         <Link to={'/'}>
           <img src="/assets/logo.png" className="w-36" alt="GES" />
         </Link>
-        <div className="flex mt-2 md:mt-0 items-center gap-3 text-sm">
-          <MdConstruction className="text-lg" />
+        <div className="flex mt-2 md:mt-0 items-center gap-7 text-sm">
+
+          {
+            navLink.map((link, index) => {
+              return (
+                link.name == "" ? (<a target='_blank' href={link.link}>{link.icon}</a>
+                ) : link.name == "Doc" ? (<Link className="flex items-center gap-1" to={link.link}>{link.icon}{link.name}</Link>
+                ) : link.name == "Contributors" ? (<Link className="flex items-center gap-1" to={link.link}>{link.icon}{link.name}</Link>
+                ) : link.name == "Home" ? (<Link className="flex items-center gap-1" to={link.link}>{link.icon}{link.name}</Link>
+                ) : null
+              )
+            })
+
+          }
+
+
+          {/* <MdConstruction className="text-lg" />
           <h6>Under Construction</h6>
-          <MdInsertDriveFile className="text-lg" />
+
           <Link to={'/doc'}>Doc</Link>
 
           <Link to={'/Contributors'}>Contributors</Link>
 
-          <a target='_blank' href="https://github.com/devvsakib/github-error-solve"><AiFillGithub size='1.25rem'/></a>
+          <a target='_blank' href="https://github.com/devvsakib/github-error-solve"><AiFillGithub size='1.25rem'/></a> */}
 
 
         </div>
diff --git a/src/main.jsx b/src/main.jsx
index aa8696e..d6723ef 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -7,6 +7,7 @@ import {
 } from "react-router-dom";
 import Doc from "./components/Doc/Doc";
 import Contributors from "./components/Contributors/contributors";
+import BGShape from "./components/BGShape";
 /* Creating a router object that is used to render the correct component based on the url. */
 const router = createBrowserRouter(
   [
@@ -20,7 +21,7 @@ const router = createBrowserRouter(
     },
     {
       path: '/Contributors',
-      element: <Contributors/>
+      element: <Contributors />
     }
 
   ]
@@ -28,6 +29,7 @@ const router = createBrowserRouter(
 
 ReactDOM.createRoot(document.getElementById("root")).render(
   <React.StrictMode>
+    <BGShape />
     <RouterProvider router={router} />
   </React.StrictMode>
 );
\ No newline at end of file