fix(app): keep header height constant with or without back button

This commit is contained in:
devcodetools committed 2026-09-13 17:27:55 +02:00
1 parent c5ca51a578
commit 0bfda59cb5
1 file changed
+11 -13
+11 -13
View File
@@ -39,21 +39,19 @@ function App() {
return (
<main className="mx-auto flex w-full max-w-2xl min-h-dvh flex-col pb-[calc(env(safe-area-inset-bottom)+7rem)]">
<header className="sticky top-0 z-10 border-b border-gray-200 bg-white/95 px-4 pb-3 pt-[calc(env(safe-area-inset-top)+0.75rem)] backdrop-blur">
{creating || selectedNote ? (
<div className="flex items-center gap-1">
<button
type="button"
onClick={goBack}
aria-label="Retour"
className="flex items-center justify-center w-11 h-11 -ml-2 rounded-full text-xl text-gray-700 hover:bg-gray-100 active:bg-gray-200"
>
←
</button>
<div className="flex h-11 items-center gap-1">
{creating || selectedNote ? (
<button
type="button"
onClick={goBack}
aria-label="Retour"
className="flex items-center justify-center w-11 h-11 -ml-2 rounded-full text-xl text-gray-700 hover:bg-gray-100 active:bg-gray-200"
>
←
</button>
) : null}
<h1 className="text-lg font-semibold">Notes</h1>
</div>
) : (
<h1 className="text-lg font-semibold">Notes</h1>
)}
</header>
<section className="flex-1 px-4 py-4">