Skip to content

Commit 0d136a3

Browse files
SidharthMishra-07SidharthMishra-07
committed
Matches Updated
1 parent 6c7266f commit 0d136a3

File tree

7 files changed

+118
-5
lines changed

7 files changed

+118
-5
lines changed

‎frontend/src/App.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import Moreinfo from "./Pages/Moreinfo.js";
77
import Account from "./Pages/Account.js";
88
import Match from "./Pages/Match.js";
99
import LandingSection from "./components/LandingSection/LandingSection";
10+
import Matches from "./Pages/Matches";
1011
import {
1112
BrowserRouter as Router,
1213
Switch,
@@ -28,19 +29,22 @@ function App() {
2829
<Route exact path="/Moreinfo">
2930
<Moreinfo/>
3031
</Route>
32+
<Route exact path="/Matches">
33+
<Matches/>
34+
</Route>
3135
<Route exact path="/">
3236
{loggedin ? (
3337
<LandingSection/>
3438
) : (
35-
<Account switch={islogin} toggle={(gaga) => setIslogin(gaga)}></Account>
39+
<Account switch={islogin} toggle={(gaga) => setIslogin(gaga)}/>
3640
)}
3741

3842
<div className="question">
39-
<QnA></QnA>
43+
<QnA/>
4044
</div>
4145

4246
<div className="footer">
43-
<Footer></Footer>
47+
<Footer/>
4448
</div>
4549
</Route>
4650
</Switch>

‎frontend/src/Pages/Matches.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.w-100 {
2+
width: 100% !important;
3+
height: 75vh;
4+
}

‎frontend/src/Pages/Matches.js

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
import React from "react";
2+
import Carousel from "react-bootstrap/Carousel";
3+
import { Modal,Button } from "react-bootstrap";
4+
import "./Matches.css";
5+
function MyVerticallyCenteredModal(props) {
6+
return (
7+
<Modal
8+
{...props}
9+
size="lg"
10+
aria-labelledby="contained-modal-title-vcenter"
11+
centered
12+
>
13+
<Modal.Header closeButton>
14+
<Modal.Title id="contained-modal-title-vcenter">
15+
Modal heading
16+
</Modal.Title>
17+
</Modal.Header>
18+
<Modal.Body >
19+
<h4>Centered Modal</h4>
20+
<p>
21+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatum ex optio obcaecati, officiis deserunt modi aperiam accusamus accusantium soluta totam vitae similique sapiente nihil vel inventore eum in, sit animi ut delectus esse voluptas excepturi neque sunt? Laborum sit nostrum temporibus laudantium impedit doloremque optio tempora possimus ut, est quaerat recusandae quibusdam dignissimos provident, explicabo repellendus dolore? Ex velit, possimus quis quam temporibus doloremque nobis. Labore neque inventore iusto veniam, dolorum ipsa nihil facilis quod nobis? Error cupiditate sit similique tenetur fugit distinctio fuga eveniet eligendi porro voluptas, enim, maiores vero hic, magnam rerum placeat dolor. Facere, inventore. Sequi, qui!
22+
</p>
23+
</Modal.Body>
24+
<Modal.Footer>
25+
<Button onClick={props.onHide} variant="success">Accept </Button>
26+
<Button onClick={props.onHide} variant="danger">Reject</Button>
27+
</Modal.Footer>
28+
</Modal>
29+
);
30+
}
31+
const Matches = () => {
32+
const [modalShow, setModalShow] = React.useState(false);
33+
return (
34+
<div className="container">
35+
<Carousel>
36+
<Carousel.Item onClick={() => setModalShow(true)}>
37+
<img
38+
className="d-block w-100"
39+
src="https://source.unsplash.com/WLUHO9A_xik/500x500"
40+
alt="First slide"
41+
/>
42+
43+
</Carousel.Item >
44+
<Carousel.Item onClick={() => setModalShow(true)}>
45+
<img
46+
className="d-block w-100"
47+
src="https://source.unsplash.com/user/erondu/500x500"
48+
alt="Second slide"
49+
/>
50+
51+
52+
</Carousel.Item>
53+
<Carousel.Item onClick={() => setModalShow(true)}>
54+
<img
55+
className="d-block w-100"
56+
src="https://source.unsplash.com/user/erondu/500x500"
57+
alt="Third slide"
58+
/>
59+
60+
</Carousel.Item>
61+
</Carousel>
62+
<MyVerticallyCenteredModal
63+
show={modalShow}
64+
onHide={() => setModalShow(false)}
65+
/>
66+
</div>
67+
68+
);
69+
};
70+
71+
export default Matches;

‎frontend/src/Pages/Moreinfo.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,12 @@ body{
77
}
88
.MoreInfoProfile{
99
background-color: #FE0074;
10+
margin-bottom: 6.5rem;
1011
}
1112
.img-div{
1213
height: "60px";
1314
width: "60px";
14-
15+
1516
}
1617
.uploadImg{
1718
width: "100%";

‎frontend/src/Pages/Moreinfo.js

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ function Moreinfo() {
3838
<form method=" ">
3939
<div className="row">
4040
<div className="col-md-4 mt-4 mb-3 mx-3 img-div">
41-
<input type="file" accept="image/*" onChange={handleImageUpload} ref={imageUploader} style={{ display:"none" }} />
41+
<input type="file" accept="image/*" onChange={handleImageUpload} ref={imageUploader} style={{ display: "none" }} />
4242
<div className="img-div" onClick={() => imageUploader.current.click()}>
4343
<img
4444
src="https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_1280.png"
@@ -87,7 +87,36 @@ function Moreinfo() {
8787
</div>
8888
</form>
8989
</div>
90+
91+
<div className="footer">
92+
<div className="row">
93+
<div className="footer col-lg-6">
94+
<div className="cl">
95+
<h4> Connect With Us </h4>
96+
</div>
97+
</div>
98+
99+
<div class="footer-content">
100+
<h4>Follow us on</h4>
101+
<ul class="socials">
102+
<li><a href="https://www.facebook.com/codechefvit/"><i class="fa fa-facebook-square"></i></a></li>
103+
<li><a href="https://twitter.com/codechefvit?lang=en"><i class="fa fa-twitter"></i></a></li>
104+
<li><a href="https://www.instagram.com/codechefvit/?hl=en"><i class="fa fa-instagram"></i></a></li>
105+
<li><a href="https://github.com/CodeChefVIT?language=java"><i class="fa fa-github"></i></a></li>
106+
<li><a href="https://www.linkedin.com/company/codechef-vit-chapter/mycompany/"><i
107+
class="fa fa-linkedin-square"></i></a></li>
108+
</ul>
109+
</div>
110+
<div class="footer-bottom">
111+
<p> &copy; Copyright 2021 | Made With 💜 by
112+
<a href="http://www.codechefvit.com" target="_blank">
113+
<span> CodeChef-VIT</span>
114+
</a>
115+
</p>
116+
</div>
90117

118+
</div>
119+
</div>
91120
</>
92121
);
93122
}

‎frontend/src/components/Footer.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
.footer{
2+
width: 100%;
23
padding:20px ;
34
color:white;
45
background-color:black;

‎frontend/src/components/Navbar.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,9 @@ function Navbar(props) {
2121
<li class="nav-item">
2222
<Link className="nav-link active" aria-current="page" to="/Moreinfo">Profile</Link>
2323
</li>
24+
<li class="nav-item">
25+
<Link className="nav-link active" aria-current="page" to="/Matches">Matches</Link>
26+
</li>
2427
<li class="nav-item">
2528
<Link className="nav-link active" aria-current="page" to="/">Chats</Link>
2629
</li>

0 commit comments

Comments
 (0)