Refactor header, side navigation, and navbar components to update logo links to the home page. Enhance consistency in navigation across the admin panel and main application.

This commit is contained in:
iamkiddy 2025-11-12 12:33:36 +00:00
parent 486feec8bc
commit 632d08cd29
3 changed files with 16 additions and 14 deletions

View File

@ -53,7 +53,7 @@ export function Header() {
<div className="px-3 sm:px-4 md:px-6 lg:px-8"> <div className="px-3 sm:px-4 md:px-6 lg:px-8">
<div className="flex items-center justify-between h-14 sm:h-16"> <div className="flex items-center justify-between h-14 sm:h-16">
{/* Logo */} {/* Logo */}
<Link href="/admin/dashboard" className="flex items-center gap-2 sm:gap-3"> <Link href="/" className="flex items-center gap-2 sm:gap-3">
<div className="flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-lg bg-linear-to-r from-rose-100 to-pink-100"> <div className="flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-lg bg-linear-to-r from-rose-100 to-pink-100">
<Heart className="w-4 h-4 sm:w-6 sm:h-6 text-rose-600" fill="currentColor" /> <Heart className="w-4 h-4 sm:w-6 sm:h-6 text-rose-600" fill="currentColor" />
</div> </div>

View File

@ -44,12 +44,12 @@ export default function SideNav() {
<> <>
{/* Mobile Top Bar */} {/* Mobile Top Bar */}
<div className="flex md:hidden items-center justify-between px-4 py-3 border-b border-gray-200 bg-white z-30 fixed top-0 left-0 right-0"> <div className="flex md:hidden items-center justify-between px-4 py-3 border-b border-gray-200 bg-white z-30 fixed top-0 left-0 right-0">
<div className="flex items-center gap-3"> <Link href="/" className="flex items-center gap-3">
<div className="flex items-center justify-center w-8 h-8 rounded-lg bg-linear-to-r from-rose-100 to-pink-100"> <div className="flex items-center justify-center w-8 h-8 rounded-lg bg-linear-to-r from-rose-100 to-pink-100">
<Heart className="w-5 h-5 text-rose-600" fill="currentColor" /> <Heart className="w-5 h-5 text-rose-600" fill="currentColor" />
</div> </div>
<span className="text-lg font-semibold text-gray-900">Attune Heart Therapy</span> <span className="text-lg font-semibold text-gray-900">Attune Heart Therapy</span>
</div> </Link>
<Button <Button
variant="ghost" variant="ghost"
size="icon" size="icon"
@ -76,12 +76,12 @@ export default function SideNav() {
> >
{/* Logo Section */} {/* Logo Section */}
<div className="shrink-0 px-3 pb-4 flex flex-col gap-1 md:block mb-5 pt-16 md:pt-4"> <div className="shrink-0 px-3 pb-4 flex flex-col gap-1 md:block mb-5 pt-16 md:pt-4">
<div className="flex items-center gap-2 mb-1 ml-2 md:ml-3"> <Link href="/" className="flex items-center gap-2 mb-1 ml-2 md:ml-3">
<div className="flex items-center justify-center w-8 h-8 rounded-lg bg-linear-to-r from-rose-100 to-pink-100"> <div className="flex items-center justify-center w-8 h-8 rounded-lg bg-linear-to-r from-rose-100 to-pink-100">
<Heart className="w-5 h-5 text-rose-600" fill="currentColor" /> <Heart className="w-5 h-5 text-rose-600" fill="currentColor" />
</div> </div>
<span className="text-sm font-semibold text-gray-900">Attune Heart</span> <span className="text-sm font-semibold text-gray-900">Attune Heart</span>
</div> </Link>
</div> </div>
<hr className="shrink-0 -mt-10 mb-4 mx-3 border-gray-200 md:block hidden" /> <hr className="shrink-0 -mt-10 mb-4 mx-3 border-gray-200 md:block hidden" />

View File

@ -7,6 +7,7 @@ import { ThemeToggle } from "@/components/ThemeToggle";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { LoginDialog } from "@/components/LoginDialog"; import { LoginDialog } from "@/components/LoginDialog";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import Link from "next/link";
export function Navbar() { export function Navbar() {
const [isDark, setIsDark] = useState(false); const [isDark, setIsDark] = useState(false);
@ -52,19 +53,20 @@ export function Navbar() {
> >
<div className="container mx-auto px-4"> <div className="container mx-auto px-4">
<div className="flex items-center justify-between h-16"> <div className="flex items-center justify-between h-16">
<motion.a <motion.div
href="#home"
className="flex items-center gap-2" className="flex items-center gap-2"
whileHover={{ scale: 1.05 }} whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }} whileTap={{ scale: 0.95 }}
> >
<Link href="/" className="flex items-center gap-2">
<div className="bg-linear-to-r from-rose-500 to-pink-600 p-2 rounded-xl"> <div className="bg-linear-to-r from-rose-500 to-pink-600 p-2 rounded-xl">
<Heart className="h-5 w-5 text-white fill-white" /> <Heart className="h-5 w-5 text-white fill-white" />
</div> </div>
<span className="font-bold text-lg bg-linear-to-r from-rose-600 via-pink-600 to-orange-600 bg-clip-text text-transparent"> <span className="font-bold text-lg bg-linear-to-r from-rose-600 via-pink-600 to-orange-600 bg-clip-text text-transparent">
Attune Heart Therapy Attune Heart Therapy
</span> </span>
</motion.a> </Link>
</motion.div>
<div className="hidden md:flex items-center gap-6"> <div className="hidden md:flex items-center gap-6">
<button <button