trails-cool/trails
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #45 from trails-cool/responsive-layout

Browse source
This commit is contained in:
github-actions[bot] 2026-03-25 01:13:49 +00:00 • committed by GitHub
commit c48b811ea4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 7 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

6
apps/journal/app/routes/routes.$id.tsx
View file

@ -90,7 +90,7 @@ export default function RouteDetailPage({ loaderData }: Route.ComponentProps) {
return ( return (
<div className="mx-auto max-w-4xl px-4 py-8"> <div className="mx-auto max-w-4xl px-4 py-8">
<div className="flex items-start justify-between"> <div className="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
<div> <div>
<h1 className="text-2xl font-bold text-gray-900">{route.name}</h1> <h1 className="text-2xl font-bold text-gray-900">{route.name}</h1>
{route.description && ( {route.description && (
@ -98,7 +98,7 @@ export default function RouteDetailPage({ loaderData }: Route.ComponentProps) {
)} )}
</div> </div>
{isOwner && ( {isOwner && (
<div className="flex gap-2"> <div className="flex flex-wrap gap-2">
<button <button
onClick={handleEditInPlanner} onClick={handleEditInPlanner}
disabled={editLoading} disabled={editLoading}
@ -125,7 +125,7 @@ export default function RouteDetailPage({ loaderData }: Route.ComponentProps) {
)} )}
</div> </div>
<div className="mt-6 grid grid-cols-3 gap-4"> <div className="mt-6 grid grid-cols-1 gap-4 sm:grid-cols-3">
{route.distance != null && ( {route.distance != null && (
<div className="rounded-md bg-gray-50 p-4"> <div className="rounded-md bg-gray-50 p-4">
<p className="text-2xl font-bold text-gray-900"> <p className="text-2xl font-bold text-gray-900">

8
apps/planner/app/components/SessionView.tsx
View file

@ -43,9 +43,9 @@ export function SessionView({ sessionId, callbackUrl, callbackToken, returnUrl,
return ( return (
<> <>
<header className="flex items-center justify-between border-b border-gray-200 px-4 py-2"> <header className="flex flex-wrap items-center justify-between gap-2 border-b border-gray-200 px-4 py-2">
<div className="flex items-center gap-4"> <div className="flex items-center gap-2 md:gap-4">
<h1 className="text-lg font-semibold text-gray-900">trails.cool Planner</h1> <h1 className="hidden text-lg font-semibold text-gray-900 sm:block">trails.cool Planner</h1>
<ProfileSelector yjs={yjs} /> <ProfileSelector yjs={yjs} />
</div> </div>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
@ -95,7 +95,7 @@ export function SessionView({ sessionId, callbackUrl, callbackToken, returnUrl,
<ElevationChart yjs={yjs} onHover={handleElevationHover} /> <ElevationChart yjs={yjs} onHover={handleElevationHover} />
</Suspense> </Suspense>
</main> </main>
<aside className="w-72 border-l border-gray-200 bg-white"> <aside className="hidden w-72 border-l border-gray-200 bg-white md:block">
<Suspense fallback={null}> <Suspense fallback={null}>
<WaypointSidebar yjs={yjs} routeStats={routeStats} /> <WaypointSidebar yjs={yjs} routeStats={routeStats} />
</Suspense> </Suspense>