Skip to content
Closed
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
twitter to X and add bsky to community pagegst
  • Loading branch information
winkerVSbecks authored and kylegach committed May 28, 2025
commit b826eca5776acfe7497d6ab94e5a36abc44704d5
42 changes: 27 additions & 15 deletions apps/frontpage/components/community/events.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,8 @@
import {
ChevronSmallRightIcon,
DiscordIcon,
TwitterIcon,
} from '@storybook/icons';
import { ChevronSmallRightIcon, DiscordIcon, XIcon } from '@storybook/icons';
import type { FC } from 'react';
import { Youtube } from '../logos/youtube';
import { Section } from './section';
import { BlueSkyIcon } from '@repo/ui';

export const Events: FC = () => {
return (
Expand Down Expand Up @@ -33,9 +30,27 @@ export const Events: FC = () => {
</div>
</div>
<div className="flex flex-1 gap-4 rounded border border-zinc-300 p-6 md:gap-6 md:p-8 dark:border-slate-700">
<TwitterIcon className="h-10 w-10 text-[#4999e9]" />
<DiscordIcon className="h-10 w-10 text-[#5a65ea]" />
<div className="flex-1">
<h2 className="text-lg font-bold">Follow #announcements chat</h2>
<p className="mb-3 text-zinc-500">
Join our community chat to learn about live events and streams.
</p>
<a
className="flex items-center gap-2 text-blue-500"
href="https://discord.gg/storybook"
>
Chat now
<ChevronSmallRightIcon />
</a>
</div>
</div>
</div>
<div className="mb-8 flex flex-col gap-8 md:flex-row">
<div className="flex flex-1 gap-4 rounded border border-zinc-300 p-6 md:gap-6 md:p-8 dark:border-slate-700">
<BlueSkyIcon className="h-10 w-10" color="#0085ff" />
<div className="flex-1">
<h2 className="text-lg font-bold">Twitter</h2>
<h2 className="text-lg font-bold">Follow on BlueSky</h2>
<p className="mb-3 text-zinc-500">
Get the latest event updates from Storybook maintainers.
</p>
Expand All @@ -48,25 +63,22 @@ export const Events: FC = () => {
</a>
</div>
</div>
</div>
<div className="mb-8 flex flex-col gap-8 md:flex-row">
<div className="flex flex-1 gap-4 rounded border border-zinc-300 p-6 md:gap-6 md:p-8 dark:border-slate-700">
<DiscordIcon className="h-10 w-10 text-[#5a65ea]" />
<XIcon className="h-10 w-10 text-[#000]" />
<div className="flex-1">
<h2 className="text-lg font-bold">Follow #announcements chat</h2>
<h2 className="text-lg font-bold">Follow on X</h2>
<p className="mb-3 text-zinc-500">
Join our community chat to learn about live events and streams.
Get the latest event updates from Storybook maintainers.
</p>
<a
className="flex items-center gap-2 text-blue-500"
href="https://discord.gg/storybook"
href="https://twitter.com/storybookjs"
>
Chat now
Follow now
<ChevronSmallRightIcon />
</a>
</div>
</div>
<div className="flex-1 px-6 md:px-8" />
</div>
</Section>
);
Expand Down