Add logo image to the public directory

2026-03-10 09:36:47 +03:00
parent 437080eb35
commit 29a0a8a893
9 changed files with 1690 additions and 5 deletions
@@ -0,0 +1,77 @@
+"use client";
+
+import { Icon } from "@iconify/react";
+import Link from "next/link";
+import { Avatar, AvatarFallback, AvatarImage, Separator } from "poyraz-ui/atoms";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "poyraz-ui/molecules";
+import { SearchCommand } from "@/components/search-command";
+import { NAV_LINKS, SOCIAL_LINKS } from "@/lib/links";
+
+export function SiteNavbar() {
+  return (
+    <header className="flex flex-wrap items-center justify-between gap-4 border-b border-border pb-4">
+      <Link href="/" aria-label="Go to home" className="inline-flex items-center">
+        <Avatar className="h-9 w-9 rounded-sm">
+          <AvatarImage src="/logo/logo.jpeg" alt="Poyraz Avsever" />
+          <AvatarFallback className="rounded-sm bg-muted text-xs font-semibold">
+            PA
+          </AvatarFallback>
+        </Avatar>
+      </Link>
+
+      <div className="flex flex-wrap items-center justify-end gap-3">
+        <nav aria-label="Main navigation">
+          <ul className="flex flex-wrap items-center gap-3 text-sm">
+            {NAV_LINKS.map((item, index) => (
+              <li key={item.id} className="flex items-center gap-3">
+                {index > 0 && (
+                  <Separator orientation="vertical" className="h-4 bg-border" decorative />
+                )}
+                <Link
+                  href={item.href}
+                  className="text-foreground/55 transition-colors hover:text-foreground"
+                >
+                  {item.label}
+                </Link>
+              </li>
+            ))}
+          </ul>
+        </nav>
+
+        <Separator orientation="vertical" className="hidden h-4 bg-border sm:block" decorative />
+        <SearchCommand />
+
+        <DropdownMenu>
+          <DropdownMenuTrigger className="inline-flex h-8 cursor-pointer items-center gap-2 rounded-sm border border-border px-2.5 text-sm text-muted-foreground transition-colors hover:text-foreground">
+            <Icon icon="mdi:share-variant" width={16} height={16} />
+            <span>Social</span>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent align="end" className="w-52 rounded-sm">
+            <DropdownMenuLabel>Social Links</DropdownMenuLabel>
+            <DropdownMenuSeparator />
+            {SOCIAL_LINKS.map((item) => (
+              <DropdownMenuItem key={item.id} asChild>
+                <Link
+                  href={item.href}
+                  target="_blank"
+                  rel="noreferrer"
+                  className="flex items-center gap-2"
+                >
+                  <Icon icon={item.icon} width={16} height={16} />
+                  <span>{item.label}</span>
+                </Link>
+              </DropdownMenuItem>
+            ))}
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </div>
+    </header>
+  );
+}