fix(whats-new): 375 Last-30 lines clear composer (#802)

src/__tests__/identity.test.ts

@@ -13,7 +13,10 @@ const files = [
 ];
 
 describe('identity copy', () => {
-  const sources = files.map((path) => ({ path, text: readFileSync(path, 'utf8') }));
+  const sources = files.map((path) => ({
+    path,
+    text: readFileSync(path, 'utf8'),
+  }));
 
   it('does not use Strategic Product Leader in about, biography, meta, llms.txt, or the twin prompt', () => {
     for (const { path, text } of sources) {
@@ -2642,4 +2645,28 @@ describe('identity copy', () => {
     expect(home).toContain('https://www.linkedin.com/in/alehar/');
     expect(home).not.toContain('mailto:');
   });
+
+  it('tightens What’s New narrow-viewport spacing so Last-30 lines clear the composer (#802)', () => {
+    const page = readFileSync('src/pages/whats-new.astro', 'utf8');
+    const glance = readFileSync('src/utils/whats-new-glance.ts', 'utf8');
+    expect(page).toContain('@media (max-width: 30em)');
+    expect(page).toMatch(/@media \(max-width: 30em\)[\s\S]*?\.glance\s*\{[\s\S]*?gap:\s*0\.5rem/);
+    expect(page).toMatch(
+      /@media \(max-width: 30em\)[\s\S]*?\.this-week,\s*\.last-30[\s\S]*?padding:\s*0\.6rem 1rem/
+    );
+    expect(page).toMatch(
+      /@media \(max-width: 30em\)[\s\S]*?\.last-30 \.clusters[\s\S]*?gap:\s*0\.45rem/
+    );
+    expect(page).toContain('This week');
+    expect(page).toContain('Last 30 days');
+    expect(page).toContain('What you can see on this site lately.');
+    expect(page).toContain('Full history on GitHub');
+    expect(page).toContain('@media (min-width: 50em)');
+    expect(page).toContain('flex-direction: row');
+    expect(glance).toContain('DROP_PATTERN');
+    expect(glance).toMatch(/\\bengine\\b/);
+    expect(glance).toMatch(/\\bjules\\b/);
+    expect(glance).toContain('WEEK_MS');
+    expect(glance).toContain('MONTH_MS');
+  });
 });

src/pages/whats-new.astro

@@ -223,4 +223,38 @@ const schema = {
     outline-offset: 4px;
     border-radius: 0.25rem;
   }
+
+  /* Narrow phone (375): compress glance rhythm so Last-30 outcome lines clear the docked composer. */
+  @media (max-width: 30em) {
+    .glance {
+      gap: 0.5rem;
+    }
+
+    .this-week,
+    .last-30 {
+      padding: 0.6rem 1rem;
+    }
+
+    .this-week h2,
+    .last-30 h2 {
+      margin-bottom: 0.35rem;
+    }
+
+    .last-30 .clusters {
+      gap: 0.45rem;
+    }
+
+    .group h3 {
+      margin-bottom: 0.25rem;
+    }
+
+    .this-week li,
+    .last-30 li {
+      margin-bottom: 0.15rem;
+    }
+
+    .history {
+      margin-top: 0.25rem;
+    }
+  }
 </style>