fix(app): keep header height constant with or without back button
This commit is contained in:
1 parent
c5ca51a578
commit
0bfda59cb5
1 file changed
+11
-13
+11
-13
@@ -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">
|
||||
|
||||
Reference in new issue
Block a user