feat: add Xpeditis logo as favicon and improve metadata

Add site favicon and enhance metadata for better SEO and social sharing:
- Added app/icon.svg from existing logo for browser tab icon
- Enhanced metadata with Open Graph and Twitter card support
- Created manifest.json for PWA support
- Added metadataBase for proper social image resolution
- Updated .env.example with NEXT_PUBLIC_APP_URL

The Xpeditis logo (blue background with cyan X) now appears in:
- Browser tabs (favicon)
- Bookmarks
- Mobile home screen (PWA)
- Social media shares (Open Graph)

Configuration for different environments:
- Dev: NEXT_PUBLIC_APP_URL=http://localhost:3000
- Preprod: NEXT_PUBLIC_APP_URL=https://app.preprod.xpeditis.com
- Prod: NEXT_PUBLIC_APP_URL=https://xpeditis.com

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

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
David 2025-12-23 13:29:45 +01:00
parent 618b3064c3
commit e1aeb9ccd7
4 changed files with 59 additions and 2 deletions

View File

@ -2,6 +2,9 @@
NEXT_PUBLIC_API_URL=http://localhost:4000
NEXT_PUBLIC_API_PREFIX=api/v1
# App Configuration
NEXT_PUBLIC_APP_URL=http://localhost:3000
# Authentication
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=your-nextauth-secret-change-this-in-production

View File

@ -0,0 +1,5 @@
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="48" height="48" rx="8" fill="#10183A"/>
<path d="M14 14L34 34M34 14L14 34" stroke="#34CCCD" stroke-width="4" stroke-linecap="round"/>
<circle cx="24" cy="24" r="3" fill="#34CCCD"/>
</svg>

After

Width:  |  Height:  |  Size: 308 B

View File

@ -4,8 +4,40 @@ import { manrope, montserrat } from '@/lib/fonts';
import { Providers } from '@/components/providers';
export const metadata: Metadata = {
title: 'Xpeditis - Maritime Freight Booking Platform',
description: 'Search, compare, and book maritime freight in real-time',
metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL || 'https://xpeditis.com'),
title: {
default: 'Xpeditis - Maritime Freight Booking Platform',
template: '%s | Xpeditis',
},
description: 'Search, compare, and book maritime freight in real-time. Get instant LCL shipping quotes and manage your shipments with Xpeditis.',
icons: {
icon: '/icon.svg',
shortcut: '/icon.svg',
apple: '/icon.svg',
},
manifest: '/manifest.json',
openGraph: {
type: 'website',
locale: 'fr_FR',
url: 'https://xpeditis.com',
siteName: 'Xpeditis',
title: 'Xpeditis - Maritime Freight Booking Platform',
description: 'Search, compare, and book maritime freight in real-time',
images: [
{
url: '/assets/logos/xpeditis-icon.svg',
width: 48,
height: 48,
alt: 'Xpeditis Logo',
},
],
},
twitter: {
card: 'summary',
title: 'Xpeditis - Maritime Freight Booking Platform',
description: 'Search, compare, and book maritime freight in real-time',
images: ['/assets/logos/xpeditis-icon.svg'],
},
};
export default function RootLayout({ children }: { children: React.ReactNode }) {

View File

@ -0,0 +1,17 @@
{
"name": "Xpeditis - Maritime Freight Booking",
"short_name": "Xpeditis",
"description": "Search, compare, and book maritime freight in real-time",
"start_url": "/",
"display": "standalone",
"background_color": "#ffffff",
"theme_color": "#10183A",
"icons": [
{
"src": "/assets/logos/xpeditis-icon.svg",
"sizes": "any",
"type": "image/svg+xml",
"purpose": "any maskable"
}
]
}