Skip to content

Commit

Permalink
added mentorship, revamp UI, change bottom nav
Browse files Browse the repository at this point in the history
  • Loading branch information
rakshaa2000 committed Jul 30, 2022
1 parent 56c641d commit 0ac80bd
Show file tree
Hide file tree
Showing 7 changed files with 97 additions and 17 deletions.
2 changes: 1 addition & 1 deletion src/components/bottomnav.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export default function BottomNav(){
)
}
const actions = [
{ icon:<Github/>, name:"Repo"},
{ icon:<Github/>, name:"Contribute"},
{ icon: <Copy />, name: 'Copy' },
{ icon: <WebShare />, name: 'Share' },
{ icon: <Calendly/>, name: "Mock Interviews"}
Expand Down
2 changes: 1 addition & 1 deletion src/components/cardres.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export default function CardRes(s){
<p>
{s.name}{" "}
<a href={s.link} target="_blank">
<LibraryBooks/>
<LibraryBooks color="secondary"/>
</a>
</p>
</Card>
Expand Down
7 changes: 7 additions & 0 deletions src/components/header.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import BottomNav from "./bottomnav";
import { createTheme, ThemeProvider } from "@mui/material/styles";
import { pink, purple } from "@mui/material/colors";
import { DarkMode, DarkModeTwoTone, LightMode, LightModeTwoTone } from "@mui/icons-material";
import Mentorships from "../routes/mentorship";

// Define theme settings
const light = createTheme( {
Expand Down Expand Up @@ -115,6 +116,9 @@ const Navi = () => {
<Nav.Link as={NavLink} to="/inspiration">
Get Inspired
</Nav.Link>
<Nav.Link as={NavLink} to="/mentorship">
Mentorship
</Nav.Link>
</Nav>
</Navbar.Collapse>
</Container>
Expand Down Expand Up @@ -151,6 +155,9 @@ const Navi = () => {
<Route path="/quiz">
<Quiz/>
</Route>
<Route path="/mentorship">
<Mentorships/>
</Route>
</Switch>
</Router>
<BottomNav/>
Expand Down
4 changes: 2 additions & 2 deletions src/routes/hackathons.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ function Hackathon(props){
return(
<Card className="hack">
<Badge badgeContent={"MLH"} sx={{"& .MuiBadge-badge":{backgroundColor:"#9943ab", color:"#fff"}}}><img src={props.imageUrl} width="100px" style={{margin:"5px"}}/></Badge>
<h5>{props.name} <a href={props.url} target="_blank"><OpenInNew/></a></h5>
<h5>{props.name} <a href={props.url} target="_blank"><OpenInNew color="secondary"/></a></h5>
<CardActionArea className="ca">
<Button size="small" className="lm" color="secondary">{props.location}</Button>
</CardActionArea>
Expand All @@ -23,7 +23,7 @@ function Hackathon(props){
<Card className="hack">
<Badge badgeContent={props.type} sx={{"& .MuiBadge-badge":{backgroundColor:"#db608b", color:"#fff"}}}>
<img src={props.img} width="100px" style={{margin:"5px"}}/></Badge>
<h5>{props.name} <a href={props.link} target="_blank"><OpenInNew/></a></h5>
<h5>{props.name} <a href={props.link} target="_blank"><OpenInNew color="secondary"/></a></h5>
<CardActionArea className="ca">
<Button size="small" className="lm" color="secondary">{props.date}</Button>
</CardActionArea>
Expand Down
84 changes: 84 additions & 0 deletions src/routes/mentorship.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
import { faGithub } from "@fortawesome/free-brands-svg-icons";
import { faPenClip } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Button, Card, CardActions, IconButton, Typography } from "@mui/material";
import { GitHub, OpenInNew } from "@mui/icons-material";
import { Badge, Pagination } from "@mui/material";
import { useState } from "react";

function Mentorship(props){
return(
<Card className="Card2 item1 opp">
<h5>{props.name} </h5>
<h7 style={{color:"#f56991"}}>{props.org}</h7>
<h7>Join as</h7>
<CardActions className="ca">
<Button size="small" color="secondary" href={props.mentee} className="lm" target="_blank" variant="outlined">Mentee</Button>
<Button size="small" color="secondary" href={props.mentor} className="lm" target="_blank" variant="outlined">Mentor</Button>
</CardActions>
</Card>
)
}

export default function Mentorships(){
const [search, setSearch] = useState('');
const [page, setpage] = useState(1);
const handlePageChange = (event, newPage) => {
setpage(newPage);
}
let list = [
{
name:"Womentors",
org:"Superposition Chennai",
mentor:"https://t.co/Blp0y87ZYN",
mentee:"https://t.co/Blp0y87ZYN"
},
{
name:"Connect",
org:"Command Tech",
mentor:"https://connect.commandtech.dev/register",
mentee:"https://connect.commandtech.dev/register"
},
{
org:"AnitaB.org Mentorship",
name:"AnitaB.org",
mentor:"https://membership.anitab.org/page/mentorship",
mentee:"https://membership.anitab.org/page/mentorship"
},
{
name:"Codess Cafe",
org:"Codess Cafe",
mentor:"https://codess.cafe/",
mentee:"https://codess.cafe/"
},
]
return(
<div className="App" style={{
fontFamily: "Poppins",
width: "100%",
alignContent: "center",
padding: "2%"}}
>
<h2 >Mentorship</h2>
<h4>Check out upcoming mentorship programs for Women+ in Tech</h4>
<h6>Want to add a program here? Open a PR <a href="https://github.com/Superposition-Chennai/Coding-Chrysanthemums" target="_blank"><IconButton><GitHub/></IconButton></a></h6>
<input type="text" placeholder="Search a program 🔍" onChange={event=>{setSearch(event.target.value)}} style={{width:"70%", height:"40px", padding:"2%", borderRadius:"20px", border:"none", background:"#FFE8F4", margin:"1%"}}/>
<Pagination siblingCount={0} showFirstButton showLastButton count={Math.ceil(list.length/8)} sx={{display:"flex",justifyContent:"center"}} color="secondary" page={page} onChange={handlePageChange}/>
<div className="list1">
{search==""?list.slice((page-1)*8,page*8).map(Mentorship):list.filter((val)=>{
if(val.name.toLowerCase().includes(search.toLowerCase())){
return val
}
else if(val.type.toLowerCase().includes(search.toLowerCase())){
return val
}
else if(val.time.toLowerCase().includes(search.toLowerCase())){
return val
}

}).slice((page-1)*8,page*8).map(Mentorship)}
</div>

</div>
);
}
2 changes: 1 addition & 1 deletion src/routes/opportunities.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ function Opportunity(props){
<h5>{props.name} </h5><br/>
<Badge badgeContent={props.type} sx={{".MuiBadge-badge":{backgroundColor:"#f06c91", color:"#fff"}}}className="opptype"></Badge>
<CardActions className="ca">
<Button size="small" href={props.link} className="lm" target="_blank">Learn More <OpenInNew/></Button>
<Button size="small" color="secondary" className="lm">{props.time}</Button>
<Button size="small" color="secondary" href={props.link} className="lm" target="_blank"><OpenInNew/></Button>
</CardActions>
</Card>
)
Expand Down
13 changes: 1 addition & 12 deletions src/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -96,18 +96,7 @@ html {
border-radius: 20px !important;
}
.carousel-indicators li { border-top: unset; width: 10px; border-bottom: unset; border: 1px solid transparent; border-left-width: 0; border-right-width: 0; border-radius: 10px; background-color: rgba(255, 255, 255, 0.4); height: 10px; width: 20px;} .carousel-indicators .active { border-top: unset; border-bottom: unset; border: 1px solid transparent; border-left-width: 0; border-right-width: 0; border-radius: 10px; background-color: #ffffff; height: 10px; width: 50px}
a {
color: #db467f;
}
a:hover {
color: #c71c5e;
}
a:visited {
color: #db467f;
}
a:visited:hover {
color: #c71c5e;
}

.list {
display: flex;
flex-wrap: wrap;
Expand Down

0 comments on commit 0ac80bd

Please sign in to comment.