💄 style: create signin button and refine the navbar layouts

shared/widgets/navbar/components/Navbar.tsx

@@ -1,18 +1,24 @@
 "use client";
 import Image from "next/image";
 import NavigationLink from "./NavigationLink";
+import SignIn from "./SignIn";
 
 const Navbar = () => {
   return (
-    <div className="absolute z-10 top-0 w-full h-16 flex items-center">
-      <Image
-        src="/logo/astofo-long.png"
-        alt="Astofo Logo"
-        width={120}
-        height={0}
-        draggable={false}
-      />
-      <NavigationLink />
+    <div className="absolute z-10 top-0 w-full h-16 flex items-center justify-between">
+      <div className="flex items-center">
+        <Image
+          src="/logo/astofo-long.png"
+          alt="Astofo Logo"
+          width={120}
+          height={0}
+          draggable={false}
+        />
+        <NavigationLink />
+      </div>
+      <div>
+        <SignIn />
+      </div>
     </div>
   );
 };