diff --git a/src/assets/boston-ts-club.svg b/src/assets/boston-ts-club.svg new file mode 100644 index 0000000..158a90d --- /dev/null +++ b/src/assets/boston-ts-club.svg @@ -0,0 +1,23 @@ + + + + + + + + \ No newline at end of file diff --git a/src/assets/michigan-typescript.png b/src/assets/michigan-typescript.png new file mode 100644 index 0000000..4162d73 Binary files /dev/null and b/src/assets/michigan-typescript.png differ diff --git a/src/assets/youtube.svg b/src/assets/youtube.svg new file mode 100644 index 0000000..9d17cf4 --- /dev/null +++ b/src/assets/youtube.svg @@ -0,0 +1,16 @@ + + + + diff --git a/src/components/AboutUs.astro b/src/components/AboutUs.astro index 8ac6903..b0a1d10 100644 --- a/src/components/AboutUs.astro +++ b/src/components/AboutUs.astro @@ -1,12 +1,57 @@ --- import joshGoldberg from "~/assets/josh-goldberg.png"; import dimitriMitropulous from "~/assets/dimitri-mitropoulos.jpg"; +import bostonTSClub from "~/assets/boston-ts-club.svg"; +import michiganTypeScript from "~/assets/michigan-typescript.png"; import AnchorButton from "./AnchorButton.astro"; import BodyText from "./BodyText.astro"; import FullSection from "./FullSection.astro"; import Heading from "./Heading.astro"; -import Speaker from "./Speaker.astro"; +import Bio, { Props as BioProps } from "./Bio.astro"; import SquiggleFlanked from "./SquiggleFlanked.astro"; + +const bios: Omit[] = [ + { + links: { + bluesky: "bostonts.club", + linkedin: "https://www.linkedin.com/groups/13008308", + mastodon: "https://mastodon.social/@BostonTS", + twitter: "BosTypeScript", + website: "https://bostonts.club", + }, + name: "Boston TS Club", + photo: bostonTSClub, + }, + { + links: { + github: "dimitropoulos", + linkedin: "https://linkedin.com/in/dimitrimitropoulos", + }, + name: "Dimitri Mitropoulos", + photo: dimitriMitropulous, + }, + { + links: { + bluesky: "joshuakgoldberg.com", + github: "JoshuaKGoldberg", + mastodon: "fosstodon.org/@JoshuaKGoldberg", + twitter: "JoshuaKGoldberg", + website: "https://joshuakgoldberg.com", + }, + name: "Josh Goldberg", + photo: joshGoldberg, + }, + { + links: { + bluesky: "michigantypescript.com", + mastodon: "https://fosstodon.org/@MichiganTypeScript", + twitter: "MiTypeScript", + youtube: "MichiganTypeScript", + }, + name: "Michigan TypeScript", + photo: michiganTypeScript, + }, +] as const; --- @@ -28,27 +73,7 @@ import SquiggleFlanked from "./SquiggleFlanked.astro"; background or resources.
- - + {bios.map((bio) => )}
Volunteer at SquiggleConf
@@ -69,9 +94,21 @@ import SquiggleFlanked from "./SquiggleFlanked.astro"; .bios { display: flex; + flex-wrap: wrap; justify-content: center; gap: 3rem; margin: 3rem 0 1.5rem; width: 100%; + padding: 0 var(--widthBodyPadding); + } + + .about-us-bio { + min-width: 40%; + } + + @media (min-width: 819px) { + .about-us-bio { + min-width: unset; + } } diff --git a/src/components/Speaker.astro b/src/components/Bio.astro similarity index 77% rename from src/components/Speaker.astro rename to src/components/Bio.astro index 280ce25..78db365 100644 --- a/src/components/Speaker.astro +++ b/src/components/Bio.astro @@ -5,6 +5,7 @@ import { Image } from "astro:assets"; import BioLinks, { BioLinksPlatforms } from "./BioLinks.astro"; export interface Props { + class?: string; links: BioLinksPlatforms; name: string; photo: ImageMetadata; @@ -12,23 +13,29 @@ export interface Props { size: "medium" | "large"; } -const { links, name, photo, position, size } = Astro.props; +const { + class: className, + links, + name, + photo, + position, + size, + ...rest +} = Astro.props; ---
  • - +
    {name}
    {position &&
    {position}
    }