Add home navigation button and improve account page UI

Enhances the account page navigation by adding a "Back to home" button and improving the overall user experience with better visual hierarchy and navigation flow.

Changes:
- Add home navigation button to account page with green icon
- Update logout button styling with red icon for visual emphasis
- Improve settings button label clarity
- Fix settings cancel button to navigate back to account page
- Increase account icon size in page header
- Update translation keys for consistency across EN/HR

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-26 13:26:19 +01:00
parent 982a8f0f88
commit 364a12f9d6
6 changed files with 12 additions and 8 deletions

View File

@@ -2,6 +2,7 @@ import { FC } from 'react';
import { Main } from '@/app/ui/Main';
import Link from 'next/link';
import SettingsIcon from "@mui/icons-material/Settings";
import HomeIcon from "@mui/icons-material/Home";
import AccountCircle from "@mui/icons-material/AccountCircle";
import { getTranslations, getLocale } from 'next-intl/server';
import { LogoutButton } from './LogoutButton';
@@ -16,7 +17,8 @@ const Page: FC = async () => {
<div className="card card-compact card-bordered min-w-[20em] max-w-[90em] bg-base-100 shadow-s my-1">
<div className="card-body">
<h2 className="card-title"><AccountCircle /> {t('title')}</h2>
<Link href={`/${locale}/home/account/settings`} className='btn btn-neutral'><SettingsIcon /> {t('settings-button')}</Link>
<Link href={`/${locale}/home`} className='btn btn-neutral'><HomeIcon className='text-green-300' /> {t('goto-home-button-label')}</Link>
<Link href={`/${locale}/home/account/settings`} className='btn btn-neutral'><SettingsIcon className='text-blue-400' /> {t('goto-settings-button-label')}</Link>
<LogoutButton />
</div>
</div>