Skip to content

Commit 422f1c4

Browse files
klezi10klezi10
authored
Merge pull request #122 from Web-Dev-Path/chore/update-about-us-first-section
Chore/update about us first section
2 parents c59c3b5 + a689175 commit 422f1c4

File tree

13 files changed

+160
-128
lines changed

13 files changed

+160
-128
lines changed

‎CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,3 +56,4 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
5656
- updated to React 18 and Next.js latest
5757
- footer styling update + social media icons
5858
- improved LightHouse scores by optmizing images, creating a robots.txt file and adding proper alt tags
59+
- updated 'about us' first section (our background, peer reviews, version control)

‎components/containers/Container.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
import containerStyles from '@/styles/Container.module.scss';
22

3-
export default function Container({ className, children, styles }) {
3+
export default function Container({ customClass, children, styles }) {
44
return (
55
<div
6-
className={`${containerStyles.container} ${className ? className : ''}`}
6+
className={
7+
customClass
8+
? `${containerStyles.container} ${customClass}`
9+
: containerStyles.container
10+
}
711
style={styles}
812
>
913
{children}

‎components/containers/RevealContentContainer.js

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,14 @@ const RevealContentContainer = ({ children }) => {
1515
}, [entry.isIntersecting]);
1616

1717
return (
18-
<div ref={ref} className={`${styles.wrapper} ${styles[hiddenStyle]}`}>
18+
<div
19+
ref={ref}
20+
className={
21+
hiddenStyle
22+
? `${styles.wrapper} ${styles[hiddenStyle]}`
23+
: styles.wrapper
24+
}
25+
>
1926
{children}
2027
</div>
2128
);

‎components/containers/TwoColumn.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,11 @@ export default function TwoColumn({
2828
return (
2929
<section className={styles.wrapper} style={styleProps.wrapper}>
3030
<Container
31-
className={`${styles.inner} ${styles[customInnerClass]}`}
31+
customClass={
32+
customInnerClass
33+
? `${styles.inner} ${styles[customInnerClass]}`
34+
: styles.inner
35+
}
3236
styles={{ flexDirection: rowOrder }}
3337
>
3438
<div className={styles.inner__content}>

‎components/layout/Footer.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export default function Footer() {
99
return (
1010
<footer className={footerStyles.footer}>
1111
<NewsletterSubscribe />
12-
<Container className={footerStyles.footer__inner}>
12+
<Container customClass={footerStyles.footer__inner}>
1313
<Link href='/'>
1414
<a className={footerStyles.footer__logo} title='Go to the Homepage'>
1515
<Image

‎components/layout/Hero.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default function Hero({
3434
objectPosition='center'
3535
priority
3636
/>
37-
<Container className={styles.header__content}>
37+
<Container customClass={styles.header__content}>
3838
<div className={styles.header__content__upper}>
3939
<h1 className={titleClass ? `${styles[titleClass]}` : ''}>
4040
{title}

‎components/mailchimp/NewsletterForm.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ const NewsletterForm = ({ status, message, onValidated }) => {
114114

115115
return (
116116
<section className={newsletterStyles.newsletter}>
117-
<Container className={newsletterStyles.newsletter__inner}>
117+
<Container customClass={newsletterStyles.newsletter__inner}>
118118
<h2 className={newsletterStyles.newsletter__title}>
119119
Sign up for news
120120
<span className={newsletterStyles.newsletter__right_chevron}>

‎components/snippets/Title.js

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎pages/about.js

Lines changed: 81 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,93 @@
11
import RevealContentContainer from '@/components/containers/RevealContentContainer';
2-
import Title from '@/components/snippets/Title';
32
import TwoColumn from '@/components/containers/TwoColumn';
4-
import { white, primary } from '@/styles/TwoColumn.module.scss';
5-
import Container from '@/components/containers/Container';
3+
import { white, primary, primaryAccent } from '@/styles/TwoColumn.module.scss';
64

75
export default function AboutUs() {
86
return (
97
<div className='about-us'>
108
<RevealContentContainer>
11-
<Container>
12-
<Title title='About Web Dev Path' />
13-
<TwoColumn
14-
content={
15-
<div>
16-
The Web Dev Path project was idealized in 2020 in consequence of
17-
many conversations with aspirant web developers as well as by
18-
considering some personal experiences. When talking to other
19-
junior developers, it was evident the lack of practical
20-
experience with version control in a team dynamic was making
21-
their integration in a professional environment harder. Most of
22-
those new graduates used a version control feature, such
23-
as&nbsp;
24-
<a
25-
target='_blank'
26-
href='http://www.github.com'
27-
rel='noopener noreferrer'
28-
>
29-
GitHub
30-
</a>{' '}
31-
or&nbsp;
32-
<a
33-
target='_blank'
34-
href='http://www.bitbucket.com'
35-
rel='noopener noreferrer'
36-
>
37-
Bitbucket
38-
</a>
39-
, as a repository for their personal projects where they were
40-
the only participants. So, all that “branch out and PR review”
41-
enriching process was completely unknown to them. That happened
42-
to be a problem either for being considered for “junior”
43-
positions and after being hired because, in most cases, their
44-
team lead was a very, very busy senior developer…
45-
</div>
46-
}
47-
rowOrder='row-reverse'
48-
image='/images/svg/square-brackets.svg'
49-
color={primary}
50-
bgColor={white}
51-
customInnerClass='about-content'
52-
/>
53-
<TwoColumn
54-
content={
55-
<div>
56-
Another problem found out is that collaborating with open-source
57-
projects, the way it is possible to gain some version control
58-
experience, can be quite intimidating since there isn’t a clear
59-
mentoring aspect. It can take years for someone to develop “a
60-
logic mindset” that allows solving a problem by using a
61-
programming language, so just going to an open-source project
62-
with a list of available tasks that don’t make any sense won’t
63-
cut it.
64-
</div>
65-
}
66-
image='/images/svg/open-angle-bracket.svg'
67-
color={primary}
68-
bgColor={white}
69-
customInnerClass='about-content'
70-
/>
71-
</Container>
9+
<TwoColumn
10+
title='Our background'
11+
content={
12+
<div>
13+
The Web Dev Path project was idealized in 2020 in consequence of
14+
many conversations with aspirant web developers as well as by
15+
considering some personal experiences.
16+
<br />
17+
<br />
18+
When talking to other junior developers, it was evident the lack
19+
of practical experience with version control in a team dynamic was
20+
making their integration in a professional environment harder.
21+
</div>
22+
}
23+
rowOrder='row'
24+
image='/images/svg/square-brackets.svg'
25+
color={primary}
26+
bgColor={primaryAccent}
27+
customInnerClass='our-background'
28+
/>
7229
</RevealContentContainer>
7330

74-
{/* <RevealContentContainer>
75-
<Container>
76-
<Title title="Our goals" />
77-
</Container>
78-
</RevealContentContainer> */}
31+
<RevealContentContainer>
32+
<TwoColumn
33+
title='Peer reviews'
34+
content={
35+
<div>
36+
Most of those new graduates used a version control feature, such
37+
as&nbsp;
38+
<a
39+
target='_blank'
40+
href='http://www.github.com'
41+
rel='noopener noreferrer'
42+
>
43+
GitHub
44+
</a>{' '}
45+
or&nbsp;
46+
<a
47+
target='_blank'
48+
href='http://www.bitbucket.com'
49+
rel='noopener noreferrer'
50+
>
51+
Bitbucket
52+
</a>
53+
, as a repository for their personal projects where they were the
54+
only participants. So, all that “branch out and PR review”
55+
enriching process was completely unknown to them.
56+
<br />
57+
<br />
58+
That happened to be a problem either for being considered for
59+
“junior” positions and after being hired because, in most cases,
60+
their team lead was a very, very busy senior developer…
61+
</div>
62+
}
63+
rowOrder='row-reverse'
64+
image='/images/svg/open-angle-bracket.svg'
65+
color={primary}
66+
bgColor={white}
67+
customInnerClass='about-content'
68+
/>
69+
<TwoColumn
70+
title='Version control'
71+
content={
72+
<div>
73+
Another problem found out is that collaborating with open-source
74+
projects, the way it is possible to gain some version control
75+
experience, can be quite intimidating since there isn’t a clear
76+
mentoring aspect.
77+
<br />
78+
<br />
79+
It can take years for someone to develop “a logic mindset” that
80+
allows solving a problem by using a programming language, so just
81+
going to an open-source project with a list of available tasks
82+
that don’t make any sense won’t cut it.
83+
</div>
84+
}
85+
image='/images/svg/close-angle-bracket.svg'
86+
color={primary}
87+
bgColor={white}
88+
customInnerClass='about-content'
89+
/>
90+
</RevealContentContainer>
7991
</div>
8092
);
8193
}

‎pages/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Stick from '@/components/decorations/Stick';
33
import TwoColumn from '@/components/containers/TwoColumn';
44
import CardsColumns from '@/components/containers/CardsColumns';
55
import styles from '@/styles/Home.module.scss';
6-
import { white, primary } from '@/styles/TwoColumn.module.scss';
6+
import { white, primary, lightBgColor } from '@/styles/TwoColumn.module.scss';
77
import RevealContentContainer from '@/components/containers/RevealContentContainer';
88

99
export default function Home() {
@@ -17,6 +17,7 @@ export default function Home() {
1717
content='The Web Dev Path is a team of professional developers project that aims to provide a comprehensive path for people who seek to begin their web development journey.'
1818
link='/about'
1919
customBtnClass='inverted-grey'
20+
bgColor={lightBgColor}
2021
/>
2122
</RevealContentContainer>
2223

0 commit comments

Comments
 (0)