Skip to content

Commit ed940c8

Browse files
bnleftbnleft
committed
2 parents 4430843 + 47b1337 commit ed940c8

File tree

10 files changed

+348
-4
lines changed

10 files changed

+348
-4
lines changed

‎src/App.js

Lines changed: 4 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'));
@@ -19,6 +20,7 @@ const Hackathon = lazy(() => import('./pages/Hackathon/Hackathon'));
1920
const Privacy = lazy(() => import('./pages/Policy/Privacy'));
2021
const Gallery = lazy(() => import('./pages/Gallery/Gallery'));
2122
const GalleryEvent = lazy(() => import('./pages/Gallery/GalleryEvent'));
23+
const InfoSec = lazy(() => import('./pages/InfoSec/InfoSec'));
2224

2325
const queryClient = new QueryClient();
2426

@@ -40,6 +42,8 @@ const App = () => {
4042
<Route path='/privacy-policy' element={<Privacy />} />
4143
<Route path='/gallery' element={<Gallery />} />
4244
<Route path='/tutoring' element={<Tutoring />} />
45+
<Route path='/infoSec' element={<InfoSec />} />
46+
<Route path='/webdev' element={<WebDev />} />
4347
<Route path='/gallery/:event' element={<GalleryEvent />} />
4448
<Route path='/404' element={<NotFound />} />
4549
<Route path='*' element={<FourOFour />} />

‎src/assets/gallery/aboutuspic.svg

Lines changed: 3 additions & 0 deletions
Loading

‎src/assets/webdev.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/components/Navbar/Navbar.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,12 @@ 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' /> */}
40+
<ActiveListItem url='/infosec' name='InfoSec' />
3941
<ActiveListItem url='/contactus' name='Contact Us' />
42+
4043
<Nav.Link href='https://uhcode.red/' target='_blank' rel='noreferrer'>
4144
CodeRED <i className='fas fa-external-link-alt'></i>
4245
</Nav.Link>

‎src/pages/About/About.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { lazy, Suspense } from 'react';
22
import { Col, Container, Row } from 'react-bootstrap';
3-
import gif from '../../assets/about.svg';
3+
import aboutpic from '../../assets/gallery/aboutuspic.svg';
44
import { officersFall2023 } from '../../data/officers';
55
import cougarettesLogo from '../../assets/partner-logos/cougarettes.webp';
66
import csgirlsLogo from '../../assets/partner-logos/csgirls.webp';
@@ -28,7 +28,7 @@ const About = () => {
2828
<Container fluid className='contained hero hero-about'>
2929
<Row>
3030
<Col md='6' className='order-md-2'>
31-
<img src={gif} alt='undraw svg' className='img-fluid'></img>
31+
<img src={aboutpic} alt='undraw svg' className='img-fluid'></img>
3232
</Col>
3333
<Col md='6' className='order-md-0'>
3434
<div className='about-us'>

‎src/pages/InfoSec/InfoSec.css

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
.discord-button {
2+
background-color: #7289da;
3+
padding: 13px 25px;
4+
display: flex;
5+
align-items: center;
6+
gap: 15px;
7+
border: 0;
8+
border-radius: 7px;
9+
font-weight: 600;
10+
outline: 0px;
11+
box-shadow: none !important;
12+
}
13+
14+
.discord-button:hover,
15+
.discord-button:active,
16+
.discord-button:focus {
17+
background-color: #627ee2 !important;
18+
}
19+
20+
.discord-button-wrapper small {
21+
color: #777;
22+
font-size: 11px;
23+
}
24+
25+
26+
.info-cta {
27+
margin-top: 60px;
28+
}
29+
30+
.info-cta p {
31+
font-size: 18px;
32+
margin-bottom: 30px;
33+
}
34+
.ghost-button {
35+
background-color: transparent;
36+
border: 2px solid;
37+
color: var(--color-on-labelAndHeaders);
38+
padding: 13px 25px;
39+
border-radius: 7px;
40+
font-weight: 600;
41+
outline: none;
42+
box-shadow: none !important;
43+
}
44+
45+
.ghost-button:hover,
46+
.ghost-button:active,
47+
.ghost-button:focus {
48+
background-color: var(--color-on-labelAndHeaders) !important;
49+
border-color: var(--color-on-labelAndHeaders) !important;
50+
color: #fff !important;
51+
}

‎src/pages/InfoSec/InfoSec.js

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
import React from 'react';
2+
import { Col, Container, Row, Button } from 'react-bootstrap';
3+
import webgif from '../../assets/CougarCS_Banner.png';
4+
import { MetaData } from '../../components/Meta/MetaData';
5+
import discordIcon from '../../assets/icons/discord-icon.webp';
6+
import './InfoSec.css';
7+
8+
const meta = {
9+
title: 'Info-Sec',
10+
desc: 'Learn more about CougarCS InfoSec',
11+
url: 'https://cougarcs.com/infosec',
12+
img: 'https://i.ibb.co/NTLFrdj/cougarcs-background11.jpg',
13+
};
14+
const InfoSec = () => {
15+
return (
16+
<>
17+
<MetaData {...meta} />
18+
<Container fluid className='contained hero hero-web'>
19+
<Row className='pb-5'>
20+
<Col md='6' className='order-md-2'>
21+
<img
22+
src={webgif}
23+
alt='banner svg'
24+
className='img-fluid'
25+
style={{ borderRadius: '10px' }}
26+
></img>
27+
</Col>
28+
<Col md='6' className='order-md-0'>
29+
<div className='about-us'>
30+
<h1>InfoSec at CougarCS</h1>
31+
<p className='lead-text'>
32+
Have you ever wanted to learn how to hack into computers or
33+
phish someone through email ? Perhaps you’d like to learn about
34+
best information security practices to protect yourself and
35+
others? Or maybe you are down for competitive hacking in a
36+
controlled environment against external clubs!
37+
</p>
38+
<div className='hero-ctas'>
39+
<div className='discord-button-wrapper'>
40+
<Button
41+
className='discord-button'
42+
href='https://discord.gg/wdxqgErhKF'
43+
target='_blank'
44+
rel='nofollow noopener'
45+
>
46+
<img src={discordIcon} alt='discord button logo' />
47+
Join Discord
48+
</Button>
49+
<p>
50+
<small>More Information is provided via Discord</small>
51+
</p>
52+
</div>
53+
</div>
54+
</div>
55+
</Col>
56+
</Row>
57+
</Container>
58+
<Container fluid className='contained sub-section'>
59+
<h2 className='heading'>Interested in InfoSec at CougarCS?</h2>
60+
<div className='info-cta text-center col-md-8 mx-auto'>
61+
<p>
62+
Develop Soft &amp; Technical Skills - Learn Linux - Protect yourself
63+
on the Internet - Partticapte in Security Challenenges - Earn
64+
CougarCS Member Points
65+
</p>
66+
<Button
67+
className='ghost-button'
68+
href='mailto:[email protected]?subject=CougarCS Tutor Application'
69+
>
70+
Become a Hacker
71+
</Button>
72+
</div>
73+
</Container>
74+
</>
75+
);
76+
};
77+
78+
export default InfoSec;

‎src/pages/Tutoring/Tutoring.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import { Col, Container, Row, Button } from 'react-bootstrap';
3-
import headerImage from '../../assets/tutoring.svg';
3+
import headerImage from '../../assets//gallery/linuxw1.webp';
44
import discordIcon from '../../assets/icons/discord-icon.webp';
55
import { MetaData } from '../../components/Meta/MetaData';
66
import { useQuery, useQueryClient } from 'react-query';
@@ -59,7 +59,12 @@ const Tutoring = () => {
5959
<Container fluid className='contained hero hero-tutoring'>
6060
<Row className='pb-5'>
6161
<Col md='6' className='order-md-2'>
62-
<img src={headerImage} alt='undraw svg' className='img-fluid'></img>
62+
<img
63+
src={headerImage}
64+
alt='Cougar Cs member tutoring'
65+
className='img-fluid'
66+
style={{ borderRadius: '10px' }}
67+
></img>
6368
</Col>
6469
<Col md='6' className='order-md-0'>
6570
<div className='about-us'>

‎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+
}

0 commit comments

Comments
 (0)