Skip to content

Commit 0c02b5f

Browse files
maryam-olabisimaryam-olabisi
committed
more admin fix; programs section
1 parent 9557147 commit 0c02b5f

21 files changed

+1620
-245
lines changed

‎src/App.js

+23-4
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,16 @@ import Resources from "../src/views/resources/resources";
1010
import ForgotPassword from "./views/Auth/ForgotPassword";
1111
import ResetPassword from "./views/Auth/ResetPassword";
1212
import Admin from "./views/admin/joint";
13+
import User from "./views/admin/users";
14+
import Program from "./views/admin/programs";
15+
import Repos from "./views/admin/repos";
16+
import AdminEvent from "./views/admin/events";
17+
import Programs from "./views/programs/programs";
18+
import ProgramOverview from "./views/programs/overview";
19+
import ConParticipant from "./views/programs/participants";
20+
import ConMentor from "./views/programs/mentors";
21+
import ConSponsor from "./views/programs/sponsors";
22+
1323

1424
import { ProtectedRoute, GuestRoute } from './components/routes';
1525

@@ -23,29 +33,38 @@ function App() {
2333
<GuestRoute exact
2434
path="/signup"
2535
name="SignUpForm"
26-
component={SignUpForm}
36+
component={SignUpForm}
2737
/>
2838
<GuestRoute exact
2939
path="/signin"
3040
name="LoginForm"
3141
component={LoginForm}
3242
/>
3343
<ProtectedRoute exact
34-
path ="/dashboard"
44+
path="/dashboard"
3545
component={Dashboard}
3646
/>
3747
<Route exact
38-
path ="/forgot-password"
48+
path="/forgot-password"
3949
component={ForgotPassword}
4050
/>
4151
<Route exact
42-
path ="/reset-password"
52+
path="/reset-password"
4353
component={ResetPassword}
4454
/>
55+
<Route path="/repos"> <Repos /> </Route>
56+
<Route path="/users"> <User /> </Route>
57+
<Route path="/adm/events"> <AdminEvent /> </Route>
58+
<Route path="/adm/programs"> <Program /> </Route>
4559
<Route path="/admin"> <Admin /> </Route>
4660
<Route path="/faq"> <FAQ /> </Route>
4761
<Route path="/resources"> <Resources /> </Route>
4862
<Route path="/events"> <Events /> </Route>
63+
<Route exact path="/programs"> <Programs /> </Route>
64+
<Route exact path="/contributhon/overview"> <ProgramOverview /> </Route>
65+
<Route exact path="/contributhon/participants"> <ConParticipant /> </Route>
66+
<Route exact path="/contributhon/mentors"> <ConMentor /> </Route>
67+
<Route exact path="/contributhon/sponsors"> <ConSponsor /> </Route>
4968
<Route path="/"> <Home /> </Route>
5069

5170
</Switch>

‎src/assets/images/c1.png

1.8 MB
Loading

‎src/assets/images/c2.jpg

324 KB
Loading

‎src/assets/images/thon_image.png

689 KB
Loading

‎src/components/admin-head.js

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import React, { Component } from 'react';
2+
import Logo from "../assets/icons/Logo.png";
3+
import '../styles/components/header.css';
4+
import { UserContext } from "../context/AuthContext"
5+
6+
class Header extends Component {
7+
constructor(props) {
8+
super(props);
9+
this.state = {
10+
status: true,
11+
};
12+
}
13+
14+
render() {
15+
const { token, user } = this.context
16+
return (
17+
<React.Fragment>
18+
<nav className="navbar navbar-expand-md navbar-lighter bg-lighter">
19+
<a className="navbar-brand" href="/">
20+
<img src={Logo} alt="Logo" className="logo" />
21+
</a>
22+
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
23+
<span className="navbar-toggler-icon">
24+
</span>
25+
{/* <i class="fas fa-bars"></i> */}
26+
</button>
27+
28+
<div className="collapse navbar-collapse" id="navbarSupportedContent">
29+
<ul className="navbar-nav mr-auto">
30+
<li className="nav-item active">
31+
<a className="nav-link" href="/admin">Dashboard <span className="sr-only">(current)</span></a>
32+
</li>
33+
<li className="nav-item active">
34+
<a className="nav-link" href="/users">Users</a>
35+
</li>
36+
<li className="nav-item active">
37+
<a className="nav-link" href="/adm/events">Events</a>
38+
</li>
39+
<li className="nav-item active">
40+
<a className="nav-link" href="/adm/programs">Programs</a>
41+
</li>
42+
<li className="nav-item active">
43+
<a className="nav-link" href="/repos">PRs</a>
44+
</li>
45+
</ul>
46+
<a className="nav-link" href="signout">Log Out</a>
47+
<a href="dashboard"><button className="btn btn-outline my-2 my-sm-0">Lola</button></a>
48+
</div>
49+
</nav>
50+
</React.Fragment>
51+
)
52+
}
53+
}
54+
Header.contextType = UserContext
55+
export default Header;

‎src/components/con_jumbotron.js

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import React from 'react';
2+
3+
const Jumb = () => {
4+
return (
5+
<div className="row hrs">
6+
<div className="col">
7+
<div className="row">
8+
<div className="col-md-8">
9+
<span className="sub-text">WORK ON A PROJECT</span>
10+
<div className="heading">
11+
<h2 className="heading-primary rewards_">
12+
Join the Bootcamp.
13+
</h2>
14+
<p className="heading-sub">
15+
In this Bootcamp, participants work with an open source organisation on a project for 8 weeks with the help of organisation mentors and get rewarded at the end of the Bootcamp upon successful project completion.
16+
</p>
17+
<p className="sub-div">
18+
<a href="/contributhon/participants"><button className="btn-sub btn-heading-sub">Get Started</button></a>
19+
</p>
20+
</div>
21+
</div>
22+
<div className="col"></div>
23+
</div>
24+
</div>
25+
<div className="col">
26+
<div className="row">
27+
<div className="col">
28+
<div className="reward-1">
29+
<p className="heading">Be a Mentor</p>
30+
<p>Mentor Organizations are participating open-source organizations which participants will work directly with during the Bootcamp. Mentor organizations are also program sponsors who indicate interest to participate as mentor organizations during the program.</p>
31+
<p className="sub-div">
32+
<a href="/contributhon/mentors"><button className="btn-sub btn-heading-sub">Read More</button></a>
33+
</p>
34+
</div>
35+
</div>
36+
<div className="col reward-2s">
37+
<div className="reward-2">
38+
<p className="heading">Be a Sponsor</p>
39+
<p>Sponsors are organizations or individuals with interests in the African tech ecosystem and gender diversity, willing to pave the way by helping cover costs involved in running the Bootcamp.</p>
40+
<p className="sub-div">
41+
<a href="/contributhon/sponsors"><button className="btn-sub btn-heading-sub">Find out More</button></a>
42+
</p>
43+
</div>
44+
</div>
45+
</div>
46+
</div>
47+
</div>
48+
)
49+
}
50+
51+
export default Jumb

‎src/components/con_overview.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import React from 'react';
2+
import '../styles/components/testimonial.css';
3+
import woman_down from '../assets/images/testimonial_woman.png';
4+
import woman_right from '../assets/images/testimonial_lady.png';
5+
6+
const Jumbotron = () => {
7+
return (
8+
<div className="row hrs">
9+
<div className="col left_">
10+
<img src={woman_down} alt="..." className="left_down" />
11+
</div>
12+
<div className="col-md-7 test_mid">
13+
<div className="heading">
14+
<h2 className="heading-primary rewards_ tac">
15+
An Overview of SCA Contributhon and How it Works
16+
</h2>
17+
<p className="heading-sub tac">
18+
The goal of this Bootcamp is to give African ladies hands-on experience collaborating and contributing to open source projects. During the program, participants spend 2 months working closely with an organisation involved in open source.
19+
</p>
20+
<p className="heading-sub tac">
21+
<a href="/contributhon/overview"><button className="btn-sub btn-heading-sub">Read More</button></a>
22+
</p>
23+
</div>
24+
25+
</div>
26+
<div className="col right_">
27+
<img src={woman_right} alt="..." className="right_up" />
28+
</div>
29+
</div>
30+
31+
)
32+
}
33+
34+
export default Jumbotron

‎src/components/dash-header.js

+3
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,9 @@ class Header extends Component {
3737
<li className="nav-item active">
3838
<a className="nav-link" href="/events">Events</a>
3939
</li>
40+
<li className="nav-item active">
41+
<a className="nav-link" href="/programs">Programs</a>
42+
</li>
4043
<li className="nav-item active">
4144
<a className="nav-link" href="/faq">FAQs</a>
4245
</li>

‎src/components/header.js

+8-5
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@ class Header extends Component {
1111
};
1212
}
1313

14-
14+
1515
render() {
16-
const { token, user } = this.context
16+
const { token, user } = this.context
1717
return (
1818
<React.Fragment>
1919
<nav className="navbar navbar-expand-md navbar-lighter bg-lighter">
@@ -35,13 +35,16 @@ class Header extends Component {
3535
<li className="nav-item active">
3636
<a className="nav-link" href="/events">Events</a>
3737
</li>
38+
<li className="nav-item active">
39+
<a className="nav-link" href="/programs">Programs</a>
40+
</li>
3841
<li className="nav-item active">
3942
<a className="nav-link" href="/faq">FAQs</a>
4043
</li>
4144
</ul>
42-
{!token ? <a className="nav-link" href="signin">Sign In</a>: ''}
43-
{user?.username ?
44-
<a href="dashboard"><button className="btn btn-outline my-2 my-sm-0">VISIT DASHBOARD</button></a> :
45+
{!token ? <a className="nav-link" href="signin">Sign In</a> : ''}
46+
{user?.username ?
47+
<a href="dashboard"><button className="btn btn-outline my-2 my-sm-0">VISIT DASHBOARD</button></a> :
4548
<a href="signup"><button className="btn btn-outline my-2 my-sm-0">GET STARTED</button></a>}
4649
</div>
4750
</nav>

‎src/styles/views/faq.css

+29-11
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
.jumbotron {
22
margin-bottom: 2rem;
3-
background-color: transparent!important;
3+
background-color: transparent !important;
44
border-radius: .3rem;
55
text-align: center;
66
color: #fff;
77
padding-top: 110px;
88
}
99

10-
.display-4, h1 {
10+
.display-4,
11+
h1 {
1112
font-size: 45px;
1213
font-weight: bold;
1314
font-family: FTPolar;
@@ -33,36 +34,44 @@
3334
background-color: transparent;
3435
border: none;
3536
border-radius: 0;
36-
37+
3738
}
3839

3940
.card-header {
4041
padding: .75rem 1.25rem 0px 0px;
4142
background-color: transparent;
4243
color: #BCBCBC;
43-
font-size: 13px;
44+
font-size: 15px;
4445
}
4546

4647
.open::after {
47-
content:'+';
48+
content: '+';
4849
font-size: 16px;
49-
float: right;
50+
float: right;
51+
}
52+
53+
.clos, a {
54+
color: #B70569;
55+
}
56+
57+
a:hover {
58+
color: #B70569;
5059
}
5160

5261
.clos::after {
53-
content:'-';
62+
content: '-';
5463
font-size: 16px;
55-
float: right;
64+
float: right;
5665
}
5766

5867
.accordion.collapsed::after {
59-
content:'-';
68+
content: '-';
6069
font-size: 16px;
6170
float: right;
6271
}
6372

6473
.card-header.collapsed::after {
65-
content:'-';
74+
content: '-';
6675
font-size: 16px;
6776
float: right;
6877
}
@@ -76,14 +85,23 @@
7685
text-align: left;
7786
color: #FFFFFF;
7887
opacity: 0.54;
79-
font-size: 10px;
88+
font-size: 12px;
8089
}
8190

8291
hr {
8392
border-bottom: 1px solid #707070;
8493
opacity: 0.42;
8594
}
8695

96+
.ac_list {
97+
list-style-type: square;
98+
}
99+
100+
iframe {
101+
width: 100%;
102+
height: 800px;
103+
}
104+
87105
@media (min-width: 1200px) {
88106
.lead {
89107
padding: 10px 45px 0;

‎src/views/admin/events.js

+6-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React from 'react';
2+
import Header from '../../components/admin-head';
23
import { makeStyles, withStyles } from '@material-ui/core/styles';
34
import MuiTableCell from "@material-ui/core/TableCell";
45
import {
@@ -75,8 +76,10 @@ function Events() {
7576

7677
return (
7778
<React.Fragment>
78-
<div className="admin-greeting"> <p>All Events</p></div>
79-
<div className="contribution-cards admin-cards">
79+
<Header />
80+
<div className="container">
81+
<div className="admin-greeting"> <p>All Events</p></div>
82+
<div className="contribution-cards admin-cards">
8083
<TableContainer component={Paper} className={classes.tableContainer}>
8184
<Table className={classes.table} aria-label="simple table">
8285
<TableHead style={{ backgroundColor: '#3F3F3F99' }}>
@@ -128,6 +131,7 @@ function Events() {
128131
</Table>
129132
</TableContainer>
130133
</div>
134+
</div>
131135
</React.Fragment>
132136
);
133137
}

0 commit comments

Comments
 (0)