refactor: Simplify footer navigation and conditionally display developer mode information

This commit refactors the Layout component to simplify the footer navigation by removing the Settings item. Additionally, it updates the AutoMatch and Identify components to conditionally display user information and face location details based on the developer mode status, enhancing the clarity of the UI. Documentation has been updated to reflect these changes.

frontend/src/components/Layout.tsx

@@ -45,10 +45,7 @@ export default function Layout() {
     { path: '/manage-users', label: 'Users', icon: '👥', featureKey: 'manage_users' },
   ]
 
-  const footerNavItems: NavItem[] = [
-    { path: '/settings', label: 'Settings', icon: '⚙️' },
-    { path: '/help', label: 'Help', icon: '📚' },
-  ]
+  const footerNavItems: NavItem[] = [{ path: '/help', label: 'Help', icon: '📚' }]
 
   const filterNavItems = (items: NavItem[]) =>
     items.filter((item) => !item.featureKey || hasPermission(item.featureKey))

frontend/src/pages/AutoMatch.tsx

@@ -623,9 +623,11 @@ export default function AutoMatch() {
                 <>
                   <div className="mb-4">
                     <div className="flex items-center justify-between mb-2">
-                      <div className="text-sm text-gray-600">
-                        Person {currentIndex + 1}
-                      </div>
+                      {isDeveloperMode && (
+                        <div className="text-sm text-gray-600">
+                          Person {currentIndex + 1}
+                        </div>
+                      )}
                       <div className="space-x-2">
                         <button
                           onClick={goBack}
@@ -647,9 +649,11 @@ export default function AutoMatch() {
                     <p className="text-sm text-gray-600">
                       📁 Photo: {currentPerson.reference_photo_filename}
                     </p>
-                    <p className="text-sm text-gray-600">
-                      📍 Face location: {currentPerson.reference_location}
-                    </p>
+                    {isDeveloperMode && (
+                      <p className="text-sm text-gray-600">
+                        📍 Face location: {currentPerson.reference_location}
+                      </p>
+                    )}
                     <p className="text-sm text-gray-600">
                       📊 {currentPerson.face_count} faces already identified
                     </p>
@@ -781,8 +785,8 @@ export default function AutoMatch() {
               </button>
             </div>
             <div className="text-sm text-gray-600">
-              Person {currentIndex + 1}
-              {currentPerson && ` • ${currentPerson.total_matches} matches`}
+              {isDeveloperMode && `Person ${currentIndex + 1} `}
+              {currentPerson && `• ${currentPerson.total_matches} matches`}
             </div>
           </div>
         </>

frontend/src/pages/Identify.tsx

@@ -953,7 +953,7 @@ export default function Identify() {
                       setDob(e.target.value)
                       setPersonId(undefined) // Clear person selection when typing
                     }}
-                      className="mt-1 block w-full border rounded px-2 py-1"
+                      className="mt-1 block border rounded px-2 py-1 w-full max-w-[220px]"
                       readOnly={!!personId}
                       disabled={!!personId} />
                   </div>