mmintelandClaude Opus 5.5
ca0eddfde8
On a phone the homepage was about 29 screens long; it is now about 22. The desktop layout is unchanged to the pixel. Lists of equal items (automation notes, project fit, principles, reasons for a web presentation, by hand vs. automated) are swiped through side by side (SwipeRow) instead of stacked. The four service cards form a compact 2x2 grid, step lists spell out only the current step, the workflow legend and the per-project task lists are left out, and sections use less padding. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
19 lines
630 B
TypeScript
19 lines
630 B
TypeScript
import * as React from "react";
|
|
|
|
/**
|
|
* SwipeRow: on phones the items stand side by side and are swiped through,
|
|
* with the next one peeking in; from tablet width on they fall back into the
|
|
* grid given by `className`. It keeps long lists of equal items from
|
|
* stretching the page on a small screen. Styles: `swipe-row` in globals.css.
|
|
*/
|
|
export const SwipeRow: React.FC<{
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}> = ({ className = "", children }) => (
|
|
<div className={`swipe-row ${className}`}>
|
|
{React.Children.map(children, (child) => (
|
|
<div className="swipe-slide">{child}</div>
|
|
))}
|
|
</div>
|
|
);
|