Stop the mobile header and the More sheet from repeating each other

Four things were wrong, and all four are mine.

The header still carried Hesabım, Kaydedilenler and Ara as icons while
the sheet listed the same three by name — the sheet was added without
taking anything away. Hesabım and Kaydedilenler now live in the rail on
desktop and the bar or sheet on mobile, nowhere else. Ara stays as the
header magnifier and left the sheet: it is frequent enough to keep at one
tap, and a magnifier needs no label.

The sheet's labels were invisible. It borrows .app-rail-nav so the two
menus share one set of link styles, but the icon-only rules that collapse
the rail between 781 and 1260 were never scoped to .app-rail, so they
collapsed the sheet's labels too. That is the price of the class I shared
to save bytes, and the rules are scoped now.

Hesabım was in the sheet. It is where someone manages their own agents
and it belongs in the bar; İletişim took its place in the sheet. The
reason İletişim was promoted was that the footer hides things, and the
sheet is not the footer — it is one tap from every page with its name
written out. The test now guards that it is in the menu rather than that
it is in the bar.

Ajanlar and Hesabım drew the same glyph side by side, because the account
link reused the two-person "agents" icon. There is a single-person "user"
icon now.

And Equinox ağı was display:none below 781, so on a phone it existed only
in the footer. It is the last item in the sheet, opening in a new tab.

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

Author: sametbasbug

scripts/orbit-site-tests.mjs

@@ -955,13 +955,33 @@ check(
 /* İletişim menüde. Footer'da kalması, bize ulaşmak isteyen insanın
  * ulaşamaması demekti — ve kayıt herkese açıkken o insan sayısı artıyor.
  *
- * Liste artık `src/shared/navigation.ts`'te; iddia oraya taşındı. Header'da
- * aramak, menü oradan çıktığı için hep geçen bir test bırakırdı. */
+ * Korunan şey menüde OLMASI, çubukta olması değil: mobilde "Diğer"in
+ * içinde duruyor ve orası footer değil — her sayfadan tek dokunuş uzakta,
+ * adı yazılı bir liste. Masaüstünde zaten rayda. */
 const navigationSource = fs.readFileSync(path.join(ROOT, 'src', 'shared', 'navigation.ts'), 'utf8');
 check(
-  /href: '\/iletisim'[^\n]*primary: true/u.test(navigationSource),
+  /href: '\/iletisim'/u.test(navigationSource),
   'İletişim menüden düşmüş; yalnız footer’da kalan bir bağlantıyı kimse bulmaz.',
 );
+/* Hesabım çubukta. Kişinin kendi alanı ve ajanlarını oradan yönetiyor;
+ * bir menünün arkasına konacak bir sekme değil. */
+check(
+  /href: '\/dashboard'[^\n]*primary: true/u.test(navigationSource),
+  'Hesabım mobil çubuktan düşmüş.',
+);
+/* Mobilde header ikonlarıyla "Diğer" menüsü bir dönem birebir aynıydı:
+ * Ara, Hesabım ve Kaydedilenler her iki yerde birden duruyordu. */
+const headerSource = fs.readFileSync(path.join(ROOT, 'src', 'components', 'Header.astro'), 'utf8');
+for (const href of ['/dashboard', '/saved']) {
+  check(
+    !headerSource.includes(`href="${href}"`),
+    `Header ${href} bağlantısını menüyle birlikte ikinci kez gösteriyor.`,
+  );
+}
+check(
+  !/label: 'Ara'/u.test(navigationSource),
+  'Ara hem header büyütecinde hem "Diğer" menüsünde duruyor.',
+);
 /* Ray her sayfada. Menünün yalnız ana sayfada durduğu bir dönem vardı ve
  * /agents üzerinde ekranda marka dışında hiçbir gezinme öğesi kalmıyordu. */
 for (const [label, html] of [

src/components/Header.astro

@@ -65,7 +65,12 @@ const searchQuery = Astro.url.searchParams.get('q') ?? '';
             tek görünüm kaynağı. */}
         <div class="nav-more-sheet app-rail-nav">
           {moreLinks.map((link) => (
-            <a href={link.href} aria-current={isActive(link, currentPath) ? 'page' : undefined}>
+            <a
+              href={link.href}
+              target={link.external ? '_blank' : undefined}
+              rel={link.external ? 'noopener' : undefined}
+              aria-current={!link.external && isActive(link, currentPath) ? 'page' : undefined}
+            >
               <Icon name={link.icon} size={18} />
               <span>{link.label}</span>
             </a>
@@ -89,21 +94,18 @@ const searchQuery = Astro.url.searchParams.get('q') ?? '';
     </form>
 
     <div class="header-actions">
-      <a class:list={['header-mobile-search', { active: normalizedPath === '/search' }]} href="/search" aria-label="Orbit'te ara" aria-current={normalizedPath === '/search' ? 'page' : undefined}>
-        <Icon name="search" size={17} />
-      </a>
       {/*
-        Hesabım ve Kaydedilenler masaüstünde artık sol rayda. Header'da da
-        durmaları aynı hedefi iki yerde göstermek olurdu; dar ekranda ise
-        ray yok, o yüzden ikisi orada ikon olarak kalıyor.
+        Hesabım ve Kaydedilenler header'da YOK: masaüstünde sol rayda,
+        mobilde alt çubuğun "Diğer" menüsünde duruyorlar. Bir dönem her üç
+        yerde birden vardılar ve mobilde header ikonlarıyla menü içeriği
+        birebir aynıydı.
+
+        Arama burada kalıyor ve menüde yok: sık kullanılan bir eylem ve
+        büyüteç her yerde tanınan bir işaret; onu bir dokunuş arkasına
+        koymanın karşılığı yok.
       */}
-      <a class:list={['header-saved header-narrow-only', { active: normalizedPath === '/dashboard' }]} href="/dashboard" aria-label="Hesabım" aria-current={normalizedPath === '/dashboard' ? 'page' : undefined}>
-        <Icon name="agents" size={17} />
-        <span>Hesabım</span>
-      </a>
-      <a class:list={['header-saved header-narrow-only', { active: normalizedPath === '/saved' }]} href="/saved" aria-label="Kaydedilenler" aria-current={normalizedPath === '/saved' ? 'page' : undefined}>
-        <Icon name="bookmark" size={17} />
-        <span>Kaydedilenler</span>
+      <a class:list={['header-mobile-search', { active: normalizedPath === '/search' }]} href="/search" aria-label="Orbit'te ara" aria-current={normalizedPath === '/search' ? 'page' : undefined}>
+        <Icon name="search" size={17} />
       </a>
       <ThemeToggle />
       <a class="equinox-link" href="https://equinox.sametbasbug.dev">

src/shared/icons.ts

@@ -5,6 +5,7 @@
 export type IconName =
   | 'home'
   | 'agents'
+  | 'user'
   | 'projects'
   | 'reply'
   | 'info'
@@ -35,6 +36,13 @@ export const ICON_PATHS: Record<IconName, string[]> = {
     'M22 21v-2a4 4 0 0 0-3-3.87',
     'M16 3.13a4 4 0 0 1 0 7.75',
   ],
+  /* Tek kişi. `agents` iki kişilik bir grup ve o "ajanlar" demek; hesap
+   * bağlantısı onunla aynı ikonu taşıyınca menüde yan yana iki özdeş
+   * simge çıkıyordu. */
+  user: [
+    'M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2',
+    'M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z',
+  ],
   projects: [
     'M4 4h6v6H4Z',
     'M14 4h6v6h-6Z',

src/shared/navigation.ts

@@ -17,6 +17,8 @@ export interface NavigationLink {
   readonly href: string;
   readonly label: string;
   readonly icon: IconName;
+  /** Orbit dışına çıkan bağlantı; yeni sekmede açılıyor. */
+  readonly external?: boolean;
   /** Bu yol öneki de bağlantıyı aktif sayar (ör. /posts/x akışa aittir). */
   readonly owns?: readonly string[];
 }
@@ -29,9 +31,13 @@ export interface NavigationLink {
  * ve altıncısı sığmıyor, yani bu bir yer sorunu — hangi maddelerin düşeceği
  * tesadüfe değil bu bayrağa bağlı.
  *
- * İletişim çubukta kalıyor. Kayıt herkese açıkken bize ulaşmak isteyen
- * insan sayısı artıyor ve ulaşamayan insan, ulaşmaktan vazgeçen insandır;
- * bir dokunuş arkasına koymak o yolu uzatır. Hakkında ise bekleyebilir.
+ * Çubuktaki dört yer: Akış, Konular, Ajanlar ve Hesabım. Hesabım kişinin
+ * kendi alanı — ajanlarını oradan yönetiyor — ve bir menünün arkasına
+ * konacak bir şey değil.
+ *
+ * İletişim menüye geçti. Onu bir dönem çubuğa çıkaran gerekçe "footer'da
+ * kalırsa kimse bulamaz" idi; "Diğer" footer değil, her sayfadan tek
+ * dokunuş uzakta ve adı yazılı bir liste. O gerekçe orada da karşılanıyor.
  */
 export const NAVIGATION: readonly (NavigationLink & { readonly primary: boolean })[] = [
   { href: '/', label: 'Akış', icon: 'home', owns: ['/posts', '/page', '/feed'], primary: true },
@@ -40,29 +46,39 @@ export const NAVIGATION: readonly (NavigationLink & { readonly primary: boolean
   { href: '/duyurular', label: 'Duyurular', icon: 'alert', primary: false },
   { href: '/saved', label: 'Kaydedilenler', icon: 'bookmark', primary: false },
   { href: '/about', label: 'Hakkında', icon: 'info', owns: ['/about'], primary: false },
-  { href: '/iletisim', label: 'İletişim', icon: 'mail', primary: true },
+  { href: '/iletisim', label: 'İletişim', icon: 'mail', primary: false },
 ];
 
 /**
  * Hesap bölgesi. Rayda ana menüden bir çizgiyle ayrılıyor: ötekiler Orbit'in
  * içeriğine, bunlar kişinin kendi hesabına gidiyor. Tek listede toplamak,
  * "Ajanlar" ile "Hesabım"ı aynı türden iki şey gibi göstermek olurdu.
  */
-export const ACCOUNT_NAVIGATION: readonly NavigationLink[] = [
-  { href: '/dashboard', label: 'Hesabım', icon: 'agents', owns: ['/dashboard'] },
+export const ACCOUNT_NAVIGATION: readonly (NavigationLink & { readonly primary: boolean })[] = [
+  { href: '/dashboard', label: 'Hesabım', icon: 'user', owns: ['/dashboard'], primary: true },
 ];
 
-export const MOBILE_NAVIGATION = NAVIGATION.filter((link) => link.primary);
+export const MOBILE_NAVIGATION: readonly NavigationLink[] = [
+  ...NAVIGATION.filter((link) => link.primary),
+  ...ACCOUNT_NAVIGATION.filter((link) => link.primary),
+];
 
 /**
  * Çubuğa sığmayanlar. Kaybolmuyorlar, bir dokunuş arkasına geçiyorlar —
  * masaüstünde hepsi rayda duruyor ve mobilde yalnız footer'da kalsalardı
  * kimse bulamazdı.
+ *
+ * Arama burada YOK: header'daki büyüteç onu zaten taşıyor ve iki yerde
+ * birden göstermek, mobilde header ikonlarıyla bu menüyü birbirinin
+ * kopyası hâline getirmişti.
  */
 export const MOBILE_MORE_NAVIGATION: readonly NavigationLink[] = [
   ...NAVIGATION.filter((link) => !link.primary),
-  ...ACCOUNT_NAVIGATION,
-  { href: '/search', label: 'Ara', icon: 'search' },
+  ...ACCOUNT_NAVIGATION.filter((link) => !link.primary),
+  /* Equinox ağı mobilde header'da `display: none` ile gizliydi ve yalnız
+   * footer'da kalıyordu — yani pratikte yoktu. Yeri burası: Orbit'in
+   * dışına çıkan tek bağlantı, ikincil hedeflerin yanında. */
+  { href: 'https://equinox.sametbasbug.dev', label: 'Equinox ağı', icon: 'external', external: true },
 ];
 
 /** Sondaki eğik çizgi taşındığı için yol önce normalleştiriliyor. */

src/styles/responsive.css

@@ -18,21 +18,26 @@
    * menüyü aramanın tek yolu footer'dı.
    *
    * Etiketler `display: none` ile değil `.sr-only` kalıbıyla gizleniyor:
-   * ekran okuyucu bağlantının adını okumaya devam ediyor. */
+   * ekran okuyucu bağlantının adını okumaya devam ediyor.
+   *
+   * Kurallar `.app-rail` ile sınırlı: mobil çubuktaki "Diğer" menüsü de
+   * `.app-rail-nav` sınıfını ödünç alıyor — görünüm tek kaynaktan gelsin
+   * diye — ve sınırlamayınca onun etiketlerini de gizliyordu. Ödünç alınan
+   * sınıfın bedeli bu; kural bağlamına bağlanmalı. */
   .app-frame.has-rail {
     grid-template-columns: 3.5rem minmax(0, 1fr);
     gap: var(--space-8);
   }
 
-  .app-rail-nav a {
+  .app-rail .app-rail-nav a {
     justify-content: center;
     padding: 0;
   }
 
   /* `margin: -1px` bilerek yok: bu kalıp `.sr-only`'den geliyor ama orada
      akıştan çıkarmak için duruyordu, burada zaten `position: absolute` var.
      Skala kilidi kopyayı yakaladı — ham değer, gerekmediği yerde. */
-  .app-rail-nav a > span {
+  .app-rail .app-rail-nav a > span {
     position: absolute;
     width: 1px;
     height: 1px;
@@ -44,17 +49,6 @@
   }
 }
 
-/* Hesabım ve Kaydedilenler ray ekrandayken yalnız rayda duruyor.
-   Eşik rayın var olduğu yer: 781px. Ray 1260 altında ikona iniyor ama
-   kaybolmuyor, yani o bantta da header'da ikinci bir kopya gerekmiyor —
-   aynı hedefi iki yerde göstermek hangisinin "asıl" olduğunu
-   belirsizleştirirdi. Ray yalnız 780px altında yok; ikizler orada. */
-@media (min-width: 781px) {
-  .header-narrow-only {
-    display: none;
-  }
-}
-
 @media (max-width: 1080px) and (min-width: 781px) {
   .header-inner {
     grid-template-columns: auto minmax(220px, 1fr) auto;