remove the button and som card + mentions (#1647)

components/index/cards/som.js

@@ -1,119 +0,0 @@
-import CardModel from './card-model'
-import { Box, Card, Flex, Grid, Heading, Text } from 'theme-ui'
-import Buttons from './button'
-import Image from 'next/image'
-import Icon from '@hackclub/icons'
-/** @jsxImportSource theme-ui */
-
-function BreakdownBox({ icon, text, description, href }) {
-  return (
-    <Card
-      sx={{
-        position: 'relative',
-        background: 'linear-gradient(145deg, #f6dbba 0%, #e6d4be 100%)',
-        borderRadius: 'clamp(6px, 1.5vw, 10px)',
-        boxShadow:
-          '0 4px 15px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.6), inset 3px 0 5px rgba(0, 0, 0, 0.05)',
-        transition: 'all 0.3s ease',
-        border: '2px solid rgba(89, 47, 49, 0.3)',
-        overflow: 'hidden',
-        color: 'black',
-        height: '100%',
-        cursor: href ? 'pointer' : 'default',
-        display: 'flex',
-        flexDirection: 'column',
-        zIndex: 2,
-        p: [3, 3, '24px'],
-        marginLeft: ['20px', 0, 0],
-        marginRight: ['20px', 0, 0]
-      }}
-    >
-      <Flex sx={{ alignItems: 'center', gap: '10px' }}>
-        <Icon glyph={icon} size={32} color="#CC676D" />
-        <Heading
-          sx={{
-            fontSize: ['16px', '16px', '24px', '26px']
-          }}
-          as="h4"
-        >
-          {text}
-        </Heading>
-      </Flex>
-      <Text
-        as="p"
-        sx={{
-          fontSize: ['14px !important', '16px !important', '18px !important'],
-          lineHeight: 1.25,
-          mt: [1, 2, 2]
-        }}
-      >
-        {description}
-      </Text>
-    </Card>
-  )
-}
-
-export default function Som() {
-  return (
-    <CardModel
-      color="white"
-      sx={{
-        backgroundSize: 'cover',
-        backgroundColor: '#D1B290'
-      }}
-      background="/home/som-bg.png"
-    >
-      <Flex
-        sx={{
-          flexDirection: ['column', null, 'row'],
-          gap: [3, 4, 5],
-          alignItems: 'flex-start',
-          justifyContent: 'space-between',
-          width: '100%',
-          flexWrap: 'nowrap'
-        }}
-      >
-        <Box
-          sx={{
-            maxWidth: ['100%', '100%', '50%'],
-            margin: ['auto', 'auto', 'initial']
-          }}
-        >
-          <Image src="/home/som.png" width={300} height={180} alt="Summer of making logo" />
-          <Box>
-            <Buttons
-              id="13"
-              link="https://summer.hackclub.com/"
-              icon="enter"
-              primary="#592F31"
-              sx={{ color: '#f6dbba' }}
-            >
-              Start building
-            </Buttons>
-          </Box>
-        </Box>
-        <Box
-          sx={{
-            position: 'relative',
-            width: ['100%', '100%', '50%'],
-            display: 'flex',
-            flexDirection: 'column',
-            gap: 3,
-            marginRight: [0, null, '20px']
-          }}
-        >
-          <BreakdownBox
-            icon="idea"
-            text="Build Projects"
-            description="Build websites, games, apps, or any other personal open-source coding projects to showcase your skills."
-          />
-          <BreakdownBox
-            icon="plus-fill"
-            text="Get Stuff"
-            description="Get awesome prizes like Raspberry Pis, Server hosting credits, 3D printers, and more to fuel your next creation."
-          />
-        </Box>
-      </Flex>
-    </CardModel>
-  )
-}

pages/index.js

@@ -41,7 +41,6 @@ import Comma from '../components/comma'
 import Haxidraw from '../components/index/cards/haxidraw'
 import Onboard from '../components/index/cards/onboard'
 import Blueprint from '../components/index/cards/blueprint'
-import Som from '../components/index/cards/som'
 import Athena from '../components/index/cards/athena'
 import Daydream from '../components/index/cards/daydream'
 import Highway from '../components/index/cards/highway'
@@ -213,7 +212,8 @@ function Page({
             copy="Get up to $400 to make a hardware project!"
             caption="Design a project and get a grant to make it real with Blueprint, Hack Club's largest hardware program"
             href="https://blueprint.hackclub.com/?utm_source=site-announcement"
-            imgSrc="https://hc-cdn.hel1.your-objectstorage.com/s/v3/db8d0fd43bb664a8b07431b0262a7ca13c1602c7_blueprint_logo__img_.png"/>
+            imgSrc="https://hc-cdn.hel1.your-objectstorage.com/s/v3/db8d0fd43bb664a8b07431b0262a7ca13c1602c7_blueprint_logo__img_.png"
+          />
           <Box
             sx={{
               width: '90vw',
@@ -291,23 +291,24 @@ function Page({
                   display: 'flex',
                   flexWrap: 'wrap',
                   flexDirection: 'row',
-                  rowGap: 3,
+                  rowGap: 3
                 }}
               >
-                               <Button
+                <Button
                   variant="ctaLg"
                   as="a"
                   href="https://blueprint.hackclub.com/?utm_source=site-cta"
                   mt={[3, 0, 0]}
                   mr={3}
-                  sx={{ 
+                  sx={{
                     transformOrigin: 'center',
                     display: 'flex',
                     flexDirection: 'column',
                     alignItems: 'center',
                     width: 'fit-content',
                     backgroundColor: '#0e305b',
-                    backgroundImage: 'linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px)',
+                    backgroundImage:
+                      'linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px)',
                     backgroundSize: '50px 50px',
                     border: '2px solid #dbe4ee',
                     color: '#dbe4ee',
@@ -330,32 +331,6 @@ function Page({
                     Get up to $400 to make Hardware
                   </Text>
                 </Button>
-                <Button
-                  variant="ctaLg"
-                  as="a"
-                  href="https://summer.hackclub.com"
-                  mt={[3, 0, 0]}
-                  mr={3}
-                  sx={{ 
-                    transformOrigin: 'center',
-                    display: 'flex',
-                    flexDirection: 'column',
-                    alignItems: 'center',
-                    width: 'fit-content'
-                  }}
-                >
-                  Join Summer of Making
-                  <Text
-                    as="span"
-                    sx={{
-                      fontSize: 0,
-                      opacity: 0.8,
-                      mt: 1
-                    }}
-                  >
-                    Ends September 30th
-                  </Text>
-                </Button>
               </Box>
             </Heading>
           </Box>
@@ -742,9 +717,11 @@ function Page({
                 and make things together!
               </Text>
             </Box>
-            <Blueprint blueprintData={blueprintData} stars={stars.onboard.stargazerCount} />
+            <Blueprint
+              blueprintData={blueprintData}
+              stars={stars.onboard.stargazerCount}
+            />
             <Daydream />
-            <Som />
             <Athena />
             <Slack slackKey={slackKey} data={slackData} events={events} />
             <Pizza />
@@ -1352,9 +1329,9 @@ export async function getStaticProps() {
 
   let events = []
   try {
-    await fetch(
+    await fetch('https://events.hackclub.com/api/events/upcoming/').then(res =>
-      'https://events.hackclub.com/api/events/upcoming/'
+      res.json()
-    ).then(res => res.json())
+    )
   } catch (error) {
     console.error('Error fetching events:', error)
   }