Remove refresh button, compact mobile header layout

- Remove refresh icon and refreshing state
- Show "+" instead of "+ Add Pub" on mobile
- Keep icon toggle and add button on same line as view tabs on mobile

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: pjcc

src/App.jsx

@@ -36,7 +36,6 @@ export default function App() {
     localStorage.getItem('brighton-pubs-view') || 'cards'
   );
   const [toast, setToast] = useState(null);
-  const [refreshing, setRefreshing] = useState(false);
   const [search, setSearch] = useState('');
   const [sortBy, setSortBy] = useState('name');
   const [filters, setFilters] = useState({});
@@ -341,8 +340,6 @@ export default function App() {
       <Header
         onAdd={() => { setEditingPub(null); setShowForm(true); }}
         onSignOut={handleSignOut}
-        onRefresh={async () => { setRefreshing(true); await loadData(true); setRefreshing(false); }}
-        refreshing={refreshing}
         view={view}
         onViewChange={handleViewChange}
         theme={theme}

src/components/Header.jsx

@@ -9,7 +9,7 @@ const THEMES = [
 ];
 
 export default function Header({
-  onAdd, onSignOut, onRefresh, refreshing,
+  onAdd, onSignOut,
   view, onViewChange, theme, onThemeChange,
   userName, unseenCount, pubs,
   search, onSearchChange, filters, onFiltersChange,
@@ -74,17 +74,7 @@ export default function Header({
               <rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/>
             </svg>
           </button>
-          <button
-            className={`btn btn-ghost ${refreshing ? 'spin' : ''}`}
-            onClick={onRefresh}
-            title="Refresh"
-          >
-            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-              <polyline points="23 4 23 10 17 10"/><polyline points="1 20 1 14 7 14"/>
-              <path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/>
-            </svg>
-          </button>
-          <button className="btn btn-primary" onClick={onAdd}>+ Add Pub</button>
+          <button className="btn btn-primary" onClick={onAdd}><span className="add-label-full">+ Add Pub</span><span className="add-label-short">+</span></button>
         </div>
       </div>
 

src/index.css

@@ -176,7 +176,7 @@ a:hover { text-decoration: underline; }
 }
 .btn-icon:hover { color: var(--text-light); }
 
-.spin svg { animation: spin 0.8s linear infinite; }
+.add-label-short { display: none; }
 
 /* ---- Header ---- */
 .header {
@@ -1300,6 +1300,15 @@ a:hover { text-decoration: underline; }
   .form-row { grid-template-columns: 1fr; }
   .header-filters { flex-direction: column; }
   .search-input { width: 100%; }
+
+  .header-nav {
+    flex-wrap: nowrap;
+  }
+  .header-actions {
+    margin-left: auto;
+  }
+  .add-label-full { display: none; }
+  .add-label-short { display: inline; }
 }
 
 @media (max-width: 380px) {