feat(frontend): add page titles to navbar on mobile
- Save vertical space on mobile by showing page title in navbar
- Mobile: "spotlight.cam - {PageTitle}" instead of separate h1
- Desktop: unchanged - page titles remain as separate headings
- Saves ~60-80px vertical space on mobile devices
Pages updated:
- Dashboard, Events, Matches, History, Profile
This commit is contained in:
@@ -160,9 +160,9 @@ const DashboardPage = () => {
|
||||
const hasOutgoing = matchRequests?.outgoing?.length > 0;
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<Layout pageTitle="Dashboard">
|
||||
<div className="max-w-5xl mx-auto">
|
||||
<div className="mb-8">
|
||||
<div className="hidden lg:block mb-8">
|
||||
<h1 className="text-3xl font-bold text-gray-900">Dashboard</h1>
|
||||
<p className="text-gray-600 mt-1">
|
||||
Welcome back, {user?.firstName || user?.username}!
|
||||
|
||||
@@ -192,10 +192,10 @@ const EventsPage = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<Layout pageTitle="Events">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Choose an event</h1>
|
||||
<p className="text-gray-600 mb-8">Join an event and start connecting with other dancers</p>
|
||||
<h1 className="hidden lg:block text-3xl font-bold text-gray-900 mb-2">Choose an event</h1>
|
||||
<p className="hidden lg:block text-gray-600 mb-8">Join an event and start connecting with other dancers</p>
|
||||
|
||||
{canLoadMorePast && (
|
||||
<div className="mb-4 flex justify-center">
|
||||
|
||||
@@ -5,10 +5,10 @@ import { MATCH_STATUS } from '../constants';
|
||||
|
||||
const HistoryPage = () => {
|
||||
return (
|
||||
<Layout>
|
||||
<Layout pageTitle="History">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-2">Collaboration history</h1>
|
||||
<p className="text-gray-600 mb-8">Your previous matches and ratings</p>
|
||||
<h1 className="hidden lg:block text-3xl font-bold text-gray-900 mb-2">Collaboration history</h1>
|
||||
<p className="hidden lg:block text-gray-600 mb-8">Your previous matches and ratings</p>
|
||||
|
||||
{/* Matches Section */}
|
||||
<div className="mb-12">
|
||||
|
||||
@@ -125,9 +125,9 @@ const MatchesPage = () => {
|
||||
const otherMatches = filteredMatches.filter(m => !(m.status === MATCH_STATUS.PENDING && !m.isInitiator));
|
||||
|
||||
return (
|
||||
<Layout noPadding>
|
||||
<Layout noPadding pageTitle="Matches">
|
||||
<div className="w-full max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||
<div className="mb-6">
|
||||
<div className="hidden lg:block mb-6">
|
||||
<h1 className="text-3xl font-bold text-gray-900">Match Requests</h1>
|
||||
<p className="text-gray-600 mt-2">
|
||||
Manage your dance partner connections
|
||||
|
||||
@@ -10,7 +10,7 @@ const ProfilePage = () => {
|
||||
const [activeTab, setActiveTab] = useState('profile');
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<Layout pageTitle="Profile">
|
||||
<div className="min-h-screen bg-gray-50 py-8">
|
||||
<div className="max-w-4xl mx-auto px-4">
|
||||
{/* Header */}
|
||||
|
||||
Reference in New Issue
Block a user