Skip to content
This repository was archived by the owner on Mar 7, 2024. It is now read-only.

Commit 856f7ec

Browse files
Abhishek-kumar09Abhishek-kumar09
committed
Implement new Workshop Design: final
1 parent 2360560 commit 856f7ec

File tree

12 files changed

+272
-213
lines changed

12 files changed

+272
-213
lines changed

‎public/static/images/backs/course.png

532 KB
Loading

‎public/static/images/backs/ws.png

492 KB
Loading

‎src/Routes.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import ProfileView from 'src/views/pages/ProfileView';
1212
import ApplicationsView from 'src/views/pages/ApplicationsView';
1313
import Error404View from 'src/views/pages/Error404View';
1414
import StudentDashboardView from 'src/views/pages/StudentDashboardView';
15+
import WorkshopView from 'src/views/pages/WorkshopView';
1516
import CoursePage from 'src/views/pages/Courses/CoursePage';
1617
import TermsView from './views/pages/documents/termsView';
1718
import DocsLayout from './layouts/DocsLayout';

‎src/components/Hero/HeroWithOneButton.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ const useStyles = makeStyles(theme => ({
99
root: {
1010
minHeight: '350px',
1111
color: '#FFF',
12-
padding: '100px 70px',
12+
padding: '127px 70px',
1313
[theme.breakpoints.down('md')]: {
1414
paddingLeft: 15,
1515
paddingRight: 15
@@ -39,6 +39,7 @@ const useStyles = makeStyles(theme => ({
3939
function Hero({
4040
title,
4141
subtitle,
42+
subtitleDesign,
4243
className, // className
4344
backgroundImage = null, // Link to the background image if any
4445
component = null, // The Button or any component provided
@@ -60,9 +61,13 @@ function Hero({
6061
>
6162
<Container maxWidth="lg">
6263
<div className={classes.main}>
63-
<Typography variant="h1">{title}</Typography>
64+
<Typography align='center' variant="h2">{title}</Typography>
6465
<Box mt={2}>
65-
<Typography variant="body1" align="center">
66+
<Typography
67+
className={subtitleDesign}
68+
variant="body1"
69+
align="center"
70+
>
6671
{subtitle}
6772
</Typography>
6873
</Box>
@@ -92,6 +97,7 @@ function Hero({
9297
Hero.propTypes = {
9398
title: PropTypes.string,
9499
subtitle: PropTypes.string,
100+
subtitleDesign: PropTypes.string,
95101
className: PropTypes.string,
96102
backgroundImage: PropTypes.string,
97103
component: PropTypes.oneOfType([PropTypes.string, PropTypes.func])

‎src/data/workshopData/workshopDetail.js

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

‎src/views/pages/CLView/CTA.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -145,6 +145,7 @@ function CTA({ className, ...rest }) {
145145
target="_blank"
146146
size="large"
147147
variant="outlined"
148+
focusRipple={false}
148149
>
149150
Submit Request
150151
</Button>
@@ -203,10 +204,11 @@ function CTA({ className, ...rest }) {
203204
<Button
204205
className={classes.Button + ' ' + classes.secondaryBtn}
205206
component="a"
206-
href="https://codecau.se/ws"
207+
href="/workshops"
207208
target="_blank"
208209
size="large"
209210
variant="outlined"
211+
focusRipple={false}
210212
>
211213
Submit Request
212214
</Button>

‎src/views/pages/WorkshopView/AboutWorkshops.js

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
import { Divider, Grid, makeStyles, Typography } from '@material-ui/core';
2+
import React from 'react';
3+
4+
const useStyles = makeStyles(theme => ({
5+
root: {
6+
width: '80%',
7+
margin: 'auto',
8+
[theme.breakpoints.down('sm')]: {
9+
width: '90%'
10+
}
11+
},
12+
mainHeading: {
13+
padding: '150px 0px 80px'
14+
},
15+
desc: {
16+
fontStyle: 'italic',
17+
fontWeight: 500,
18+
paddingBottom: '20px'
19+
},
20+
stats: {},
21+
divider: {
22+
backgroundColor: '#D4D4D4',
23+
padding: '0px 1px',
24+
height: 'auto',
25+
width: 'auto',
26+
border: '0.5px #525252'
27+
},
28+
aboutText: {
29+
color: '#747474',
30+
paddingBottom: '10px'
31+
},
32+
extraPadding: {
33+
padding: '0px 0px 20px',
34+
[theme.breakpoints.down('sm')]: {
35+
margin: 'auto',
36+
padding: '40px 0px'
37+
}
38+
}
39+
}));
40+
41+
export default function AboutWorkshops() {
42+
const classes = useStyles();
43+
44+
return (
45+
<div className={classes.root}>
46+
<Typography className={classes.mainHeading} variant="h2" align="center">
47+
About Wokshops
48+
</Typography>
49+
<Grid container xs={12} justify="space-between">
50+
<Grid className={classes.stats} container item md={3}>
51+
<Grid item xs={4}>
52+
<Typography variant="h4">120+</Typography>
53+
</Grid>
54+
<Grid item xs={6}>
55+
<Typography className={classes.desc}>Workshops</Typography>
56+
</Grid>
57+
<Grid item xs={4}>
58+
<Typography variant="h4">30+</Typography>
59+
</Grid>
60+
<Grid item xs={6}>
61+
<Typography className={classes.desc}>Topics</Typography>
62+
</Grid>
63+
<Grid item xs={4}>
64+
<Typography variant="h4">25+</Typography>
65+
</Grid>
66+
<Grid item xs={6}>
67+
<Typography className={classes.desc}>Speakers</Typography>
68+
</Grid>
69+
<Grid item xs={4}>
70+
<Typography variant="h4">15000+</Typography>
71+
</Grid>
72+
<Grid item xs={6}>
73+
<Typography className={classes.desc}>participants</Typography>
74+
</Grid>
75+
</Grid>
76+
<Divider
77+
className={classes.divider}
78+
variant="fullWidth"
79+
orientation="vertical"
80+
/>
81+
<Grid container item md={7}>
82+
<Typography
83+
align="center"
84+
className={classes.extraPadding}
85+
variant="h4"
86+
>
87+
Workshops are About...
88+
</Typography>
89+
<ABoutText
90+
left="How To Learn Technology?"
91+
right="How To Learn Technology?"
92+
/>
93+
<ABoutText left="Machine Learning" right="Machine Learning" />
94+
<ABoutText
95+
left="Data Structures And Algorithms"
96+
right="Data Structures And Algorithms"
97+
/>
98+
<ABoutText left="Javascript" right="Javascript" />
99+
<ABoutText left="Game Development" right="Game Development" />
100+
<ABoutText left="Real Life Strategies" right="Real Life Strategies" />
101+
<ABoutText left="Real Life Strategies" right="Real Life Strategies" />
102+
</Grid>
103+
</Grid>
104+
105+
<Divider
106+
className={classes.divider}
107+
variant="fullWidth"
108+
style={{ margin: '80px 0px', padding: '0.5px' }}
109+
/>
110+
</div>
111+
);
112+
}
113+
114+
function ABoutText({ left, right }) {
115+
const classes = useStyles();
116+
117+
return (
118+
<Grid container item justify="space-evenly">
119+
<Grid className={classes.aboutText} sm={6} xs={12}>
120+
<Typography variant="body2">{left}</Typography>
121+
</Grid>
122+
<Grid className={classes.aboutText} sm={6} xs={12}>
123+
<Typography variant="body2">{right}</Typography>
124+
</Grid>
125+
</Grid>
126+
);
127+
}

0 commit comments

Comments
 (0)