reiyua
/
RayRaysWordBingo
mirror of https://github.com/reiyua/RayRaysWordBingo.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Change website background colour to make it look pleasing to the eyes

This commit is contained in:
Ray 2023-12-28 02:34:52 +00:00 committed by GitHub
parent e6b8047001
commit 1c882e6f39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 67 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

136
src/App.js
View File

@ -26,8 +26,6 @@ import './App.css'
import { FSContext } from ".//contexts/FSContext.js"
// declare variables
export function MyForm(props) {
@ -60,74 +58,74 @@ export function MyForm(props) {
// Create form for user to imput data
return (
<Form onSubmit={submitHandler}>
<Form.Group>
<Form.Label style={{ fontSize: '40px' }}>Ray Ray's Word Bingo</Form.Label>
<Col sm={2}></Col>
<Col sm={8}>
<Form.Label style={{ fontSize: '30px' }}>Enter submitter name:</Form.Label>
<Form.Control
name="submitter"
type="text"
placeholder="Name"
value={submitter}
onChange={(e) => setSubmitter(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter the date the shennanigans occurred (dd-mm-yyyy):</Form.Label>
<Form.Control
name="date"
type="text"
placeholder="Date"
value={date}
onChange={(e) => setDate(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter context for this tamper tantrum:</Form.Label>
<Form.Control
type="text"
name="context"
placeholder="Enter context here"
value={context}
onChange={(e) => setContext(e.target.value)}
/>
<Form.Label
name="selectedoptions"
style={{ fontSize: '30px' }}>Select the words used by Ray during his little tamper tantrum:
</Form.Label>
<Form.Check
type="checkbox"
label="poop"
value="poop"
checked={selectedOptions.includes('poop')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="snot"
value="snot"
checked={selectedOptions.includes('snot')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="brain"
value="brain"
checked={selectedOptions.includes('brain')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="fart"
value="fart"
checked={selectedOptions.includes('fart')}
onChange={handleCheckboxChange}
/>
<div style={{ backgroundColor: '#FBC40E' }}>
<Form onSubmit={submitHandler}>
<Form.Group>
<Form.Label style={{ fontSize: '40px' }}>Ray Ray's Word Bingo</Form.Label>
<Col sm={2}></Col>
<Col sm={8}>
<Form.Label style={{ fontSize: '30px' }}>Enter submitter name:</Form.Label>
<Form.Control
name="submitter"
type="text"
placeholder="Name"
value={submitter}
onChange={(e) => setSubmitter(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter the date the shennanigans occurred (dd-mm-yyyy):</Form.Label>
<Form.Control
name="date"
type="text"
placeholder="Date"
value={date}
onChange={(e) => setDate(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter context for this tamper tantrum:</Form.Label>
<Form.Control
type="text"
name="context"
placeholder="Enter context here"
value={context}
onChange={(e) => setContext(e.target.value)}
/>
<Form.Label
name="selectedoptions"
style={{ fontSize: '30px' }}>Select the words used by Ray during his little tamper tantrum:
</Form.Label>
<Form.Check
type="checkbox"
label="poop"
value="poop"
checked={selectedOptions.includes('poop')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="snot"
value="snot"
checked={selectedOptions.includes('snot')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="brain"
value="brain"
checked={selectedOptions.includes('brain')}
onChange={handleCheckboxChange}
/>
<Form.Check
type="checkbox"
label="fart"
value="fart"
checked={selectedOptions.includes('fart')}
onChange={handleCheckboxChange}
/>
<Button type="submit">Submit</Button>
</Col>
</Form.Group>
</Form>
// Create a button to submit the form data to Firebase
<Button type="submit">Submit</Button>
</Col>
</Form.Group>
</Form>
</div>
);
}
export default MyForm;