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

src/App.tsx

@@ -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 h-11 items-center gap-1">
-          <div className="flex items-center gap-1">
+            {creating || selectedNote ? (
-            <button
+              <button
-              type="button"
+                type="button"
-              onClick={goBack}
+                onClick={goBack}
-              aria-label="Retour"
+                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"
+                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>
+              </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">