From 184065cf4343b69075c7a2f9e01589e7ee34290b Mon Sep 17 00:00:00 2001 From: phthallo Date: Mon, 27 Jan 2025 12:16:39 -0500 Subject: [PATCH] add: stuff fix some offsets, add images and text --- .../congressional-app-challenge/polaroid.js | 6 +- .../userProfile.js | 4 +- pages/congressional-app-challenge.js | 90 +++++++++++-------- 3 files changed, 59 insertions(+), 41 deletions(-) diff --git a/components/congressional-app-challenge/polaroid.js b/components/congressional-app-challenge/polaroid.js index aabee5dd..3f9399fe 100644 --- a/components/congressional-app-challenge/polaroid.js +++ b/components/congressional-app-challenge/polaroid.js @@ -7,9 +7,9 @@ export default function Polaroid({ }){ return ( - - - {caption} + + + {caption} ) diff --git a/components/congressional-app-challenge/userProfile.js b/components/congressional-app-challenge/userProfile.js index 569f4088..e3981a61 100644 --- a/components/congressional-app-challenge/userProfile.js +++ b/components/congressional-app-challenge/userProfile.js @@ -9,9 +9,9 @@ export default function UserProfile({ }){ return ( - + - {name} ({age}, {state}) + {name} ({age}, {state}) {description} diff --git a/pages/congressional-app-challenge.js b/pages/congressional-app-challenge.js index a3936aa6..2cc3945b 100644 --- a/pages/congressional-app-challenge.js +++ b/pages/congressional-app-challenge.js @@ -42,29 +42,20 @@ const styled = ` .blurple { color: rgb(65, 60, 242); - background-repeat:repeat-x; - background-size: 16px 4px; - background-position:0 95%; - background-image: - linear-gradient(45deg, transparent 65%,rgb(65, 60, 242) 80%, transparent 90%), linear-gradient(135deg, transparent 5%,rgb(65, 60, 242) 15%, transparent 25%), linear-gradient(135deg, transparent 45%,rgb(65, 60, 242) 55%, transparent 65%), linear-gradient(45deg, transparent 25%,rgb(65, 60, 242) 35%, transparent 50%); -} + text-decoration: underline; + text-decoration-style: wavy; + } .yellow { color: rgb(250, 203, 45); - background-repeat:repeat-x; - background-size: 16px 4px; - background-position:0 95%; - background-image: - linear-gradient(45deg, transparent 65%, rgb(250, 203, 45) 80%, transparent 90%), linear-gradient(135deg, transparent 5%, rgb(250, 203, 45) 15%, transparent 25%), linear-gradient(135deg, transparent 45%,rgb(250, 203, 45) 55%, transparent 65%), linear-gradient(45deg, transparent 25%, rgb(250, 203, 45) 35%, transparent 50%); + text-decoration: underline; + text-decoration-style: wavy; } .pink { color: rgb(225, 91, 166); - background-repeat:repeat-x; - background-size: 16px 4px; - background-position:0 95%; - background-image: - linear-gradient(45deg, transparent 65%,rgb(225, 91, 166) 80%, transparent 90%), linear-gradient(135deg, transparent 5%,rgb(225, 91, 166) 15%, transparent 25%), linear-gradient(135deg, transparent 45%,rgb(225, 91, 166) 55%, transparent 65%), linear-gradient(45deg, transparent 25%,rgb(225, 91, 166) 35%, transparent 50%); + text-decoration: underline; + text-decoration-style: wavy; } @media only screen and (max-width: 500px) { @@ -143,10 +134,15 @@ function Page({ Hack Club presents the Congressional App Challenge - + - + @@ -172,11 +168,11 @@ function Page({

Connect with thousands of other high school programmers in the community and build your winning submission for the 2025 Challenge.

- Need a little more persuasion? + Need a little more persuasion?
{ element.innerHTML = `In the past, we've ran the world's longest hackathon across the United States — by train.`}, 2000, @@ -207,7 +203,7 @@ function Page({ /> - + @@ -230,13 +226,21 @@ function Page({ borderRight:"1px solid black" }}> Get free stuff - - + + Dozens of teen-led hardware and software initiatives ('You Ship, We Ship') are run each year, from Tamagotchi clones and portable game consoles to 3D websites. The best part? It's all free, and completely open source.

+ Ever wanted to learn how to design your own PCB? How about building a website in exchange for a boba or frappuccino? +
Or, have you been thinking about publishing your Congressional App Challenge submission on the App Store, but are worried about the publishing fee? We've got you covered. +

Go on — build that project you've always wanted to. - + + @@ -244,18 +248,18 @@ function Page({ + image="https://cloud-ggl6f1hfj-hack-club-bot.vercel.app/0image.png" + caption="Hackers at SpaceX (2024)" + sxProps={{transform: 'rotate(12deg)', zIndex: 1, position: 'absolute', top: [-4, -3, -3, -5], left: [-2, 160, 340, 20], width: [140, 160, 185, 230]}}/> + image="https://cloud-25h1tatrt-hack-club-bot.vercel.app/0260102957-168f5ff5-ca65-44d9-8814-a7baad487f31.png" + caption="The Outernet Cafe (2023)" + sxProps={{transform: 'rotate(350deg)', zIndex: 0, position: 'absolute', top: [2, -2, -3, -4], left: [90, 30, 140, 130], width: [170, 220, 250, 300]}}/> Hack Clubbers come from all over the world. In 2024, we hosted Counterspell, a game jam that ran simultaneously in 40+ locations worldwide. - This year, we'll be running Scrapyard, with a flagship hackathon hosted in Los Angeles - built and organized {/* it pains me to spell it like this */} by a team of teenagers at Hack Club. + This year, we'll be running Scrapyard, with a flagship hackathon hosted in Los Angeles - just one of many events this year built and organized {/* it pains me to spell it like this */} by a team of teenagers at Hack Club.

No matter who you are, where you're from, or how experienced (or not!) you are at programming - you're welcome here. @@ -281,8 +285,17 @@ function Page({ justifyContent: "space-around", alignItems: "center" }}> - - + + @@ -322,7 +335,7 @@ function Page({ backgroundColor: "#fff", borderLeft: "1px solid black", borderRight: "1px solid black"}}> - submissions for the 2025 Congressional App Challenge open + Submissions for the 2025 Congressional App Challenge open What are you waiting for? - - + +