diff --git a/docs/app/(home)/components/TweetWall/TweetWall.module.css b/docs/app/(home)/components/TweetWall/TweetWall.module.css index 23dc7a915..904b37808 100644 --- a/docs/app/(home)/components/TweetWall/TweetWall.module.css +++ b/docs/app/(home)/components/TweetWall/TweetWall.module.css @@ -78,14 +78,16 @@ } .column { - flex: 0 0 200px; + flex: 0 0 230px; } - /* Render the card at 250px then scale the whole box down with zoom (shrinks the - layout box too, so columns stay tight and the loop has no gaps). 250 * 0.8 = 200. */ + /* Render the card at 320px then scale the whole box down with zoom (shrinks the + layout box too, so columns stay tight and the loop has no gaps). 320 * 0.72 ≈ 230. + The wide base width lets tweet text breathe so cards aren't squeezed/too tall, + while the 0.72 scale keeps the cards compact. */ .slot { - width: 250px; - zoom: 0.8; + width: 320px; + zoom: 0.72; margin-bottom: 0.625rem; } } diff --git a/docs/app/(home)/openclaw-os/page.tsx b/docs/app/(home)/openclaw-os/page.tsx index 1232f807e..3b65ca24b 100644 --- a/docs/app/(home)/openclaw-os/page.tsx +++ b/docs/app/(home)/openclaw-os/page.tsx @@ -59,13 +59,13 @@ export default function OpenClawOSPage() { /> } align="left" - desktopPreviewImage="/openclaw-os/hero-light.svg" - desktopPreviewImageDark="/openclaw-os/hero-dark.svg" + desktopPreviewImage="/openclaw-os/hero-light.webp" + desktopPreviewImageDark="/openclaw-os/hero-dark.webp" desktopPreviewImageAlt="OpenClaw OS workspace" desktopPreviewImageWidth={1568} desktopPreviewImageHeight={940} - mobilePreviewImage="/openclaw-os/hero-light.svg" - mobilePreviewImageDark="/openclaw-os/hero-dark.svg" + mobilePreviewImage="/openclaw-os/hero-light.webp" + mobilePreviewImageDark="/openclaw-os/hero-dark.webp" mobilePreviewImageAlt="OpenClaw OS workspace" mobilePreviewImageWidth={1568} mobilePreviewImageHeight={940} diff --git a/docs/app/(home)/sections/HeroSection/HeroSection.tsx b/docs/app/(home)/sections/HeroSection/HeroSection.tsx index 530c720be..f9c471645 100644 --- a/docs/app/(home)/sections/HeroSection/HeroSection.tsx +++ b/docs/app/(home)/sections/HeroSection/HeroSection.tsx @@ -41,14 +41,14 @@ function commandVariants(command: string): CommandVariant[] { } const DESKTOP_HERO_IMAGE = { - light: "/homepage/hero-web.svg", - dark: "/homepage/hero-web-dark.svg", + light: "/homepage/hero-web.webp", + dark: "/homepage/hero-web-dark.webp", width: 768, height: 454, } as const; const MOBILE_HERO_IMAGE = { - light: "/homepage/mobile-hero-light.svg", - dark: "/homepage/mobile-hero-dark.svg", + light: "/homepage/mobile-hero-light.webp", + dark: "/homepage/mobile-hero-dark.webp", width: 333, height: 440, } as const; diff --git a/docs/app/(home)/sections/TweetWallSection/TweetWallSection.module.css b/docs/app/(home)/sections/TweetWallSection/TweetWallSection.module.css index b54badeb5..d43901817 100644 --- a/docs/app/(home)/sections/TweetWallSection/TweetWallSection.module.css +++ b/docs/app/(home)/sections/TweetWallSection/TweetWallSection.module.css @@ -27,15 +27,46 @@ font-size: 0.9375rem; } +.statText { + min-width: 0; +} + .statNumber { font-weight: 600; font-variant-numeric: tabular-nums; + /* Keep "1 Million+" / "7,657" from ever splitting across lines. */ + white-space: nowrap; } .statLabel { color: var(--openui-text-neutral-secondary); } +/* Narrow phones: stack the two stats and let each label wrap as flowing text + right after its number, so the icon/number/label never get stranded apart. */ +@media (max-width: 480px) { + .stats { + flex-direction: column; + align-items: center; + gap: 0.625rem; + } + + /* Render each stat as one centered line of text that wraps as a unit, with + the icon inline at the start — so the icon hugs its number instead of being + stranded, and nothing gets pushed apart on narrow screens. */ + .statChip { + display: block; + max-width: 100%; + text-align: center; + } + + .statChip svg { + display: inline-block; + vertical-align: middle; + margin-right: 0.35rem; + } +} + @media (min-width: 1024px) { .section { padding-inline: 2rem; diff --git a/docs/app/(home)/sections/TweetWallSection/TweetWallStats.tsx b/docs/app/(home)/sections/TweetWallSection/TweetWallStats.tsx index 0fe5cad06..e421cc505 100644 --- a/docs/app/(home)/sections/TweetWallSection/TweetWallStats.tsx +++ b/docs/app/(home)/sections/TweetWallSection/TweetWallStats.tsx @@ -20,13 +20,17 @@ export function TweetWallStats() {
- {stars.toLocaleString()} - stars + + {stars.toLocaleString()}{" "} + stars + - 1 Million+ - downloads across all packages + + 1 Million+{" "} + downloads across all packages +
); diff --git a/docs/public/homepage/hero-web-dark.svg b/docs/public/homepage/hero-web-dark.svg deleted file mode 100644 index 42a6378f4..000000000 --- a/docs/public/homepage/hero-web-dark.svg +++ /dev/null @@ -1,334 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/homepage/hero-web-dark.webp b/docs/public/homepage/hero-web-dark.webp new file mode 100644 index 000000000..29d1723a9 Binary files /dev/null and b/docs/public/homepage/hero-web-dark.webp differ diff --git a/docs/public/homepage/hero-web.svg b/docs/public/homepage/hero-web.svg deleted file mode 100644 index c4085d417..000000000 --- a/docs/public/homepage/hero-web.svg +++ /dev/null @@ -1,348 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/homepage/hero-web.webp b/docs/public/homepage/hero-web.webp new file mode 100644 index 000000000..b5cb85da5 Binary files /dev/null and b/docs/public/homepage/hero-web.webp differ diff --git a/docs/public/homepage/mobile-hero-dark.svg b/docs/public/homepage/mobile-hero-dark.svg deleted file mode 100644 index f9bfed421..000000000 --- a/docs/public/homepage/mobile-hero-dark.svg +++ /dev/null @@ -1,168 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/homepage/mobile-hero-dark.webp b/docs/public/homepage/mobile-hero-dark.webp new file mode 100644 index 000000000..73f591666 Binary files /dev/null and b/docs/public/homepage/mobile-hero-dark.webp differ diff --git a/docs/public/homepage/mobile-hero-light.svg b/docs/public/homepage/mobile-hero-light.svg deleted file mode 100644 index 37f9e536e..000000000 --- a/docs/public/homepage/mobile-hero-light.svg +++ /dev/null @@ -1,188 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/homepage/mobile-hero-light.webp b/docs/public/homepage/mobile-hero-light.webp new file mode 100644 index 000000000..581f83bb7 Binary files /dev/null and b/docs/public/homepage/mobile-hero-light.webp differ diff --git a/docs/public/openclaw-os/hero-dark.svg b/docs/public/openclaw-os/hero-dark.svg deleted file mode 100644 index a68b452e6..000000000 --- a/docs/public/openclaw-os/hero-dark.svg +++ /dev/null @@ -1,948 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/openclaw-os/hero-dark.webp b/docs/public/openclaw-os/hero-dark.webp new file mode 100644 index 000000000..74e1d4ff7 Binary files /dev/null and b/docs/public/openclaw-os/hero-dark.webp differ diff --git a/docs/public/openclaw-os/hero-light.svg b/docs/public/openclaw-os/hero-light.svg deleted file mode 100644 index 0861ead51..000000000 --- a/docs/public/openclaw-os/hero-light.svg +++ /dev/null @@ -1,948 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/docs/public/openclaw-os/hero-light.webp b/docs/public/openclaw-os/hero-light.webp new file mode 100644 index 000000000..1eef93ffc Binary files /dev/null and b/docs/public/openclaw-os/hero-light.webp differ