Adds stand for section in campus leads (#55)

* Add stand for section in campus leads

* Removes redundent element

Author: GangaChatrvedi

public/static/campusLeaders/standFor.png

@@ -0,0 +1,145 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+
+import {
+    Box,
+    Container,
+    Grid,
+    Hidden,
+    Typography,
+    makeStyles
+} from '@material-ui/core';
+
+
+const useStyles = makeStyles(theme => ({
+    root: {
+        background: '#FFF',
+        paddingTop: 80,
+        paddingBottom: 60,
+        paddingLeft: 70,
+        paddingRight: 70,
+        [theme.breakpoints.down('md')]: {
+            paddingLeft: 15,
+            paddingRight: 15
+        }
+    },
+    extraPadding: {
+        padding: '0 70px 0px 0px',
+        textAlign: 'justify',
+        [theme.breakpoints.down('sm')]: {
+            padding: '0'
+        }
+    },
+    image: {
+        perspectiveOrigin: 'left center',
+        transformStyle: 'preserve-3d',
+        perspective: 1500,
+        '& > img': {
+            maxWidth: '100%',
+            height: 'auto',
+            backfaceVisibility: 'hidden'
+        },
+        [theme.breakpoints.down('md')]: {
+            alignItems: 'center',
+            display: 'flex',
+            flexDirection: 'column',
+            height: '100%',
+            justifyContent: 'center'
+        }
+    },
+    hide: {
+        display: 'none'
+    },
+    btn: {
+        backgroundColor: '#A60000',
+        color: '#ffffff',
+        textTransform: 'capitalize',
+        [theme.breakpoints.down('sm')]: {
+            width: '100%'
+        },
+        '&:hover': {
+            backgroundColor: 'rgba(166, 0, 0, 0.8)'
+        }
+    },
+    listPointers: {
+        fontSize: '45px',
+        marginRight: '5px'
+    }
+}));
+
+function StandsFor({ className, ...rest }) {
+    const classes = useStyles();
+
+    return (
+        <div className={clsx(classes.root, className)} {...rest}>
+            <Container maxWidth="lg">
+                <Typography
+                    style={{ marginTop: '10px' }}
+                    variant="h2"
+                    align="center"
+                    gutterBottom
+                    color="textPrimary"
+                >
+                    What Does the Campus Leader Stands For
+        </Typography>
+                <Grid container spacing={3} style={{ marginTop: '50px' }}>
+                    <Grid item xs={12} md={6}>
+                        <Box
+                            display="flex"
+                            flexDirection="column"
+                            justifyContent="center"
+                            height="100%"
+                            className={clsx(classes.extraPadding, className)}
+                        >
+                            <Box>
+                                <Typography variant="body1">
+                                    <b>Campus Leaders at Code For Cause</b> are the entreprenurial mindset people who want create value in the community by awaring people, and gathering the like minded to work for cause. And above all set example and influence on people for contributing. So, some values and the expectations we have from our campus leaders are
+                </Typography>
+                            </Box>
+                            <Box mt={5}>
+                                <Typography variant="body1">
+                                    He/she shall be entusiastic about going social and build &amp; contribute for the community<h4>- An Initiative taker</h4>
+                                </Typography>
+                            </Box>
+                            <Box mt={4}>
+                                <Typography variant="body1">
+                                    A Leader shall always have a way of talking people out from problems and leading them to do that for others too <h4> - A Community Builder</h4>
+                                </Typography>
+                            </Box>
+                            <Box mt={4}>
+                                <Typography variant="body1">
+                                    He/she should be connecting to the resources available in community that might help in building a better &amp; more helpful community <h4>- A Resource Seeker</h4>
+                                </Typography>
+                            </Box>
+                            <Box mt={4}>
+                                <Typography variant="body1">
+                                    Most sought after value - an effort maker and giving peronality  <h4>- An Investor</h4>
+                                </Typography>
+                            </Box>
+
+                        </Box>
+                    </Grid>
+                    <Hidden smDown>
+                        <Grid item xs={12} md={6}>
+                            <Box>
+                                <div className={classes.image}>
+                                    <img
+                                        alt="codeforcauseimg"
+                                        src="/static/campusLeaders/standFor.png"
+                                    />
+                                </div>
+                            </Box>
+                        </Grid>
+                    </Hidden>
+                </Grid>
+            </Container>
+        </div >
+    );
+}
+
+StandsFor.propTypes = {
+    className: PropTypes.string
+};
+
+export default StandsFor;

src/views/pages/CAView/StandFor.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { makeStyles } from '@material-ui/core';
 import Page from 'src/components/Page';
 import Hero from './Hero';
+import StandFor from './StandFor';
 
 const useStyles = makeStyles(() => ({
   root: {}
@@ -13,6 +14,7 @@ function HomeView() {
   return (
     <Page className={classes.root} title="Campus Leaders">
       <Hero />
+      <StandFor />
     </Page>
   );
 }