Skip to content

Commit 3d93b49

Browse files
authored
Merge branch 'FearlessTech:main' into network-page-wireframe
2 parents 06f5a25 + 7068959 commit 3d93b49

File tree

12 files changed

+87
-186
lines changed

12 files changed

+87
-186
lines changed

public/images/MaineRRLogo.png

-14.2 KB
Binary file not shown.

public/images/RRLogo.png

-5.48 KB
Binary file not shown.

src/Doublechecks.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
2+
3+
4+
In `src/components/ResourcesComponents/styledResourcePopup.jsx`
5+
under `const Popup = styled.div`
6+
```jsx
7+
margin: auto;
8+
margin-top: 4%;
9+
```

src/components/AboutUs.jsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ const AboutUs = (props) => {
1010
height="275"
1111
src="https://www.youtube.com/embed/pBy1zgt0XPc"
1212
title="YouTube video player"
13-
frameBorder="0"
1413
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
1514
allowFullScreen
1615
></iframe>

src/components/Posts/PostModal.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {
1717
AttachAssets,
1818
PostButton,
1919
Editor,
20-
} from "../../styles/stylesPostModal.jsx";
20+
} from "./stylesPostModal.jsx";
2121
import ReactPlayer from "react-player";
2222
import { useRef } from "react";
2323

src/components/Profile.jsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Link } from "react-router-dom";
33

44
import { AiOutlineUserAdd, AiOutlinePlus } from "react-icons/ai";
55
import { BsFillBookmarkFill } from "react-icons/bs";
6-
6+
import ResourceCheckBoxes from "./ResourceCheckBoxes";
77
import {
88
Container,
99
ArtCard,
@@ -23,7 +23,6 @@ import {
2323
PFHeading,
2424
Content,
2525
} from "../styles/stylesProfile.jsx";
26-
import ResourceCheckBoxes from "./ResourceCheckBoxes";
2726

2827
const Profile = (props) => {
2928
return (
Lines changed: 33 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,103 +1,44 @@
11
import React from "react";
22
import { AiOutlineCloseCircle } from "react-icons/ai";
3-
3+
import ResourceCheckBoxes from "../ResourceCheckBoxes";
44
import {
55
Popup,
6-
HR,
76
Top,
87
Content,
9-
SubContent,
10-
LeftCon,
11-
RightCon,
12-
Bottom,
13-
LeftB,
14-
RightB,
15-
Switch,
8+
RPUHeading,
9+
OrgInfo,
10+
ResourceDescription,
11+
ResourcesCheckBoxes,
1612
} from "./styledResourcePopup";
1713

18-
export const ResourcePopup = () => {
14+
export const ResourcePopup = (props) => {
1915
return (
20-
<Popup>
21-
<Top>
22-
<p>Resource alerts</p>
23-
<AiOutlineCloseCircle />
24-
</Top>
25-
<HR />
26-
<Content>
27-
<SubContent>
28-
<LeftCon>
29-
<h4>Resources</h4>
30-
<h6>Maine</h6>
31-
<p>Frequency: Daily via email and notification</p>
32-
<p>Get notified of similar Resources: Yes</p>
33-
</LeftCon>
34-
<RightCon>
35-
<img
36-
src="https://cdn-icons-png.flaticon.com/128/1659/1659682.png"
37-
alt=""
38-
/>
39-
<img
40-
src="https://cdn-icons-png.flaticon.com/128/1345/1345823.png"
41-
alt=""
42-
/>
43-
</RightCon>
44-
</SubContent>
45-
<SubContent>
46-
<LeftCon>
47-
<h4>resource at India</h4>
48-
<h6>India</h6>
49-
<p>Frequency: Daily via email and notification</p>
50-
<p>Get notified of similar Resources: Yes</p>
51-
</LeftCon>
52-
<RightCon>
53-
<img
54-
src="https://cdn-icons-png.flaticon.com/128/1659/1659682.png"
55-
alt=""
56-
/>
57-
<img
58-
src="https://cdn-icons-png.flaticon.com/128/1345/1345823.png"
59-
alt=""
60-
/>
61-
</RightCon>
62-
</SubContent>
63-
<SubContent>
64-
<LeftCon>
65-
<h4>resource at India</h4>
66-
<h6>India</h6>
67-
<p>Frequency: Daily via email and notification</p>
68-
<p>Get notified of similar Resources: Yes</p>
69-
</LeftCon>
70-
<RightCon>
71-
<img
72-
src="https://cdn-icons-png.flaticon.com/128/1659/1659682.png"
73-
alt=""
74-
/>
75-
<img
76-
src="https://cdn-icons-png.flaticon.com/128/1345/1345823.png"
77-
alt=""
78-
/>
79-
</RightCon>
80-
</SubContent>
81-
</Content>
82-
<HR />
83-
<Bottom>
84-
<LeftB>
85-
<h4>Resources recommendations</h4>
86-
<h6>
87-
Based on your Resources alerts, activity, and profile.
88-
<span className="blue">Learn more.</span>{" "}
89-
</h6>
90-
</LeftB>
91-
<RightB>
92-
{/* <span className='gray'>On</span> */}
93-
<Switch>
94-
<input />
95-
<span></span>
96-
</Switch>
97-
</RightB>
98-
</Bottom>
99-
<HR />
100-
<button>Done</button>
101-
</Popup>
16+
<>
17+
{props.showModal === "open" && (
18+
<Popup>
19+
<Top>
20+
<p>Resource alerts</p>
21+
<AiOutlineCloseCircle />
22+
</Top>
23+
<OrgInfo>
24+
<RPUHeading></RPUHeading>
25+
<img src="/images/user.svg" alt="" />
26+
<Content></Content>
27+
</OrgInfo>
28+
<ResourceDescription>
29+
<RPUHeading></RPUHeading>
30+
<Content></Content>
31+
</ResourceDescription>
32+
<ResourcesCheckBoxes>
33+
<RPUHeading></RPUHeading>
34+
<Content>
35+
<ResourceCheckBoxes />
36+
</Content>
37+
</ResourcesCheckBoxes>
38+
39+
<button>Done</button>
40+
</Popup>
41+
)}
42+
</>
10243
);
10344
};

src/components/ResourcesComponents/Resources.jsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import styles from "./Resources.module.css";
33
import ResourceOutput from "./ResourceOutput";
44
import ResourcesItem from "./ResourcesItem";
55
import { SearchResults } from "../Search/SearchResults";
6+
import PostModal from "../Posts/PostModal";
7+
import { ResourcePopup } from "./ResourcePopup";
68
const Resources = (props) => {
79
const [showModal, setShowModal] = useState("close");
810

@@ -58,6 +60,9 @@ const Resources = (props) => {
5860
<ResourcesItem />
5961
</div>
6062
</div>
63+
{showModal === "open" && (
64+
<ResourcePopup showModal={showModal} handleClick={handleClick} />
65+
)}
6166
</div>
6267
);
6368
};

src/components/ResourcesComponents/Resources.module.css

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
@import url(https://fonts.googleapis.com/css?family=Inter:100,200,300,regular,500,600,700,800,900);
22
.container {
3-
display: none;
43
padding-top: 103px;
54
max-width: 2150px;
65
display: flex;
7-
height: max-content;
6+
height: 80%;
87
gap: 73px;
98
background-color: #ffffff;
109
min-height: 100vh;
1110
padding-left: 75px;
1211
padding-right: 75px;
12+
overflow-y: scroll;
13+
overflow-x: hidden;
1314
}
1415
.searchBox {
1516
flex: 0 1 30%;

src/components/ResourcesComponents/styledResource.jsx

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,6 @@ const StyledLeftASide = styled.div`
3939
margin: 3rem auto;
4040
width: 100%;
4141
max-width: auto;
42-
width: 100%;
43-
max-width: auto;
4442
}
4543
`;
4644

@@ -125,8 +123,6 @@ const StyledMiddleAside = styled.div`
125123
margin: 1rem auto 0rem auto;
126124
width: 100%;
127125
max-width: auto;
128-
width: 100%;
129-
max-width: auto;
130126
}
131127
`;
132128

Lines changed: 35 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,23 @@
11
import styled from "styled-components";
22

33
const Popup = styled.div`
4+
position: fixed;
5+
top: 0;
6+
left: 0;
7+
right: 0;
8+
bottom: 0;
9+
z-index: 9999;
10+
background-color: whitesmoke;
411
width: 56%;
512
border-radius: 10px;
613
padding: 1%;
7-
margin: auto;
8-
margin-top: 3%;
14+
margin-left: auto;
15+
margin-right: auto;
16+
margin-top: 4%;
917
border: 1px solid rgb(201, 201, 201);
10-
height: 70%;
18+
height: 85%;
19+
overflow-y: scroll;
20+
overflow-x: hidden;
1121
button {
1222
border-radius: 50px;
1323
padding: 7px 20px;
@@ -18,11 +28,7 @@ const Popup = styled.div`
1828
cursor: pointer;
1929
}
2030
`;
21-
const HR = styled.div`
22-
width: 103.5%;
23-
margin-left: -1.9%;
24-
margin-top: 1%;
25-
`;
31+
2632
const Top = styled.div`
2733
display: flex;
2834
p {
@@ -44,94 +50,39 @@ const Top = styled.div`
4450
}
4551
`;
4652
const Content = styled.div`
47-
height: 300px;
53+
min-height: 100px;
54+
background-color: whitesmoke;
55+
margin-left: 40px;
4856
overflow-y: scroll;
4957
/* border: 1px solid blue; */
5058
`;
51-
const SubContent = styled.div`
59+
60+
const RPUHeading = styled.div`
61+
background-color: #077a7a;
62+
height: 50px;
5263
display: flex;
64+
flex-direction: row-reverse;
65+
align-items: center;
66+
padding-right: 20px;
67+
color: whitesmoke;
5368
`;
54-
const LeftCon = styled.div`
55-
width: 85%;
56-
line-height: 5px;
57-
/* border: 1px solid red; */
58-
h4 {
59-
hover {
60-
color: rgb(27, 126, 255);
61-
text-decoration: underline;
62-
cursor: pointer;
63-
}
64-
}
65-
p {
66-
color: gray;
67-
}
68-
`;
69-
const RightCon = styled.div`
70-
display: flex;
69+
70+
const OrgInfo = styled.div`
7171
img {
72-
width: 20px;
73-
margin: 15%;
74-
height: 20px;
75-
padding: 10%;
76-
/* border: 3px solid red; */
77-
hover {
78-
cursor: pointer;
79-
border-radius: 50px;
80-
background-color: rgb(209, 209, 209);
81-
}
82-
}
83-
`;
84-
const Bottom = styled.div`
85-
display: flex;
86-
`;
87-
const LeftB = styled.div`
88-
width: 85%;
89-
line-height: 5px;
90-
color: rgb(27, 126, 255);
91-
span {
92-
hover {
93-
text-decoration: underline;
94-
cursor: pointer;
95-
}
72+
width: 20%;
9673
}
9774
`;
98-
const RightB = styled.div`
99-
margin: 3% 0 0 -1%;
100-
`;
10175

102-
const Switch = styled.label`
103-
position: relative;
104-
display: inline-block;
105-
width: 60px;
106-
height: 34px;
107-
input {
108-
opacity: 0;
109-
width: 0;
110-
height: 0;
111-
}
112-
span {
113-
position: absolute;
114-
cursor: pointer;
115-
top: 0;
116-
left: 0;
117-
right: 0;
118-
bottom: 0;
119-
background-color: #ccc;
120-
-webkit-transition: 0.4s;
121-
transition: 0.4s;
122-
}
123-
`;
76+
const ResourceDescription = styled.div``;
77+
78+
const ResourcesCheckBoxes = styled.div``;
12479

12580
export {
12681
Popup,
127-
HR,
12882
Top,
12983
Content,
130-
SubContent,
131-
LeftCon,
132-
RightCon,
133-
Bottom,
134-
LeftB,
135-
RightB,
136-
Switch,
84+
RPUHeading,
85+
OrgInfo,
86+
ResourceDescription,
87+
ResourcesCheckBoxes,
13788
};

0 commit comments

Comments
 (0)