✨ feat(home): Refactor header and remove search icon

The changes in this commit focus on refactoring the header component and removing the search icon. The main changes are:

- Replaced the `HeaderToolbar` component with a new `MainHeader` component.
- Removed the search icon and its associated code.
- Improved the layout and styling of the header section.

These changes aim to simplify the header structure and remove unnecessary elements, making the page more focused and visually appealing.

app/page.tsx

@@ -1,6 +1,3 @@
-import searchPic from '../public/search.svg';
-
-
 import mastodonPic from '../public/mastodon.svg';
 import githubPic from '../public/github.svg';
 import instagramPic from '../public/instagram.svg';
@@ -13,7 +10,8 @@ import Image from "next/image";
 import Link from "next/link";
 import AnimatedLink from '../components/animatedLink';
 import BlogArea from "../components/blogpost";
-import HeaderToolbar from "../components/header/toolbar";
+
+import MainHeader from "@/components/header/main";
 
 // Mock data for blog posts
 const blogposts = [
@@ -50,34 +48,7 @@ const blogposts = [
 export default function Home() {
   return (
     <div className="text-xl 2xl:mx-64 xl:mx-32 md:mx-6">
-      <header className="flex flex-col">
-        <div className="flex flex-row mt-12 mb-22">
-          <ul className="w-full flex flex-row justify-between items-baseline list-none">
-            <li className="text-4xl">
-              <AnimatedLink href="https://blog.aderk.tech/en">
-                aderk.tech
-              </AnimatedLink>
-            </li>
-
-            <li className="text-6xl flex items-center justify-center filter brightness-0 invert">
-              <Link href="#">
-                <Image
-                  src={searchPic}
-                  alt="search"
-                  width={32}
-                  height={32}
-                />
-              </Link>
-            </li>
-          </ul>
-        </div>
-        <div className="text-2xl mb-20">
-          <p className="leading-10">
-            Hello. I am is a programmer, hacker, and gamer. Love comics, coding, read books. There I am posting articles about science and another staff, that’s im like.
-          </p>
-        </div>
-        <HeaderToolbar />
-      </header>
+      <MainHeader />
 
       <main>
         <BlogArea blogposts={blogposts} />
@@ -132,13 +103,13 @@ export default function Home() {
           </li>
         </ul>
         <ul className="list-none m-4">
-          <li className="text-2xl mb-3"><h3 className='inline'>Games</h3><Image src={gamePic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert"/></li>
+          <li className="text-2xl mb-3"><h3 className='inline'>Games</h3><Image src={gamePic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert" /></li>
           <li className="text-xl">
             <AnimatedLink href="#">Robot Fire</AnimatedLink>
           </li>
         </ul>
         <ul className="list-none m-4">
-          <li className="text-2xl mb-3"><h3 className='inline'>Other Projects</h3><Image src={projectPic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert"/></li>
+          <li className="text-2xl mb-3"><h3 className='inline'>Other Projects</h3><Image src={projectPic} alt="lang" width={24} height={24} className="ml-2 inline filter brightness-0 invert" /></li>
           <li className="text-xl">
             <AnimatedLink href="#">cloudberrygames</AnimatedLink>
           </li>