Skip to content

Commit c51f32c

Browse files
committed
Syntax - Format.
1 parent fd0f0ba commit c51f32c

File tree

5 files changed

+64
-49
lines changed

5 files changed

+64
-49
lines changed

components/contact/contact-info.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,8 @@ const SectionStyled = styled.section`
1111
justify-content: center;
1212
margin: 0 auto;
1313
max-width: ${({ theme }) => theme.width.page};
14-
padding: ${({ theme }) => theme.spacing[6]}px ${({ theme }) => theme.spacing[2]}px;
14+
padding: ${({ theme }) => theme.spacing[6]}px
15+
${({ theme }) => theme.spacing[2]}px;
1516
.divider {
1617
background-color: ${({ theme }) => theme.color.greyLight};
1718
box-sizing: border-box;
@@ -21,11 +22,13 @@ const SectionStyled = styled.section`
2122
width: 100%;
2223
@media ${({ theme }) => theme.breakpoint.md} {
2324
height: 125px;
24-
margin: 0 ${({ theme }) => theme.spacing[3]}px 0 ${({ theme }) => theme.spacing[2]}px;
25+
margin: 0 ${({ theme }) => theme.spacing[3]}px 0
26+
${({ theme }) => theme.spacing[2]}px;
2527
width: 3px;
2628
}
2729
@media ${({ theme }) => theme.breakpoint.lg} {
28-
margin: 0 ${({ theme }) => theme.spacing[7]}px 0 ${({ theme }) => theme.spacing[4]}px;
30+
margin: 0 ${({ theme }) => theme.spacing[7]}px 0
31+
${({ theme }) => theme.spacing[4]}px;
2932
}
3033
}
3134
.item {

components/contact/form.js

Lines changed: 43 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import Checkbox from '@material-ui/core/Checkbox'
2-
import FormControlLabel from '@material-ui/core/FormControlLabel';
2+
import FormControlLabel from '@material-ui/core/FormControlLabel'
33
import FormGroup from '@material-ui/core/FormGroup'
44
import FormHelperText from '@material-ui/core/FormHelperText'
55
import TextField from '@material-ui/core/TextField'
@@ -13,7 +13,7 @@ const SectionStyled = styled.section`
1313
max-width: ${({ theme }) => theme.width.article};
1414
padding: 0 ${({ theme }) => theme.spacing[2]}px;
1515
text-align: center;
16-
input[type=submit] {
16+
input[type='submit'] {
1717
background-color: ${({ theme }) => theme.color.blue};
1818
border: none;
1919
color: ${({ theme }) => theme.color.white};
@@ -38,7 +38,9 @@ const SectionStyled = styled.section`
3838
width: 100%;
3939
@media ${({ theme }) => theme.breakpoint.sm} {
4040
margin: 0 auto;
41-
padding: 0 ${({ theme }) => theme.spacing[2]}px ${({ theme }) => theme.spacing[6]}px ${({ theme }) => theme.spacing[2]}px;
41+
padding: 0 ${({ theme }) => theme.spacing[2]}px
42+
${({ theme }) => theme.spacing[6]}px
43+
${({ theme }) => theme.spacing[2]}px;
4244
}
4345
label {
4446
color: ${({ theme }) => theme.color.black};
@@ -56,7 +58,9 @@ const SectionStyled = styled.section`
5658
padding: 0 0 ${({ theme }) => theme.spacing[4]}px 0;
5759
width: 100%;
5860
@media ${({ theme }) => theme.breakpoint.sm} {
59-
padding: 0 ${({ theme }) => theme.spacing[2]}px ${({ theme }) => theme.spacing[6]}px ${({ theme }) => theme.spacing[2]}px;
61+
padding: 0 ${({ theme }) => theme.spacing[2]}px
62+
${({ theme }) => theme.spacing[6]}px
63+
${({ theme }) => theme.spacing[2]}px;
6064
width: 50%;
6165
}
6266
label {
@@ -87,24 +91,24 @@ export default function Form() {
8791
const [formError, formErrorSet] = React.useState({})
8892

8993
const handleChange = (event) => {
90-
formErrorSet(prevData => ({
94+
formErrorSet((prevData) => ({
9195
...prevData,
92-
'consent': !event.target.checked,
96+
consent: !event.target.checked
9397
}))
9498

9599
setChecked(event.target.checked)
96100
}
97101

98102
const updateInput = (event, field) => {
99-
FormDataSet(prevData => ({
103+
FormDataSet((prevData) => ({
100104
...prevData,
101-
[field]: event.target.value,
105+
[field]: event.target.value
102106
}))
103107

104-
const fieldError = (event.target.value.length > 0) ? false : true
105-
formErrorSet(prevData => ({
108+
const fieldError = event.target.value.length > 0 ? false : true
109+
formErrorSet((prevData) => ({
106110
...prevData,
107-
[field]: fieldError,
111+
[field]: fieldError
108112
}))
109113
}
110114

@@ -113,65 +117,69 @@ export default function Form() {
113117

114118
const syncErrors = []
115119
if (!formData['first-name'] || formData['first-name'].length < 1) {
116-
formErrorSet(prevData => ({
120+
formErrorSet((prevData) => ({
117121
...prevData,
118-
'first-name': true,
122+
'first-name': true
119123
}))
120124
syncErrors.push('first-name')
121125
}
122126

123127
if (!formData['last-name'] || formData['last-name'].length < 1) {
124-
formErrorSet(prevData => ({
128+
formErrorSet((prevData) => ({
125129
...prevData,
126-
'last-name': true,
130+
'last-name': true
127131
}))
128132
syncErrors.push('last-name')
129133
}
130134

131135
if (!formData['company'] || formData['company'].length < 1) {
132-
formErrorSet(prevData => ({
136+
formErrorSet((prevData) => ({
133137
...prevData,
134-
'company': true,
138+
company: true
135139
}))
136140
syncErrors.push('company')
137141
}
138142

139143
if (!formData['job-title'] || formData['job-title'].length < 1) {
140-
formErrorSet(prevData => ({
144+
formErrorSet((prevData) => ({
141145
...prevData,
142-
'job-title': true,
146+
'job-title': true
143147
}))
144148
syncErrors.push('job-title')
145149
}
146150

147-
if (!formData['email'] || formData['email'].length < 1 || !validateEmail(formData['email'])) {
148-
formErrorSet(prevData => ({
151+
if (
152+
!formData['email'] ||
153+
formData['email'].length < 1 ||
154+
!validateEmail(formData['email'])
155+
) {
156+
formErrorSet((prevData) => ({
149157
...prevData,
150-
'email': true,
158+
email: true
151159
}))
152160
syncErrors.push('email')
153161
}
154162

155163
if (!formData['phone'] || formData['phone'].length < 1) {
156-
formErrorSet(prevData => ({
164+
formErrorSet((prevData) => ({
157165
...prevData,
158-
'phone': true,
166+
phone: true
159167
}))
160168
syncErrors.push('phone')
161169
}
162170

163171
if (!formData['message'] || formData['message'].length < 1) {
164-
formErrorSet(prevData => ({
172+
formErrorSet((prevData) => ({
165173
...prevData,
166-
'message': true,
174+
message: true
167175
}))
168176
syncErrors.push('message')
169177
}
170178

171179
if (!checked) {
172-
formErrorSet(prevData => ({
180+
formErrorSet((prevData) => ({
173181
...prevData,
174-
'consent': true,
182+
consent: true
175183
}))
176184
syncErrors.push('consent')
177185
}
@@ -181,7 +189,7 @@ export default function Form() {
181189
url: 'https://formspree.io/f/mqkyorzl',
182190
method: 'post',
183191
headers: {
184-
'Accept': 'application/json'
192+
Accept: 'application/json'
185193
},
186194
data: {
187195
first_name: formData['first-name'],
@@ -204,8 +212,8 @@ export default function Form() {
204212
}
205213

206214
function validateEmail(email) {
207-
const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
208-
return re.test(String(email).toLowerCase());
215+
const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
216+
return re.test(String(email).toLowerCase())
209217
}
210218

211219
return (
@@ -297,17 +305,17 @@ export default function Form() {
297305
}
298306
label='I consent to my submitted data being collected and stored.'
299307
/>
300-
<FormHelperText className='check-error-text' error>{(formError['consent']) ? 'Required field.' : <span>&nbsp;</span>}</FormHelperText>
308+
<FormHelperText className='check-error-text' error>
309+
{formError['consent'] ? 'Required field.' : <span>&nbsp;</span>}
310+
</FormHelperText>
301311

302312
<input onClick={submitForm} type='submit' value='send »' />
303313
</form>
304314

305315
{status === 'SUCCESS' && (
306316
<p>Thank you for your message. It has been sent.</p>
307317
)}
308-
{status === 'ERROR' && (
309-
<p>Ooops! There was an error. Please try again</p>
310-
)}
318+
{status === 'ERROR' && <p>Ooops! There was an error. Please try again</p>}
311319
</SectionStyled>
312320
)
313321
}

components/layout/footer.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -169,9 +169,7 @@ export default function Footer({ noFooter, noFooterCTA }) {
169169
<Button href='/contact' secondary text='Connect Here' />
170170
</div>
171171
)}
172-
{noFooterCTA && (
173-
<div className='no-cta-spacing' />
174-
)}
172+
{noFooterCTA && <div className='no-cta-spacing' />}
175173
<div className='content'>
176174
<div className='contact'>
177175
<p className='logo'>EQ WORKS</p>

components/shared/button.js

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,19 +18,19 @@ const ButtonStyled = styled.button`
1818
transition: all 0.25s ease-out;
1919
&:hover {
2020
background-color: ${(props) =>
21-
props.secondary
22-
? ({ theme }) => theme.color.greyTextFooter
23-
: ({ theme }) => theme.color.blueDark};
21+
props.secondary
22+
? ({ theme }) => theme.color.greyTextFooter
23+
: ({ theme }) => theme.color.blueDark};
2424
color: ${({ theme }) => theme.color.white};
2525
a {
2626
color: ${({ theme }) => theme.color.white};
2727
}
2828
}
2929
a {
3030
color: ${(props) =>
31-
props.secondary
32-
? ({ theme }) => theme.color.black
33-
: ({ theme }) => theme.color.white};
31+
props.secondary
32+
? ({ theme }) => theme.color.black
33+
: ({ theme }) => theme.color.white};
3434
text-decoration: none;
3535
}
3636
`
@@ -46,5 +46,9 @@ export default function Button({ href, secondary, text, ...props }) {
4646
)
4747
}
4848

49-
return <ButtonStyled {...props} secondary={secondary}>{text} »</ButtonStyled>
49+
return (
50+
<ButtonStyled {...props} secondary={secondary}>
51+
{text} »
52+
</ButtonStyled>
53+
)
5054
}

components/shared/hero.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,9 @@ const SectionStyled = styled.section`
2727
`
2828

2929
export default function Hero({ fullHeight, imgSrc, noOverlay, title }) {
30-
const overlayValue = (noOverlay) ? 'rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.0)' : 'rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)'
30+
const overlayValue = noOverlay
31+
? 'rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.0)'
32+
: 'rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)'
3133

3234
return (
3335
<SectionStyled

0 commit comments

Comments
 (0)