Add credits

zikaeroh created

Change summary

frontend/src/components/about.tsx | 30 +++++++++++++++++++++++++++++-
1 file changed, 29 insertions(+), 1 deletion(-)

Detailed changes

frontend/src/components/about.tsx 🔗

@@ -1,4 +1,15 @@
-import { Backdrop, Button, createStyles, Fade, makeStyles, Modal, Paper, Theme } from '@material-ui/core';
+import {
+    Backdrop,
+    Button,
+    createStyles,
+    Fade,
+    Link,
+    LinkProps,
+    makeStyles,
+    Modal,
+    Paper,
+    Theme,
+} from '@material-ui/core';
 import { Help } from '@material-ui/icons';
 import * as React from 'react';
 
@@ -18,6 +29,10 @@ const useStyles = makeStyles((theme: Theme) =>
     })
 );
 
+const NewPageLink = (props: LinkProps) => (
+    <Link color="textSecondary" underline="always" target="_blank" rel="noopener" {...props} />
+);
+
 export const AboutButton = (props: { style?: React.CSSProperties }) => {
     const classes = useStyles();
     const [open, setOpen] = React.useState(false);
@@ -54,6 +69,19 @@ export const AboutButton = (props: { style?: React.CSSProperties }) => {
                             Their teammates then try to guess the words while avoiding the opposing team&apos;s, and may
                             guess as many times as the words the spymaster gave in their clue, plus an additional guess.
                         </p>
+                        <h2>About this site</h2>
+                        <p>
+                            This site was created by Zikaeroh (
+                            <NewPageLink href="https://github.com/zikaeroh">GitHub</NewPageLink>,{' '}
+                            <NewPageLink href="https://www.twitch.tv/zikaeroh">Twitch</NewPageLink>,{' '}
+                            <NewPageLink href="https://twitter.com/zikaeroh">Twitter</NewPageLink>). It&apos;s a new
+                            creation, but takes heavy inspiration from the wonderful{' '}
+                            <NewPageLink href="https://github.com/Joooop/codenames.plus">codenames.plus</NewPageLink>.
+                        </p>
+                        <p>
+                            You can find this site&apos;s code on{' '}
+                            <NewPageLink href="https://github.com/zikaeroh/codies">GitHub</NewPageLink>.
+                        </p>
                     </Paper>
                 </Fade>
             </Modal>