System-End/site
1
0
Fork 0
mirror of https://github.com/System-End/site.git synced 2026-04-19 23:22:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

exisiting

Browse source
This commit is contained in:
belle 2024-06-14 01:11:28 -04:00 • committed by Max Wofford
parent 64a72dacd9
commit 7420b1fcdf
2 changed files with 58 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
components/arcade/join.js
View file

@ -1,10 +1,11 @@
import React, { useState, useRef, useEffect } from 'react'
import { Box, Button, Text, Flex, Grid, Card } from 'theme-ui'
import { Box, Button, Text, Flex, Grid, Card, Label, Checkbox } from 'theme-ui'
import JSConfetti from 'js-confetti'
/** @jsxImportSource theme-ui */
const Join = ({ fold, last, showForm, setForm, formSent, setFormSent }) => {
const [email, setEmail] = useState('')
const [highschool, setHighschool] = useState(false)
let jsConfetti = useRef()
@ -55,6 +56,7 @@ const Join = ({ fold, last, showForm, setForm, formSent, setFormSent }) => {
gap: '10px',
alignItems: ['center', 'center', 'center', 'start'],
mt: 4,
pb: last ? 5 : '0',
justifyContent: fold ? 'flex-start' : last ? 'flex-start' : 'flex-end'
}}
>
@ -117,8 +119,8 @@ const Join = ({ fold, last, showForm, setForm, formSent, setFormSent }) => {
gap: '10px',
fontSize: ['20px', '22px', '24px'],
flexDirection: [
last ? 'column' : 'row',
last ? 'column' : 'row',
'column',
'column',
'row',
'row'
]
@ -136,12 +138,46 @@ const Join = ({ fold, last, showForm, setForm, formSent, setFormSent }) => {
position: 'absolute',
width: '150%',
top: '-30px',
color: '#FF5C00'
color: last ? '#FAEFD6':'#FF5C00'
}}
className="gaegu"
>
Get your Slack invite to start.
</Text>
{/* <Label
variant="labelHoriz"
className="gaegu"
sx={{
m: 0,
fontSize: 1,
pt: 1,
position: 'absolute',
width: last ? '100%' : '150%',
bottom: last? '-50px' : '-30px',
color: last ? '#FAEFD6':'#FF5C00'
}}
>
<Checkbox
name="age"
defaultChecked={false}
onClick={() => {setHighschool(!highschool)}}
/>
Pinky promise! I am a high schooler (or younger).
</Label> */}
<Text
as="subtitle"
htmlFor="email"
sx={{
position: 'absolute',
width: ['100%', '100%', '180%', '180%'],
bottom: ['-120px', '-120px', '-40px', '-40px'],
color: '#FF5C00',
opacity: 0.4
}}
className="gaegu"
>
Already in Slack? Join #arcade and you're in!
</Text>
<input
type="email"
id="email"
@ -169,7 +205,7 @@ const Join = ({ fold, last, showForm, setForm, formSent, setFormSent }) => {
borderRadius: '5px',
border: 'none',
fontSize: ['24px', '27px', '30px'],
cursor: 'pointer',
// cursor: highschool ? 'pointer': 'not-allowed',
transitionDuration: '0.3s',
'&:hover': {
transform: 'scale(1.05)'

29
pages/arcade/index.js
View file

@ -949,17 +949,21 @@ const Arcade = ({ stickers = [], inventory }) => {
formSent={formSent}
setFormSent={setFormSent}
/>
<Text
variant="subtitle"
className="gaegu"
sx={{
textAlign: ['center', 'center', 'center', 'left'],
width: '100%',
display: 'block'
}}
>
For high schoolers (or younger).
</Text>
{showForm ? (
<></>
) : (
<Text
variant="subtitle"
className="gaegu"
sx={{
textAlign: ['center', 'center', 'center', 'left'],
width: '100%',
display: 'block'
}}
>
For high schoolers (or younger).
</Text>
)}
</Fade>
</Box>
<Flex
@ -974,7 +978,7 @@ const Arcade = ({ stickers = [], inventory }) => {
sx={{
zIndex: 10,
width: ['80%', '70%', '65%', '80%'],
mt: ['100px', '150px', '240px', '240px'],
mt: ['180px', '220px', '240px', '240px'],
mb: ['-100px', '-150px', '-200px', '-100px']
}}
className="floaty"
@ -1788,6 +1792,7 @@ const Arcade = ({ stickers = [], inventory }) => {
formSent={formSent}
setFormSent={setFormSent}
last
/>
</Flex>
<img