diff --git a/components/hackathons/moving-cards.js b/components/hackathons/moving-cards.js new file mode 100644 index 00000000..549d186a --- /dev/null +++ b/components/hackathons/moving-cards.js @@ -0,0 +1,66 @@ +import Ticker from 'react-ticker' +import { Avatar, Box, Card, Message, Text } from 'theme-ui' +import Image from 'next/image' + +export default function MovingCards() { + const messageData = [ + { + message: 'What sorts of prizes do you give out at a hackathon?', + username: 'ella' + }, + { + message: 'how to organize a hackathon???????.', + username: 'ella' + }, + { + message: 'how to get money for your hackathon??!??!?!??!!11!!!!!', + username: 'scrappy' + } + ] + return ( + <> + + {() => ( + + {messageData.map(({ id, message, username }) => ( + + ))} + + )} + + + ) +} + +function MessageCard({ message, username }) { + return ( + + + {/* {`${username} */} + + + @{username} + + {message} + + ) +} diff --git a/next.config.js b/next.config.js index 3417b6fa..43168fe9 100755 --- a/next.config.js +++ b/next.config.js @@ -10,6 +10,7 @@ const nextConfig = { 'dl.airtable.com', 'emoji.slack-edge.com', 'cdn.glitch.com', + 'scrapbook.hackclub.com', 'cloud-k18c7grqc-hack-club-bot.vercel.app', 'cloud-kcloydjv0-hack-club-bot.vercel.app', 'cloud-dtijd5g0u-hack-club-bot.vercel.app' diff --git a/package.json b/package.json index 091b74f4..c7b02eaa 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ "react-masonry-css": "^1.0.16", "react-reveal": "^1.2.2", "react-scrolllock": "^5.0.1", + "react-ticker": "^1.3.2", "react-tsparticles": "^2.1.3", "react-use-websocket": "3.0.0", "resnow": "^1.0.0", diff --git a/pages/hackathons.js b/pages/hackathons.js index 4c059b01..68e71e7f 100644 --- a/pages/hackathons.js +++ b/pages/hackathons.js @@ -8,6 +8,7 @@ import Footer from '../components/footer' import Landing from '../components/hackathons/landing' import Rundown from '../components/hackathons/rundown' import Content from '../components/hackathons/content.mdx' +import MovingCards from '../components/hackathons/moving-cards' import Cta from '../components/hackathons/cta' export default function Bank() { @@ -66,7 +67,7 @@ export default function Bank() { From the Slack... - Mhmm yeah gadzooks{' '} + A hackathon organizer's{' '} - magic + best friend - . +