dwindown/meet-hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix sidebar header to show logo + brand name inline, improve favicon update logic

Browse Source 
- Update AppLayout to display logo and brand name together in all headers (sidebar, public, mobile)
- Improve favicon update in useBranding to create link element if not exists
- Update opengraph metadata to use local image instead of lovable.dev URL
- Change author/meta to WithDwindi branding

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
dwindown
2025-12-24 15:50:50 +07:00
parent dfbabddd98
commit 428314d5bf
4 changed files with 18 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
index.html
View File

@@ -6,16 +6,16 @@
<!-- Title will be dynamically updated from branding settings --> <!-- Title will be dynamically updated from branding settings -->
<title>Loading...</title> <title>Loading...</title>
<meta name="description" content="Learn. Grow. Succeed." /> <meta name="description" content="Learn. Grow. Succeed." />
<meta name="author" content="LearnHub" /> <meta name="author" content="WithDwindi" />
<meta property="og:title" content="LearnHub" /> <meta property="og:title" content="WithDwindi" />
<meta property="og:description" content="Learn. Grow. Succeed." /> <meta property="og:description" content="Learn. Grow. Succeed." />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta property="og:image" content="https://lovable.dev/opengraph-image-p98pqg.png" /> <meta property="og:image" content="/src/opengraph.png" />
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@LearnHub" /> <meta name="twitter:site" content="@dwindown" />
<meta name="twitter:image" content="https://lovable.dev/opengraph-image-p98pqg.png" /> <meta name="twitter:image" content="/src/opengraph.png" />
</head> </head>
<body> <body>

15
src/components/AppLayout.tsx
View File

@@ -108,11 +108,10 @@ export function AppLayout({ children }: AppLayoutProps) {
<header className="border-b-2 border-border bg-background sticky top-0 z-50"> <header className="border-b-2 border-border bg-background sticky top-0 z-50">
<div className="container mx-auto px-4 py-4 flex items-center justify-between"> <div className="container mx-auto px-4 py-4 flex items-center justify-between">
<Link to="/" className="text-2xl font-bold flex items-center gap-2"> <Link to="/" className="text-2xl font-bold flex items-center gap-2">
{logoUrl ? ( {logoUrl && (
<img src={logoUrl} alt={brandName} className="h-8 object-contain" /> <img src={logoUrl} alt={brandName} className="h-8 object-contain" />
) : (
brandName
)} )}
<span>{brandName}</span>
</Link> </Link>
<nav className="flex items-center gap-4"> <nav className="flex items-center gap-4">
<Link to="/products" className="hover:underline font-medium">Produk</Link> <Link to="/products" className="hover:underline font-medium">Produk</Link>
@@ -148,11 +147,10 @@ export function AppLayout({ children }: AppLayoutProps) {
<aside className="hidden md:flex flex-col w-64 border-r-2 border-border bg-sidebar fixed h-screen"> <aside className="hidden md:flex flex-col w-64 border-r-2 border-border bg-sidebar fixed h-screen">
<div className="p-4 border-b-2 border-border"> <div className="p-4 border-b-2 border-border">
<Link to="/" className="text-xl font-bold flex items-center gap-2"> <Link to="/" className="text-xl font-bold flex items-center gap-2">
{logoUrl ? ( {logoUrl && (
<img src={logoUrl} alt={brandName} className="h-8 object-contain" /> <img src={logoUrl} alt={brandName} className="h-8 object-contain" />
) : (
brandName
)} )}
<span>{brandName}</span>
</Link> </Link>
</div> </div>
@@ -201,11 +199,10 @@ export function AppLayout({ children }: AppLayoutProps) {
{/* Mobile Header */} {/* Mobile Header */}
<header className="md:hidden sticky top-0 z-50 border-b-2 border-border bg-background px-4 py-3 flex items-center justify-between"> <header className="md:hidden sticky top-0 z-50 border-b-2 border-border bg-background px-4 py-3 flex items-center justify-between">
<Link to="/" className="text-xl font-bold flex items-center gap-2"> <Link to="/" className="text-xl font-bold flex items-center gap-2">
{logoUrl ? ( {logoUrl && (
<img src={logoUrl} alt={brandName} className="h-6 object-contain" /> <img src={logoUrl} alt={brandName} className="h-6 object-contain" />
) : (
brandName
)} )}
<span>{brandName}</span>
</Link> </Link>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Link to="/checkout" className="relative p-2"> <Link to="/checkout" className="relative p-2">

9
src/hooks/useBranding.tsx
View File

@@ -93,8 +93,13 @@ export function BrandingProvider({ children }: { children: ReactNode }) {
// Update favicon if set // Update favicon if set
if (data.brand_favicon_url) { if (data.brand_favicon_url) {
const link = document.querySelector("link[rel~='icon']") as HTMLLinkElement; let link = document.querySelector("link[rel~='icon']") as HTMLLinkElement;
if (link) link.href = data.brand_favicon_url; if (!link) {
link = document.createElement('link');
link.rel = 'icon';
document.head.appendChild(link);
}
link.href = data.brand_favicon_url;
} }
// Update document title // Update document title

BIN
src/opengraph.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB