feat: Replace text logo with puma icon

Changes:
- Added pounce-logo.png to /public
- Updated Header.tsx: Replaced text logo with Image component
- Updated Footer.tsx: Replaced text logo with Image component
- Updated login/page.tsx: Replaced text logo with Image component
- Updated register/page.tsx: Replaced text logo with Image component

Logo sizing:
- Header: 32px (mobile) / 36px (desktop)
- Footer: 40px
- Login/Register: 48px

All logos use Next.js Image component for optimization
This commit is contained in:
yves.gugger
2025-12-08 10:47:16 +01:00
parent 0080d1e766
commit 48368fe026
6 changed files with 38 additions and 40 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

View File

@ -3,22 +3,20 @@
import { useState } from 'react'
import { useRouter } from 'next/navigation'
import Link from 'next/link'
import Image from 'next/image'
import { useStore } from '@/lib/store'
import { Loader2, ArrowRight, Eye, EyeOff } from 'lucide-react'
// Logo Component - Text with accent dot
// Logo Component - Puma Image
function Logo() {
return (
<div className="relative inline-flex items-baseline">
{/* Accent dot - top left */}
<span className="absolute top-1 -left-3.5 flex items-center justify-center">
<span className="w-2.5 h-2.5 rounded-full bg-accent" />
<span className="absolute w-2.5 h-2.5 rounded-full bg-accent animate-ping opacity-30" />
</span>
<span className="text-2xl font-bold tracking-tight text-foreground">
pounce
</span>
</div>
<Image
src="/pounce-logo.png"
alt="pounce"
width={48}
height={48}
className="w-12 h-12"
/>
)
}

View File

@ -3,22 +3,20 @@
import { useState } from 'react'
import { useRouter } from 'next/navigation'
import Link from 'next/link'
import Image from 'next/image'
import { useStore } from '@/lib/store'
import { Loader2, ArrowRight, Check, Eye, EyeOff } from 'lucide-react'
// Logo Component - Text with accent dot
// Logo Component - Puma Image
function Logo() {
return (
<div className="relative inline-flex items-baseline">
{/* Accent dot - top left */}
<span className="absolute top-1 -left-3.5 flex items-center justify-center">
<span className="w-2.5 h-2.5 rounded-full bg-accent" />
<span className="absolute w-2.5 h-2.5 rounded-full bg-accent animate-ping opacity-30" />
</span>
<span className="text-2xl font-bold tracking-tight text-foreground">
pounce
</span>
</div>
<Image
src="/pounce-logo.png"
alt="pounce"
width={48}
height={48}
className="w-12 h-12"
/>
)
}

View File

@ -1,4 +1,5 @@
import Link from 'next/link'
import Image from 'next/image'
import { Github, Twitter, Mail } from 'lucide-react'
export function Footer() {
@ -8,14 +9,14 @@ export function Footer() {
<div className="grid grid-cols-2 md:grid-cols-4 gap-8 mb-12">
{/* Brand */}
<div className="col-span-2 md:col-span-1">
<div className="relative inline-flex items-baseline mb-4">
<span className="absolute top-1 -left-3.5 flex items-center justify-center">
<span className="w-2.5 h-2.5 rounded-full bg-accent" />
<span className="absolute w-2.5 h-2.5 rounded-full bg-accent animate-ping opacity-30" />
</span>
<span className="text-xl font-bold tracking-tight text-foreground">
pounce
</span>
<div className="mb-4">
<Image
src="/pounce-logo.png"
alt="pounce"
width={40}
height={40}
className="w-10 h-10"
/>
</div>
<p className="text-body-sm text-foreground-muted mb-4 max-w-xs">
Professional domain intelligence. Monitor availability, track prices, and secure your domains.

View File

@ -1,22 +1,23 @@
'use client'
import Link from 'next/link'
import Image from 'next/image'
import { useStore } from '@/lib/store'
import { LogOut, LayoutDashboard, Menu, X } from 'lucide-react'
import { useState } from 'react'
// Logo Component - Text with accent dot
// Logo Component - Puma Image
function Logo() {
return (
<div className="relative inline-flex items-baseline">
{/* Accent dot - top left */}
<span className="absolute top-1 -left-3 sm:-left-3.5 flex items-center justify-center">
<span className="w-2 h-2 sm:w-2.5 sm:h-2.5 rounded-full bg-accent" />
<span className="absolute w-2 h-2 sm:w-2.5 sm:h-2.5 rounded-full bg-accent animate-ping opacity-30" />
</span>
<span className="text-xl sm:text-2xl font-bold tracking-tight text-foreground">
pounce
</span>
<div className="relative flex items-center">
<Image
src="/pounce-logo.png"
alt="pounce"
width={36}
height={36}
className="w-8 h-8 sm:w-9 sm:h-9 object-contain"
priority
/>
</div>
)
}

BIN
pounce_logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB