Merge branch 'dev' into templates

src/components/AdminSidebar.js

@@ -265,7 +265,7 @@ const AdminSidebar = ({ isOpen, onToggle, isMobile }) => {
       >
         {/* Header */}
         <div className="flex items-center justify-between p-4 border-b border-[#ddd8eb]">
-          <div className="flex items-center gap-3">
+          <Link to="/" className="flex items-center gap-3 group flex-1 min-w-0">
             <img
               src={`${process.env.PUBLIC_URL}/loaf-logo.png`}
               alt="LOAF Logo"
@@ -274,11 +274,16 @@ const AdminSidebar = ({ isOpen, onToggle, isMobile }) => {
               }`}
             />
             {isOpen && (
-              <h2 className="text-xl font-semibold text-[#422268]" style={{ fontFamily: "'Inter', sans-serif" }}>
-                Admin
-              </h2>
+              <div className="flex-1 min-w-0">
+                <h2 className="text-xl font-semibold text-[#422268]" style={{ fontFamily: "'Inter', sans-serif" }}>
+                  Admin
+                </h2>
+                <p className="text-xs text-[#664fa3] group-hover:text-[#ff9e77] transition-colors" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                  View Public Site
+                </p>
+              </div>
             )}
-          </div>
+          </Link>
           <button
             onClick={onToggle}
             className="p-2 rounded-lg hover:bg-[#DDD8EB]/20 transition-colors"