Skip to content

Commit 1243413

Browse files
BrodypenBrodypen
authored
Merge branch 'master' into InfoSec
2 parents 113e79c + 6553e41 commit 1243413

File tree

5 files changed

+203
-0
lines changed

5 files changed

+203
-0
lines changed

‎src/App.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ const Footer = lazy(() => import('./components/Footer/Footer'));
1010
const ScrollTop = lazy(() => import('./components/ScrollTop/ScrollTop'));
1111
const About = lazy(() => import('./pages/About/About'));
1212
const Tutoring = lazy(() => import('./pages/Tutoring/Tutoring'));
13+
const WebDev = lazy(() => import('./pages/WebDev/WebDev'));
1314
const ContactUs = lazy(() => import('./pages/ContactUs/ContactUs'));
1415
const Events = lazy(() => import('./pages/Events/Events'));
1516
const Home = lazy(() => import('./pages/Home/Home'));
@@ -42,6 +43,7 @@ const App = () => {
4243
<Route path='/gallery' element={<Gallery />} />
4344
<Route path='/tutoring' element={<Tutoring />} />
4445
<Route path='/infoSec' element={<InfoSec />} />
46+
<Route path='/webdev' element={<WebDev />} />
4547
<Route path='/gallery/:event' element={<GalleryEvent />} />
4648
<Route path='/404' element={<NotFound />} />
4749
<Route path='*' element={<FourOFour />} />

‎src/assets/webdev.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/components/Navbar/Navbar.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ const NavBar = () => {
3434
<ActiveListItem url='/events' name='Events' />
3535
<ActiveListItem url='/gallery' name='Gallery' />
3636
<ActiveListItem url='/tutoring' name='Tutoring' />
37+
<ActiveListItem url='/webdev' name='WebDev' />
3738
{/* when hackathon will return to active it again no need to delete */}
3839
{/* <ActiveListItem url='/hackathons' name='Hackathons' /> */}
3940
<ActiveListItem url='/infosec' name='InfoSec' />

‎src/pages/WebDev/WebDev.css

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
.hero.hero-webdev {
2+
padding-bottom: 200px;
3+
}
4+
5+
.hero-webdev .row {
6+
align-items: center;
7+
}
8+
9+
.ghost-button {
10+
background-color: transparent;
11+
border: 2px solid;
12+
color: var(--color-on-labelAndHeaders);
13+
padding: 13px 25px;
14+
border-radius: 7px;
15+
font-weight: 600;
16+
outline: none;
17+
box-shadow: none !important;
18+
}
19+
20+
.ghost-button:hover,
21+
.ghost-button:active,
22+
.ghost-button:focus {
23+
background-color: var(--color-on-labelAndHeaders) !important;
24+
border-color: var(--color-on-labelAndHeaders) !important;
25+
color: #fff !important;
26+
}
27+
28+
.classes-wrapper {
29+
max-width: 840px;
30+
margin: auto;
31+
display: grid;
32+
grid-template-columns: repeat(auto-fill, minmax(200px, 200px));
33+
justify-content: center;
34+
gap: 30px;
35+
}
36+
37+
.classes-wrapper .class-number {
38+
text-align: center;
39+
border: 0px;
40+
border-radius: 7px;
41+
background: var(--color-secondary);
42+
color: var(--color-on-secondary);
43+
padding: 20px 30px;
44+
font-weight: 600;
45+
font-size: 18px;
46+
}
47+
48+
/*.tutors-wrapper {
49+
max-width: 750px;
50+
margin: auto;
51+
display: grid;
52+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
53+
justify-content: center;
54+
column-gap: 60px;
55+
row-gap: 15px;
56+
}
57+
58+
.tutors-wrapper a,
59+
.tutors-wrapper a:hover {
60+
color: var(--color-on-background);
61+
}*/
62+
63+
.webdev-cta {
64+
margin-top: 60px;
65+
}
66+
67+
.webdev-cta p {
68+
font-size: 18px;
69+
margin-bottom: 30px;
70+
}
71+
72+
/*.fetching {
73+
display: grid;
74+
justify-content: center;
75+
}*/
76+
77+
@media (max-width: 767px) {
78+
.hero.hero-webdev {
79+
padding-bottom: 100px;
80+
}
81+
82+
.hero-webdev .col-md-6:nth-child(1) {
83+
margin-bottom: 75px;
84+
}
85+
86+
.hero-webdev .col-md-6:nth-child(1) img {
87+
max-height: 300px;
88+
display: block;
89+
margin: auto;
90+
}
91+
92+
/*.tutors-wrapper {
93+
text-align: center;
94+
} */
95+
}

‎src/pages/WebDev/WebDev.js

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
/* eslint-disable react/no-unescaped-entities */
2+
import React from 'react';
3+
import { Button, Col, Container, Row } from 'react-bootstrap';
4+
import headerImage from '../../assets/webdev.svg';
5+
import Loading from '../../components/Loading/Loading';
6+
import { MetaData } from '../../components/Meta/MetaData';
7+
import './WebDev.css';
8+
9+
const meta = {
10+
title: 'WebDev',
11+
desc: 'Learn more about CougarCS WebDev',
12+
url: 'https://cougarcs.com/WebDev',
13+
img: 'https://i.ibb.co/NTLFrdj/cougarcs-background11.jpg',
14+
};
15+
16+
//const url = `${process.env.REACT_APP_API_URL}/api/tutors`;
17+
18+
/*const fetchTutors = async () => {
19+
const res = await axios.get(url);
20+
return res.data.tutors;
21+
};*/
22+
23+
const WebDev = () => {
24+
/*const queryClient = useQueryClient();
25+
const { data, isFetching } = useQuery('tutors', fetchTutors, {
26+
initialData: () => queryClient.getQueryData('tutors'),
27+
staleTime: 300000,
28+
});*/
29+
30+
/*const displayTutors = () => {
31+
return isFetching ? (
32+
<Loading />
33+
) : (
34+
data?.map((val, i) =>
35+
val?.linkedin ? (
36+
<div key={i}>
37+
<a
38+
href={val.linkedin}
39+
rel='nofollow noopener noreferrer'
40+
target='_blank'
41+
>
42+
{val.name}
43+
</a>
44+
</div>
45+
) : (
46+
<div key={i}>{val.name}</div>
47+
)
48+
)
49+
);
50+
};*/
51+
52+
return (
53+
<>
54+
<MetaData {...meta} />
55+
<Container fluid className='contained hero hero-WebDev'>
56+
<Row className='pb-5'>
57+
<Col md='6' className='order-md-2'>
58+
<img src={headerImage} alt='undraw svg' className='img-fluid'></img>
59+
</Col>
60+
<Col md='6' className='order-md-0'>
61+
<div className='about-us'>
62+
<h1>Web Development Committee at CougarCS</h1>
63+
<p className='lead-text'>
64+
Our dedicated team is responsible for maintaining the CougarCS{' '}
65+
website and Discord bot. If you're passionate about web
66+
development and eager to gain hands-on experience while building
67+
new connections, this is the perfect opportunity for you. We
68+
value a foundational understanding of HTML, CSS, and JavaScript,
69+
making this a welcoming space for learners. If you're interested
70+
in joining our team or have any website suggestions, feel free
71+
to reach out to us via email at{' '}
72+
<a href='mailto:info@cougarcs.com'>info@cougarcs.com</a>, or
73+
simply contact our tech leads or web master on Discord!
74+
</p>
75+
</div>
76+
</Col>
77+
</Row>
78+
</Container>
79+
80+
<Container fluid className='contained sub-section'>
81+
<h2 className='heading'>Special Thanks to Our Web Developers</h2>
82+
<Loading />
83+
{/* <div className={isFetching ? 'fetching' : 'tutors-wrapper'}>
84+
{displayTutors()}
85+
</div> */}
86+
</Container>
87+
88+
<Container fluid className='contained sub-section'>
89+
<h2 className='heading'>Interested in tutoring for CougarCS?</h2>
90+
<div className='webdev-cta text-center col-md-8 mx-auto'>
91+
<p>
92+
Develop Real-World Technical Skills - Work With a Team - Resume
93+
Building - Gain Mentorship - Earn CougarCS Member Points
94+
</p>
95+
<Button className='ghost-button' href='https://github.com/CougarCS'>
96+
Contribute Today
97+
</Button>
98+
</div>
99+
</Container>
100+
</>
101+
);
102+
};
103+
104+
export default WebDev;

0 commit comments

Comments
 (0)