diff --git a/apps/website/public/logos/cisco.svg b/apps/website/public/logos/cisco.svg new file mode 100644 index 000000000..8c7db1474 --- /dev/null +++ b/apps/website/public/logos/cisco.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/cloudflare.svg b/apps/website/public/logos/cloudflare.svg new file mode 100644 index 000000000..3cc28a680 --- /dev/null +++ b/apps/website/public/logos/cloudflare.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/coinbase.svg b/apps/website/public/logos/coinbase.svg new file mode 100644 index 000000000..c95c647ff --- /dev/null +++ b/apps/website/public/logos/coinbase.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/databricks.svg b/apps/website/public/logos/databricks.svg new file mode 100644 index 000000000..be2fd8dfe --- /dev/null +++ b/apps/website/public/logos/databricks.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/elastic.svg b/apps/website/public/logos/elastic.svg new file mode 100644 index 000000000..d01039c19 --- /dev/null +++ b/apps/website/public/logos/elastic.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/gitlab.svg b/apps/website/public/logos/gitlab.svg new file mode 100644 index 000000000..d9e48fba3 --- /dev/null +++ b/apps/website/public/logos/gitlab.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/klarna.svg b/apps/website/public/logos/klarna.svg new file mode 100644 index 000000000..1793bd76b --- /dev/null +++ b/apps/website/public/logos/klarna.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/lyft.svg b/apps/website/public/logos/lyft.svg new file mode 100644 index 000000000..5db87d3fb --- /dev/null +++ b/apps/website/public/logos/lyft.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/rakuten.svg b/apps/website/public/logos/rakuten.svg new file mode 100644 index 000000000..0e8f0e779 --- /dev/null +++ b/apps/website/public/logos/rakuten.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/shopify.svg b/apps/website/public/logos/shopify.svg new file mode 100644 index 000000000..bc2dabcbc --- /dev/null +++ b/apps/website/public/logos/shopify.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/snowflake.svg b/apps/website/public/logos/snowflake.svg new file mode 100644 index 000000000..84063c205 --- /dev/null +++ b/apps/website/public/logos/snowflake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/public/logos/stripe.svg b/apps/website/public/logos/stripe.svg new file mode 100644 index 000000000..7a6e9f2dd --- /dev/null +++ b/apps/website/public/logos/stripe.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/website/src/components/landing/SocialProof.tsx b/apps/website/src/components/landing/SocialProof.tsx index efb7e4159..1468719da 100644 --- a/apps/website/src/components/landing/SocialProof.tsx +++ b/apps/website/src/components/landing/SocialProof.tsx @@ -2,23 +2,23 @@ import { motion } from 'framer-motion'; import { tokens } from '../../../lib/design-tokens'; -const COMPANIES = [ - 'Klarna', - 'Elastic', - 'Rakuten', - 'GitLab', - 'Cloudflare', - 'Coinbase', - 'LinkedIn', - 'Lyft', - 'Cisco', - 'Workday', - 'ServiceNow', - 'Monday', +const LOGOS = [ + { name: 'Klarna', src: '/logos/klarna.svg', width: 80 }, + { name: 'Elastic', src: '/logos/elastic.svg', width: 90 }, + { name: 'Rakuten', src: '/logos/rakuten.svg', width: 85 }, + { name: 'GitLab', src: '/logos/gitlab.svg', width: 32 }, + { name: 'Cloudflare', src: '/logos/cloudflare.svg', width: 34 }, + { name: 'Coinbase', src: '/logos/coinbase.svg', width: 32 }, + { name: 'Stripe', src: '/logos/stripe.svg', width: 70 }, + { name: 'Lyft', src: '/logos/lyft.svg', width: 50 }, + { name: 'Cisco', src: '/logos/cisco.svg', width: 70 }, + { name: 'Shopify', src: '/logos/shopify.svg', width: 32 }, + { name: 'Databricks', src: '/logos/databricks.svg', width: 32 }, + { name: 'Snowflake', src: '/logos/snowflake.svg', width: 32 }, ]; /** Duplicate for seamless infinite scroll */ -const SCROLL_ITEMS = [...COMPANIES, ...COMPANIES]; +const SCROLL_ITEMS = [...LOGOS, ...LOGOS]; export function SocialProof() { return ( @@ -54,17 +54,17 @@ export function SocialProof() { WebkitBackdropFilter: `blur(${tokens.glass.blur})`, border: `1px solid ${tokens.glass.border}`, overflow: 'hidden', - padding: '32px 0', + padding: '28px 0', }}> {/* Fade edges */}
@@ -74,30 +74,41 @@ export function SocialProof() { style={{ display: 'flex', alignItems: 'center', - gap: 72, + gap: 56, width: 'max-content', paddingLeft: 48, paddingRight: 48, }} > - {SCROLL_ITEMS.map((company, i) => ( - ( +