Add logo to navbar brand
This commit is contained in:
parent
0c64ddd937
commit
087ef872fe
3 changed files with 26 additions and 1 deletions
|
|
@ -67,3 +67,4 @@
|
||||||
- Home hero cleaned up (removed sample/browse CTAs), hero FI text updated, and health check link moved to About page runtime section.
|
- Home hero cleaned up (removed sample/browse CTAs), hero FI text updated, and health check link moved to About page runtime section.
|
||||||
- Listing creation form now supports editing all locales at once with language tabs, per-locale readiness badges, and an AI JSON helper to translate and apply copy across languages; API accepts multiple translations in one request.
|
- Listing creation form now supports editing all locales at once with language tabs, per-locale readiness badges, and an AI JSON helper to translate and apply copy across languages; API accepts multiple translations in one request.
|
||||||
- Added Swedish locale support across the app, language selector is now a flag dropdown (FI/SV/EN), and the new listing form/AI helper handle all three languages.
|
- Added Swedish locale support across the app, language selector is now a flag dropdown (FI/SV/EN), and the new listing form/AI helper handle all three languages.
|
||||||
|
- Site navbar now shows the new logo above the lomavuokraus.fi brand text on every page.
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,10 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
|
import Image from 'next/image';
|
||||||
import { useEffect, useState, type SVGProps } from 'react';
|
import { useEffect, useState, type SVGProps } from 'react';
|
||||||
import { useI18n } from './I18nProvider';
|
import { useI18n } from './I18nProvider';
|
||||||
|
import logo from '../../img/logo.png';
|
||||||
|
|
||||||
type SessionUser = { id: string; email: string; role: string; status: string };
|
type SessionUser = { id: string; email: string; role: string; status: string };
|
||||||
|
|
||||||
|
|
@ -139,7 +141,8 @@ export default function NavBar() {
|
||||||
<header style={{ padding: '12px 20px', borderBottom: '1px solid #eee', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
|
<header style={{ padding: '12px 20px', borderBottom: '1px solid #eee', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
|
||||||
<div style={{ display: 'flex', alignItems: 'center', gap: 16 }}>
|
<div style={{ display: 'flex', alignItems: 'center', gap: 16 }}>
|
||||||
<Link href="/" className="brand">
|
<Link href="/" className="brand">
|
||||||
{t('brand')}
|
<Image src={logo} alt="Lomavuokraus.fi logo" width={34} height={48} priority style={{ width: 34, height: 'auto' }} />
|
||||||
|
<span className="brand-text">{t('brand')}</span>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/listings" className="button secondary">
|
<Link href="/listings" className="button secondary">
|
||||||
<Icon name="list" /> {t('navBrowse')}
|
<Icon name="list" /> {t('navBrowse')}
|
||||||
|
|
|
||||||
|
|
@ -24,6 +24,27 @@ body {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.brand {
|
||||||
|
display: inline-flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
font-weight: 800;
|
||||||
|
font-size: 16px;
|
||||||
|
color: var(--text);
|
||||||
|
text-decoration: none;
|
||||||
|
line-height: 1.1;
|
||||||
|
transition: color 120ms ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand:hover {
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand-text {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
padding: 48px 20px 80px;
|
padding: 48px 20px 80px;
|
||||||
max-width: 1100px;
|
max-width: 1100px;
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue