diff --git a/lib/ui/components/icons/Icon.js b/lib/ui/components/icons/Icon.js index f2a08799..b4db2189 100644 --- a/lib/ui/components/icons/Icon.js +++ b/lib/ui/components/icons/Icon.js @@ -2,6 +2,8 @@ import { shape, string } from "prop-types"; import React from "react"; import styled from "styled-components"; +import { FaLink } from "react-icons/fa"; +import { SiBluesky, SiMastodon } from "react-icons/si"; import { defaultThm } from "ui/themes"; import { icomoon } from "assets/fonts"; @@ -30,11 +32,47 @@ const IconEl = styled.i` } `; -const Icon = props => ( - - {props.text ? {props.text} : null} - -); +const Icon = props => { + switch (props.name) { + // I'm not going to generate a new IcoMoon font for these + // and in any case they don't have Bluesky or Mastdon readily + // available anyway. Generating icons with react-icons is 100% + // more flexible + case 'bluesky': + return ( + + + + ) + case 'mastodon': + return ( + + + + ) + case 'website': + return ( + + + + ) + default: + return ( + + {props.text ? {props.text} : null} + + ) + } +}; Icon.propTypes = { name: string.isRequired, diff --git a/lib/ui/templates/PeopleTpl.js b/lib/ui/templates/PeopleTpl.js index 7f3693a1..8439cd12 100644 --- a/lib/ui/templates/PeopleTpl.js +++ b/lib/ui/templates/PeopleTpl.js @@ -195,12 +195,15 @@ export const pageQuery = graphql` id html frontmatter { + bluesky fname github lname + mastodon quote score twitter + website uid avatar { childImageSharp { @@ -235,12 +238,15 @@ export const pageQuery = graphql` id html frontmatter { + bluesky fname github lname + mastodon quote score twitter + website uid avatar { childImageSharp { @@ -275,12 +281,15 @@ export const pageQuery = graphql` id html frontmatter { + bluesky fname github lname + mastodon quote score twitter + website uid avatar { childImageSharp { diff --git a/lib/ui/templates/ofPeople/Person.js b/lib/ui/templates/ofPeople/Person.js index 192b31cc..791e13f6 100644 --- a/lib/ui/templates/ofPeople/Person.js +++ b/lib/ui/templates/ofPeople/Person.js @@ -69,7 +69,16 @@ const PersonLinks = styled.div` const Member = props => { const { defaultAvatar } = props; const { frontmatter } = props.data; - const { avatar, fname, github, lname, twitter } = frontmatter; + const { + avatar, + bluesky, + fname, + github, + lname, + mastodon, + twitter, + website + } = frontmatter; return ( @@ -82,12 +91,42 @@ const Member = props => { {fname} {lname} + {website ? ( + e.stopPropagation()} + href={`https://${website}/`} + rel="external noopener noreferrer" + target="_blank" + > + + + ) : null} + {bluesky ? ( + e.stopPropagation()} + href={`https://bsky.app/profile/${bluesky}`} + rel="external noopener noreferrer" + target="_blank" + > + + + ) : null} + {mastodon ? ( + e.stopPropagation()} + href={`https://${mastodon}`} + rel="external noopener noreferrer" + target="_blank" + > + + + ) : null} {twitter ? ( e.stopPropagation()} href={`https://twitter.com/${twitter}`} - rel="external" - target="_blank noreferrer nofollow" + rel="external noopener noreferrer" + target="_blank" > @@ -96,8 +135,8 @@ const Member = props => { e.stopPropagation()} href={`https://github.com/${github}`} - rel="external" - target="_blank noreferrer nofollow" + rel="external noopener noreferrer" + target="_blank" > diff --git a/lib/ui/templates/ofPeople/PersonModal.js b/lib/ui/templates/ofPeople/PersonModal.js index ec709d31..dcdb7cc8 100644 --- a/lib/ui/templates/ofPeople/PersonModal.js +++ b/lib/ui/templates/ofPeople/PersonModal.js @@ -60,7 +60,17 @@ const PersonSocial = styled.div` const Member = props => { const { defaultAvatar } = props; const { frontmatter, html } = props.data; - const { avatar, fname, github, lname, quote, twitter } = frontmatter; + const { + avatar, + bluesky, + fname, + github, + lname, + mastodon, + quote, + twitter, + website + } = frontmatter; return ( @@ -78,12 +88,51 @@ const Member = props => { {quote} - - GitHub - - - Twitter - + {website && ( + + Website + + )} + {bluesky && ( + + Bluesky + + )} + {mastodon && ( + + Mastodon + + )} + {twitter && ( + + Twitter + + )} + {github && ( + + GitHub + + )} diff --git a/package.json b/package.json index 03bcff18..e695464d 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "react": "17.0.2", "react-dom": "17.0.2", "react-helmet": "6.1.0", + "react-icons": "^5.3.0", "react-plx": "1.3.17", "styled-components": "5.3.3" }, diff --git a/src/pages/people/bios/fatima-khalid.md b/src/pages/people/bios/fatima-khalid.md index e2ae6db1..05d25b01 100644 --- a/src/pages/people/bios/fatima-khalid.md +++ b/src/pages/people/bios/fatima-khalid.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: false avatar: fatima-khalid.jpg +website: +bluesky: +mastodon: twitter: sugaroverflow github: sugaroverflow quote: Thank you for literally keeping everything from falling apart - Matt Stempeck diff --git a/src/pages/people/bios/ian-anderson.md b/src/pages/people/bios/ian-anderson.md index 9c561541..6d30b996 100644 --- a/src/pages/people/bios/ian-anderson.md +++ b/src/pages/people/bios/ian-anderson.md @@ -8,6 +8,9 @@ role: - member: true - accomplice: false avatar: ian-anderson.jpg +website: +bluesky: +mastodon: twitter: senorinfinito github: ijanderso quote: diff --git a/src/pages/people/bios/jason-miller.md b/src/pages/people/bios/jason-miller.md index 7a443203..aa98abcc 100644 --- a/src/pages/people/bios/jason-miller.md +++ b/src/pages/people/bios/jason-miller.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: false avatar: +website: +bluesky: +mastodon: twitter: millllllllllz github: JasonMiller quote: diff --git a/src/pages/people/bios/joanna-bogusz.md b/src/pages/people/bios/joanna-bogusz.md index f4463549..0d5d5330 100644 --- a/src/pages/people/bios/joanna-bogusz.md +++ b/src/pages/people/bios/joanna-bogusz.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: joanna-bogusz.jpg +website: +bluesky: +mastodon: twitter: github: quote: diff --git a/src/pages/people/bios/julia-smith.md b/src/pages/people/bios/julia-smith.md index 928bb8b3..868f0d80 100644 --- a/src/pages/people/bios/julia-smith.md +++ b/src/pages/people/bios/julia-smith.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: julia-smith.png +website: +bluesky: +mastodon: twitter: smythological github: julia-smith quote: OPPORTUNITY, n. A favorable occasion for grasping a disappointment. – Ambrose Bierce diff --git a/src/pages/people/bios/justin-reese.md b/src/pages/people/bios/justin-reese.md index 1f35741c..1c7eac78 100644 --- a/src/pages/people/bios/justin-reese.md +++ b/src/pages/people/bios/justin-reese.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: justin-reese.jpg +website: +bluesky: +mastodon: twitter: reefdog github: reefdog quote: “The story was gradually taking shape. Pilon liked it this way. It ruined a story to have it all come out quickly. The good story lay in half-told things which must be filled in out of the hearer’s own experiences.” — Tortilla Flat diff --git a/src/pages/people/bios/kate-darling.md b/src/pages/people/bios/kate-darling.md index fd75fe86..07f2ff29 100644 --- a/src/pages/people/bios/kate-darling.md +++ b/src/pages/people/bios/kate-darling.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: false avatar: kate-darling.jpg +website: +bluesky: +mastodon: twitter: grok_ github: grok quote: Quick someone give me a good quote diff --git a/src/pages/people/bios/kavya-sukumar.md b/src/pages/people/bios/kavya-sukumar.md index 62201dfe..d66a2e70 100644 --- a/src/pages/people/bios/kavya-sukumar.md +++ b/src/pages/people/bios/kavya-sukumar.md @@ -8,6 +8,9 @@ role: - member: true - accomplice: true avatar: kavya-sukumar.jpg +website: +bluesky: +mastodon: twitter: kavyasukumar github: kavyasukumar quote: She is a diversity lottery - A recruiter who accidentally cc'ed me on an internal mail about my job application diff --git a/src/pages/people/bios/laurian-gridinoc.md b/src/pages/people/bios/laurian-gridinoc.md index db59ef97..03cc672f 100644 --- a/src/pages/people/bios/laurian-gridinoc.md +++ b/src/pages/people/bios/laurian-gridinoc.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: laurian-gridinoc.jpg +website: +bluesky: +mastodon: twitter: gridinoc github: Laurian quote: Puisque nos dieux et nos espoirs ne sont plus que scientifiques, pourquoi nos amours ne le deviendraient-ils pas également? — Auguste Villiers de l’Isle-Adam, L’Ève future diff --git a/src/pages/people/bios/lou-huang.md b/src/pages/people/bios/lou-huang.md index f2df569a..a7596789 100644 --- a/src/pages/people/bios/lou-huang.md +++ b/src/pages/people/bios/lou-huang.md @@ -8,13 +8,15 @@ role: - member: true - accomplice: true avatar: lou-huang.jpg -twitter: saikofish +website: louhuang.com +bluesky: louh.bsky.social +mastodon: jawns.club/@lou +# twitter: saikofish github: louh quote: Unlike the rest of you losers, I’ve made at least 20% of the shots I didn’t take score: 1 --- -Lou is an open source software developer, user interface engineer, urban designer, recovering architect and professional internet trickster based in Brooklyn, NY. He is the founder and CEO of Streetmix, a collaborative urban design platform. - -He is currently serving as Bad Idea Factory’s Treasure Goblin and works on a number of frivolous projects under the guise of secretly undermining capitalism. Sometimes he will stream livecoding and video games on [Twitch](https://www.twitch.tv/saikofish). +Lou is an open source software developer, user interface engineer, urban designer, recovering architect and professional internet trickster based in Philadelphia, PA. He is the founder of [Streetmix](https://streetmix.net/), a collaborative urban design platform. +He is currently serving as Bad Idea Factory’s Undersecretary of the Interior and works on a number of frivolous projects under the guise of secretly undermining capitalism. diff --git a/src/pages/people/bios/margo-dunlap.md b/src/pages/people/bios/margo-dunlap.md index bada4a62..72b201da 100644 --- a/src/pages/people/bios/margo-dunlap.md +++ b/src/pages/people/bios/margo-dunlap.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: margo-dunlap.jpg +website: +bluesky: +mastodon: twitter: MargoDunlap github: margoyle quote: diff --git a/src/pages/people/bios/mark-boas.md b/src/pages/people/bios/mark-boas.md index f7c18cf7..b232d09a 100644 --- a/src/pages/people/bios/mark-boas.md +++ b/src/pages/people/bios/mark-boas.md @@ -8,6 +8,9 @@ role: - member: true - accomplice: true avatar: mark-boas.jpg +website: +bluesky: +mastodon: twitter: maboa github: maboa quote: Well, in that case, sir, I hope you will not object if I also offer the doctor my most enthusiastic contrafibularities – Sir Edmund Blackadder diff --git a/src/pages/people/bios/matt-stempeck.md b/src/pages/people/bios/matt-stempeck.md index 3a3f6354..723e46ce 100644 --- a/src/pages/people/bios/matt-stempeck.md +++ b/src/pages/people/bios/matt-stempeck.md @@ -8,6 +8,9 @@ role: - member: true - accomplice: true avatar: matt-stempeck.jpg +website: +bluesky: +mastodon: twitter: mstem github: mstem quote: diff --git a/src/pages/people/bios/mike-tigas.md b/src/pages/people/bios/mike-tigas.md index 8cccff2c..ebc59dcc 100644 --- a/src/pages/people/bios/mike-tigas.md +++ b/src/pages/people/bios/mike-tigas.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: false avatar: mike-tigas.jpg +website: +bluesky: +mastodon: twitter: mtigas github: mtigas quote: ¯\_(ツ)_/¯ diff --git a/src/pages/people/bios/paul-schultz.md b/src/pages/people/bios/paul-schultz.md index 57a31503..7ab752aa 100644 --- a/src/pages/people/bios/paul-schultz.md +++ b/src/pages/people/bios/paul-schultz.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: false avatar: paul-schultz.jpg +website: +bluesky: +mastodon: twitter: github: paulwschultz quote: All you have to do is click the right amount of buttons. - Sean (Day[9]) Plott diff --git a/src/pages/people/bios/piotr-fedorczyk.md b/src/pages/people/bios/piotr-fedorczyk.md index bd15b626..d136b930 100644 --- a/src/pages/people/bios/piotr-fedorczyk.md +++ b/src/pages/people/bios/piotr-fedorczyk.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: piotr-fedorczyk.png +website: +bluesky: +mastodon: twitter: presentday github: piotrf quote: I have no regrets diff --git a/src/pages/people/bios/ted-han.md b/src/pages/people/bios/ted-han.md index f90a2654..e8a9f17b 100644 --- a/src/pages/people/bios/ted-han.md +++ b/src/pages/people/bios/ted-han.md @@ -8,6 +8,9 @@ role: - member: false - accomplice: true avatar: ted-han.jpg +website: +bluesky: +mastodon: twitter: knowtheory github: knowtheory quote: Ted Han could not be reached for comment diff --git a/yarn.lock b/yarn.lock index 45ba3a01..8ca93d8e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9803,6 +9803,11 @@ react-helmet@6.1.0: react-fast-compare "^3.1.1" react-side-effect "^2.1.0" +react-icons@^5.3.0: + version "5.3.0" + resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-5.3.0.tgz#ccad07a30aebd40a89f8cfa7d82e466019203f1c" + integrity sha512-DnUk8aFbTyQPSkCfF8dbX6kQjXA9DktMeJqfjrg6cK9vwQVMxmcA3BfP4QoiztVmEHtwlTgLFsPuH2NskKT6eg== + react-is@^16.12.0, react-is@^16.13.1, react-is@^16.7.0: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"