diff --git a/src/components/join.astro b/src/components/join.astro index ea2e217..752ecaf 100644 --- a/src/components/join.astro +++ b/src/components/join.astro @@ -16,7 +16,13 @@ if (theme === 'dark') { txtColor = 'white' } -const options: {title: string, description: string, url: string}[] = [ +const options: {title: string, description: string, url: string, emphasis?: boolean}[] = [ + { + title: 'Attend the Fall Kickoff', + description: 'Kickoff is our official start to the year. This event is a great way to learn about all the projects and how to get involved!', + url: '/events/kickoff', + emphasis: true + }, { title: 'Join the Discord', description: 'Our Discord is the primary communication method for the club - join for updates on meeting times, projects, and more.', @@ -58,20 +64,20 @@ const options: {title: string, description: string, url: string}[] = [ > at the UTDesign Makerspace.

- {options.map(({url, title, description}) => ( + {options.map(({url, title, description, emphasis}) => (

{title} →

diff --git a/src/pages/events/kickoff.astro b/src/pages/events/kickoff.astro index bbdc6b2..ff5f67a 100644 --- a/src/pages/events/kickoff.astro +++ b/src/pages/events/kickoff.astro @@ -11,7 +11,7 @@ interface Stat { let projectTitle: string = 'Fall Kickoff' let shortDescription: string = - 'Comet Robotics invites all students to learn about Comet Robotics, the leading robotics club at UTD!' + 'Calling all UT Dallas students: come learn about opportunities for you to get involved in Comet Robotics!' let headerImage: string = '/events/24FKickoff/combatshow.JPG' let images: string[] = [ '/events/24FKickoff/vexchat.JPG', @@ -30,6 +30,8 @@ let stats: Stat[] = [ icon: '/statsGraphics/location.svg', }, ] + +const url = "#" --- @@ -52,30 +54,68 @@ let stats: Stat[] = [ )) }
+ + RSVP +
Students viewing comabat robot
-

Kickoff Details

+

What's Kickoff?

+

+ Kickoff marks our official start to the school year, and is the best place to be if you're interested in being a part of Comet Robotics. From writing software and building mechanisms for robots, to creating content for socials and helping with club logistics, there's a place for you here! +

+

Why should I come?

- Kickoff will be hosted at the Sciences Building, where students will - find our Outdoor Activites, Combat Robotics Fight, Project Displays, and - our Kickoff Presentation + During Kickoff, you'll... +

+

Wait, Free Stuff?

- At Kickoff, you'll be able to get Food, Redbull, T-Shirts, Merch, and - more all for free! You must be an active UTD student to receive items. + Of course! You'll be able to get free Red Bull at Kickoff, and more to be announced at the event :) Register below to let us know you'll be there, and help us make sure we have enough product to give out!

+
+ + RSVP +
{images.map((img) => )}
-

Blah blah blah we need more here!

diff --git a/src/styles/project.css b/src/styles/project.css index aa5b44e..d03a4bc 100644 --- a/src/styles/project.css +++ b/src/styles/project.css @@ -30,11 +30,14 @@ } .stats { - display: grid; - grid-template-columns: repeat(2, 1fr); - grid-template-rows: repeat(2, 1fr); + display: flex; + flex-wrap: 1; gap: 20px; - margin: 20px; + margin: 20px 0px; +} + +.stats div { + width: 50%; } .stats img { @@ -73,12 +76,16 @@ border-radius: 20px; padding: 20px; max-width: 1600px; + /* display: flex; + flex-direction: column; + gap: 0.75rem; */ } .history-title { font-family: 'Mashine'; font-weight: bold; color: #bf1e2e; + padding-top: 20px; } .history-text { @@ -87,6 +94,7 @@ } .image-grid { + padding-top: 20px; display: grid; grid-template-columns: 1fr 1fr 1fr; justify-items: center; @@ -117,12 +125,6 @@ margin-bottom: 20px; } - .stats { - grid-template-columns: 1fr 1fr; - grid-template-rows: repeat(2, 1fr); - width: 100%; - } - .image-grid { grid-template-columns: 1fr 1fr; width: 100%; @@ -158,10 +160,8 @@ .history-text { font-size: 1.1em; } - - .stats { - grid-template-columns: 1fr; - grid-template-rows: repeat(3, 1fr); + + .stats div { width: 100%; } @@ -189,10 +189,8 @@ .history-text { font-size: 1em; } - - .stats { - grid-template-columns: 1fr; - grid-template-rows: repeat(3, 1fr); + + .stats div { width: 100%; }