diff --git a/app/globals.css b/app/globals.css index 9a09eae9..185f70e3 100644 --- a/app/globals.css +++ b/app/globals.css @@ -538,6 +538,21 @@ pre.shiki { padding-bottom: var(--safe-padding-bottom); } +/* animation for atmosphere logo carousel */ +@keyframes logo-scroll { + 0% { + transform: translateX(0); + } + 100% { + transform: translateX(-50%); + } +} + +.logo-scroll-track { + animation: logo-scroll 50s linear infinite; + will-change: transform; +} + /* animation for new star in publish success illustration */ @keyframes new-star-animation { 0% { diff --git a/components/LoginButton.tsx b/components/LoginButton.tsx index 5d6737ef..20195104 100644 --- a/components/LoginButton.tsx +++ b/components/LoginButton.tsx @@ -106,7 +106,7 @@ export const LoginContent = (props: { - What's that? + What's the Atmosphere? } /> diff --git a/components/Subscribe/HandleSubscribe.tsx b/components/Subscribe/HandleSubscribe.tsx index 1b7ae6ce..dea8b723 100644 --- a/components/Subscribe/HandleSubscribe.tsx +++ b/components/Subscribe/HandleSubscribe.tsx @@ -4,13 +4,28 @@ import { BlueskyTiny } from "components/Icons/BlueskyTiny"; import { Popover } from "components/Popover"; import Link from "next/link"; import { HandleInput } from "./HandleInput"; -import { - LogoBlacksky, - LogoBluesky, - LogoEurosky, - LogoLeaflet, - LogoTangled, -} from "./Logos"; +const logos = { + Anisota: "/logos/anisota.svg", + Blacksky: "/logos/blacksky.svg", + Blento: "/logos/blento.svg", + Bluesky: "/logos/bluesky.svg", + Cartridge: "/logos/cartridge.svg", + Eurosky: "/logos/eurosky.svg", + Graze: "/logos/graze.svg", + Leaflet: "/logos/leaflet.svg", + Margin: "/logos/margin.svg", + Offprint: "/logos/offprint.svg", + Pckt: "/logos/pckt.svg", + pdsls: "/logos/pdsls.svg", + "plyr.fm": "/logos/plyr.fm.svg", + Popfeed: "/logos/popfeed.svg", + Roomy: "/logos/roomy.svg", + Semble: "/logos/semble.svg", + Sill: "/logos/sill.svg", + Spark: "/logos/spark.svg", + Surf: "/logos/surf.svg", + Tangled: "/logos/tangled.svg", +}; import { Separator } from "components/Layout"; @@ -67,7 +82,6 @@ export const LinkHandle = (props: { compact?: boolean }) => { ); }; - export const HandleInputandOAuth = (props: { link?: boolean; compact?: boolean; @@ -118,7 +132,7 @@ export const AtSubscribeSuccess = (props: {}) => { export const AtmosphericHandleInfo = (props: { trigger?: React.ReactNode }) => { return ( { ) } > -
- The Atmosphere is a family of apps that you can access with a single - account +
+ The Atmosphere is a growing ecosystem of social apps, like Leaflet and + Bluesky. +
+
+
+ One account gets you into all of them.
-
Apps like...
-
- } name="Leaflet" /> - } name="Bluesky" /> - } name="Blacksky" /> - } name="Eurosky" /> - } name="Tangled" /> +
+ Apps on the Atmosphere! +
+
+
+ {( + [ + "Leaflet", "Bluesky", "Blacksky", "Eurosky", "Tangled", + "Semble", "Surf", "Spark", "Pckt", "pdsls", "plyr.fm", + "Popfeed", "Roomy", "Sill", "Offprint", "Margin", + "Anisota", "Blento", "Cartridge", "Graze", + "Leaflet", "Bluesky", "Blacksky", "Eurosky", "Tangled", + "Semble", "Surf", "Spark", "Pckt", "pdsls", "plyr.fm", + "Popfeed", "Roomy", "Sill", "Offprint", "Margin", + "Anisota", "Blento", "Cartridge", "Graze", + ] as (keyof typeof logos)[] + ).map((name, i) => ( + + ))} +
- + Sign up via Bluesky! ); }; -const AtApp = (props: { logo: React.ReactNode; name: string }) => { +const AtApp = (props: { logo: string; name: string }) => { return ( -
-
{props.logo}
+
+ {props.name} {props.name}
); diff --git a/components/Subscribe/Logos.tsx b/components/Subscribe/Logos.tsx deleted file mode 100644 index 385bcb6a..00000000 --- a/components/Subscribe/Logos.tsx +++ /dev/null @@ -1,96 +0,0 @@ -export const LogoLeaflet = () => { - return ( - - - - - ); -}; - -export const LogoBluesky = () => { - return ( - - - - ); -}; - -export const LogoBlacksky = () => { - return ( - - - - ); -}; - -export const LogoEurosky = () => { - return ( - - - - - ); -}; - -export const LogoTangled = () => { - return ( - - - - ); -}; diff --git a/public/Logos/anisota.svg b/public/Logos/anisota.svg new file mode 100644 index 00000000..74ca4e72 --- /dev/null +++ b/public/Logos/anisota.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/public/Logos/blacksky.svg b/public/Logos/blacksky.svg new file mode 100644 index 00000000..bfdf1bcc --- /dev/null +++ b/public/Logos/blacksky.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/blento.svg b/public/Logos/blento.svg new file mode 100644 index 00000000..276521b3 --- /dev/null +++ b/public/Logos/blento.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/Logos/bluesky.svg b/public/Logos/bluesky.svg new file mode 100644 index 00000000..1e9615f1 --- /dev/null +++ b/public/Logos/bluesky.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/cartridge.svg b/public/Logos/cartridge.svg new file mode 100644 index 00000000..018d9ac4 --- /dev/null +++ b/public/Logos/cartridge.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/Logos/eurosky.svg b/public/Logos/eurosky.svg new file mode 100644 index 00000000..3ffb2665 --- /dev/null +++ b/public/Logos/eurosky.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/Logos/graze.svg b/public/Logos/graze.svg new file mode 100644 index 00000000..1c3c1684 --- /dev/null +++ b/public/Logos/graze.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/leaflet.svg b/public/Logos/leaflet.svg new file mode 100644 index 00000000..3f603509 --- /dev/null +++ b/public/Logos/leaflet.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/Logos/margin.svg b/public/Logos/margin.svg new file mode 100644 index 00000000..f3973ad0 --- /dev/null +++ b/public/Logos/margin.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/offprint.svg b/public/Logos/offprint.svg new file mode 100644 index 00000000..2035465e --- /dev/null +++ b/public/Logos/offprint.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/pckt.svg b/public/Logos/pckt.svg new file mode 100644 index 00000000..5aed9445 --- /dev/null +++ b/public/Logos/pckt.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/public/Logos/pdsls.svg b/public/Logos/pdsls.svg new file mode 100644 index 00000000..5e5cc1f3 --- /dev/null +++ b/public/Logos/pdsls.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/plyr.fm.svg b/public/Logos/plyr.fm.svg new file mode 100644 index 00000000..240bbb3d --- /dev/null +++ b/public/Logos/plyr.fm.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/Logos/popfeed.svg b/public/Logos/popfeed.svg new file mode 100644 index 00000000..77fae9a1 --- /dev/null +++ b/public/Logos/popfeed.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/roomy.svg b/public/Logos/roomy.svg new file mode 100644 index 00000000..af2fa965 --- /dev/null +++ b/public/Logos/roomy.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/Logos/semble.svg b/public/Logos/semble.svg new file mode 100644 index 00000000..dc8980aa --- /dev/null +++ b/public/Logos/semble.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/sill.svg b/public/Logos/sill.svg new file mode 100644 index 00000000..5a9d6bcd --- /dev/null +++ b/public/Logos/sill.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/spark.svg b/public/Logos/spark.svg new file mode 100644 index 00000000..2bd80893 --- /dev/null +++ b/public/Logos/spark.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/surf.svg b/public/Logos/surf.svg new file mode 100644 index 00000000..57d5b1f6 --- /dev/null +++ b/public/Logos/surf.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Logos/tangled.svg b/public/Logos/tangled.svg new file mode 100644 index 00000000..46e3e8f0 --- /dev/null +++ b/public/Logos/tangled.svg @@ -0,0 +1,3 @@ + + +