diff --git a/package-lock.json b/package-lock.json index ca8c2349b3..9c22886668 100644 --- a/package-lock.json +++ b/package-lock.json @@ -28209,7 +28209,7 @@ }, "packages/api": { "name": "@web3-storage/api", - "version": "7.9.0", + "version": "7.9.1", "license": "(Apache-2.0 OR MIT)", "dependencies": { "@aws-sdk/client-s3": "^3.53.1", diff --git a/packages/website/pages/pricing.js b/packages/website/pages/pricing.js index 1d4ac96ba6..908d2e60a7 100644 --- a/packages/website/pages/pricing.js +++ b/packages/website/pages/pricing.js @@ -11,6 +11,26 @@ import Cluster1 from 'public/images/index/cluster-1.png'; import Button from 'ZeroComponents/button/button'; import GeneralPageData from '../content/pages/general.json'; +const logos = [ + { src: 'nft-storage.png', alt: 'NFT Storage' }, + { src: 'protocol-labs-logo-black.svg', alt: 'Protocol Labs' }, + { src: 'filecoin.png', alt: 'Filecoin' }, + { src: 'fileverse.png', alt: 'Fileverse' }, + { src: '3sStudio.png', alt: '3sStudio' }, + { src: 'glitter.png', alt: 'Glitter' }, + { src: 'fleek.png', alt: 'Fleek' }, + { src: 'pollinationsai.png', alt: 'Pollinations AI' }, + { src: 'opensea.png', alt: 'OpenSea' }, + { src: 'magic-eden.png', alt: 'magic eden' }, + { src: 'rarible.svg', alt: 'Rarible' }, + { src: 'NFTPort.png', alt: 'NFTPort' }, + { src: 'metaplex.png', alt: 'Metaplex' }, + { src: 'project-galaxy.png', alt: 'Project Galaxy' }, + { src: 'tatum.png', alt: 'Tatum' }, + { src: 'teia.png', alt: 'Teia' }, + { src: 'holaplex.svg', alt: 'Holaplex' }, +]; + const PricingHeader = () => ( <>
@@ -53,18 +73,21 @@ const PricingHeader = () => (
-
-
- NFT Storage -
-
-
- Protocol Labs -
-
-
- Filecoin -
+
+
+
+ {logos.map(logo => ( +
+ {logo.alt} +
+ ))} + {/* repeat the set for continous css-only scroll */} + {logos.map(logo => ( +
+ {logo.alt} +
+ ))} +
diff --git a/packages/website/pages/pricing.scss b/packages/website/pages/pricing.scss index 27f6dec47d..70819b032a 100644 --- a/packages/website/pages/pricing.scss +++ b/packages/website/pages/pricing.scss @@ -563,9 +563,52 @@ li.pricing-bullet-3 { gap: 0 5rem; } -@media only screen and (max-width: 1000px) { - #section_trusted_by_logos .wrapping-logos { - gap: 1rem 50rem; +#section_trusted_by_logos .wrapping-logos.carousel { + display: flex; + flex-flow: row wrap; + max-width: 100%; +} + +#section_trusted_by_logos .wrapping-logos-inner { + overflow: hidden; + position: relative; + --no-of-slides: 17; + --slides-in-view: 6; + --slide-width: 250px; + --iteration-time: 30s; + width: calc(2 * var(--no-of-slides)); +} + +#section_trusted_by_logos .wrapping-logos-images { + display: flex; + align-items: center; + width: calc(var(--slides-in-view) * var(--slide-width)); +} + +#section_trusted_by_logos .wrapping-logos-inner .image-block { + will-change: transform; + animation: translatestf var(--iteration-time) linear infinite forwards; + min-width: var(--slide-width); + max-width: var(--slide-width); + width: var(--slide-width); + height: 80px; + display: flex; + align-items: center; + justify-content: center; + padding: 0 50px; + box-sizing: border-box; +} + +#section_trusted_by_logos .wrapping-logos-inner .image-block img { + border-radius: 5px; +} + +@keyframes translatestf { + 0% { + transform: translateX(0%); + } + 100% { + transform: translateX(calc(var(--slide-width) * var(--no-of-slides) * -1)); } } @@ -573,6 +616,12 @@ li.pricing-bullet-3 { width: auto !important; height: auto !important; } +#section_trusted_by_logos .image-block img[src$='.svg'] { + min-width: var(--slide-width); + max-width: var(--slide-width); + padding: 0 50px; + box-sizing: border-box; +} // --------------------------------------------------------------- Section [FAQ] #tiered_pricing_section_FAQ_info { diff --git a/packages/website/public/images/logos/3sStudio.png b/packages/website/public/images/logos/3sStudio.png new file mode 100644 index 0000000000..31a6f88e8f Binary files /dev/null and b/packages/website/public/images/logos/3sStudio.png differ diff --git a/packages/website/public/images/logos/NFTPort.png b/packages/website/public/images/logos/NFTPort.png new file mode 100644 index 0000000000..f24a283c46 Binary files /dev/null and b/packages/website/public/images/logos/NFTPort.png differ diff --git a/packages/website/public/images/logos/filecoin.png b/packages/website/public/images/logos/filecoin.png new file mode 100644 index 0000000000..c7bfb454f9 Binary files /dev/null and b/packages/website/public/images/logos/filecoin.png differ diff --git a/packages/website/public/images/logos/fileverse.png b/packages/website/public/images/logos/fileverse.png new file mode 100644 index 0000000000..b8c869d807 Binary files /dev/null and b/packages/website/public/images/logos/fileverse.png differ diff --git a/packages/website/public/images/logos/fleek.png b/packages/website/public/images/logos/fleek.png new file mode 100644 index 0000000000..b9f4494991 Binary files /dev/null and b/packages/website/public/images/logos/fleek.png differ diff --git a/packages/website/public/images/logos/glitter.png b/packages/website/public/images/logos/glitter.png new file mode 100644 index 0000000000..0371bcdbaf Binary files /dev/null and b/packages/website/public/images/logos/glitter.png differ diff --git a/packages/website/public/images/logos/holaplex.svg b/packages/website/public/images/logos/holaplex.svg new file mode 100644 index 0000000000..e82963d6b3 --- /dev/null +++ b/packages/website/public/images/logos/holaplex.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/website/public/images/logos/magic-eden.png b/packages/website/public/images/logos/magic-eden.png new file mode 100644 index 0000000000..dca05484c6 Binary files /dev/null and b/packages/website/public/images/logos/magic-eden.png differ diff --git a/packages/website/public/images/logos/metaplex.png b/packages/website/public/images/logos/metaplex.png new file mode 100644 index 0000000000..743d2cea36 Binary files /dev/null and b/packages/website/public/images/logos/metaplex.png differ diff --git a/packages/website/public/images/logos/nft-storage.png b/packages/website/public/images/logos/nft-storage.png new file mode 100644 index 0000000000..e9a370313d Binary files /dev/null and b/packages/website/public/images/logos/nft-storage.png differ diff --git a/packages/website/public/images/logos/opensea.png b/packages/website/public/images/logos/opensea.png new file mode 100644 index 0000000000..685068adb5 Binary files /dev/null and b/packages/website/public/images/logos/opensea.png differ diff --git a/packages/website/public/images/logos/pollinationsai.png b/packages/website/public/images/logos/pollinationsai.png new file mode 100644 index 0000000000..ce421c4da7 Binary files /dev/null and b/packages/website/public/images/logos/pollinationsai.png differ diff --git a/packages/website/public/images/logos/project-galaxy.png b/packages/website/public/images/logos/project-galaxy.png new file mode 100644 index 0000000000..356dd4cebd Binary files /dev/null and b/packages/website/public/images/logos/project-galaxy.png differ diff --git a/packages/website/public/images/logos/protocol-labs-logo-black.svg b/packages/website/public/images/logos/protocol-labs-logo-black.svg new file mode 100644 index 0000000000..509ea63459 --- /dev/null +++ b/packages/website/public/images/logos/protocol-labs-logo-black.svg @@ -0,0 +1,44 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/website/public/images/logos/rarible.svg b/packages/website/public/images/logos/rarible.svg new file mode 100644 index 0000000000..229b46b2d8 --- /dev/null +++ b/packages/website/public/images/logos/rarible.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/packages/website/public/images/logos/tatum.png b/packages/website/public/images/logos/tatum.png new file mode 100644 index 0000000000..c931899033 Binary files /dev/null and b/packages/website/public/images/logos/tatum.png differ diff --git a/packages/website/public/images/logos/teia.png b/packages/website/public/images/logos/teia.png new file mode 100644 index 0000000000..eacf44453b Binary files /dev/null and b/packages/website/public/images/logos/teia.png differ diff --git a/packages/website/tsconfig.json b/packages/website/tsconfig.json index 4807b1212d..77caa80ce9 100644 --- a/packages/website/tsconfig.json +++ b/packages/website/tsconfig.json @@ -4,7 +4,11 @@ "allowJs": true, "checkJs": true, "target": "esnext", - "lib": ["ESNext", "DOM", "DOM.Iterable"], + "lib": [ + "ESNext", + "DOM", + "DOM.Iterable" + ], "strict": true, "moduleResolution": "node", "sourceMap": true, @@ -20,16 +24,37 @@ "noImplicitAny": false, "baseUrl": "./", "paths": { - "ZeroComponents/*": ["modules/zero/components/*"], - "ZeroHooks/*": ["modules/zero/hooks/*"], - "web3.storage": ["../client"] + "ZeroComponents/*": [ + "modules/zero/components/*" + ], + "ZeroHooks/*": [ + "modules/zero/hooks/*" + ], + "web3.storage": [ + "../client" + ] }, "incremental": true }, - "include": ["lib", "pages", "components", "content", "hooks", "modules", "store", "declaration.d.ts", "tests/**/*", "scripts", "playwright.config.ts"], + "include": [ + "lib", + "pages", + "components", + "content", + "hooks", + "modules", + "store", + "declaration.d.ts", + "tests/**/*", + "scripts", + "playwright.config.ts" + ], "references": [ { "path": "../client" } + ], + "exclude": [ + "node_modules" ] }