Skip to content

Commit 4e1fa08

Browse files
neilbrianpadorneilbrianpador
authored
Merge pull request securedeveloper#6 from Planning-and-Development-BULSU/carousel6
Carousel6 for pr
2 parents adf2726 + 4375c5d commit 4e1fa08

File tree

1 file changed

+179
-13
lines changed

1 file changed

+179
-13
lines changed

‎src/sections/homePageSection/Components/carousel6.js‎

Lines changed: 179 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,188 @@
1-
import React from 'react';
1+
import React from "react";
2+
import { Typography } from "@mui/material";
3+
import { NoteAddOutlined, VerifiedUserOutlined, CalendarMonthOutlined, PublishOutlined, ApprovalOutlined, TerminalOutlined, LanguageOutlined, SettingsOutlined } from "@mui/icons-material";
24

35
const Carousel6 = () => {
4-
const styles = {
5-
backgroundColor: 'black',
6-
width: '100%',
7-
height: '100%',
8-
display: 'flex',
9-
justifyContent: 'center',
10-
alignItems: 'center',
11-
color: 'white',
12-
fontSize: '24px',
6+
const logo = {
7+
height: "100%",
8+
maxWidth: "100%",
9+
maxHeight: "120px",
10+
justifyContent: "center",
11+
alignItems: "center",
12+
};
13+
14+
const body = {
15+
display: "flex",
16+
justifyContent: "center",
17+
flexDirection: "column",
18+
alignItems: "flex-start",
19+
width: "100%",
20+
padding:"30px",
21+
};
22+
23+
const innerBody = {
24+
display: "flex",
25+
justifyContent: "space-between",
26+
gap: "40px",
27+
};
28+
29+
const bodyContent = {
30+
display: "flex",
31+
flexDirection: "column",
32+
width: "50%",
33+
textAlign: "left",
34+
};
35+
36+
const header = {
37+
display: "flex",
38+
justifyContent: "center",
39+
alignItems: "center",
40+
backgroundColor: "#95060c",
41+
color: "white",
42+
fontStyle: "italic",
43+
};
44+
45+
const footer = {
46+
display: "flex",
47+
justifyContent: "space-between",
48+
alignItems: "center",
49+
backgroundColor: "#95060c",
50+
color: "white",
51+
height: "50px",
52+
padding: "20px",
53+
};
54+
55+
const textStyle = {
56+
display: "flex",
57+
alignItems: "flex-start",
58+
gap: "15px",
59+
textAlign: "justify",
60+
fontWeight: "bold",
1361
};
1462

1563
return (
16-
<div style={styles}>
17-
Carousel 6
64+
<div>
65+
{/* Header */}
66+
<div style={header}>
67+
<img src="./logo192.png" style={logo} alt="logo" />
68+
<div>
69+
<Typography variant="h4" style={{ fontWeight: "bold" }}>
70+
<span style={{ color: "#ffc001" }}>BulSUPIPS </span>101
71+
</Typography>
72+
<Typography variant="h2" fontWeight="bold">
73+
PROCESS
74+
</Typography>
75+
</div>
76+
<SettingsOutlined style={{ width: "auto", fontSize: "8rem"}} />
77+
</div>
78+
79+
{/* Body */}
80+
<div style={body}>
81+
<Typography variant="h4" color="#ffc001" fontWeight="bold" style={{ fontStyle: "italic" }}gutterBottom>
82+
IP Evaluation Process
83+
</Typography>
84+
85+
86+
<div style={innerBody}>
87+
{/* Left side: Steps 1 & 2 */}
88+
<div style={bodyContent}>
89+
<div style={textStyle}>
90+
<VerifiedUserOutlined style={{ fontSize: "50px", color: "#95060c" }} />
91+
<div>
92+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
93+
Step 1
94+
</Typography>
95+
<Typography variant="h6">
96+
PDO Capacity Building and Investment Program Unit (CBIP) will access the encoded PAPs per college/office to{" "}
97+
<b>check whether the submitted PAPs have complete requirements to proceed with the evaluation.</b>
98+
</Typography>
99+
<Typography variant="h6" gutterBottom>
100+
Should the requirements be incomplete,{" "}
101+
<b>PDO will contact the IP Focal Person of the college or office to inform them that they need to resubmit to continue the evaluation.</b>
102+
</Typography>
103+
</div>
104+
</div>
105+
106+
<div style={textStyle}>
107+
<NoteAddOutlined style={{ fontSize: "50px", color: "#95060c" }} />
108+
<div>
109+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
110+
Step 2
111+
</Typography>
112+
<Typography variant="h6">
113+
PDOP CBIP will evaluate the responsiveness of the submitted IPs in accordance with the relevance to the targets of BulSU's 2021-2025 Strategic Plan.
114+
</Typography>
115+
</div>
116+
</div>
117+
</div>
118+
119+
{/* Right side: Steps 3-6 */}
120+
<div style={bodyContent}>
121+
<div style={textStyle}>
122+
<CalendarMonthOutlined style={{ fontSize: "50px", color: "#95060c" }} />
123+
<div>
124+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
125+
Step 3
126+
</Typography>
127+
<Typography variant="h6">
128+
If the PAP is approved, the investment requirements or the <b>budget distribution will be scheduled.</b>
129+
</Typography>
130+
</div>
131+
</div>
132+
133+
<div style={textStyle}>
134+
<PublishOutlined style={{ fontSize: "50px", color: "#95060c" }} />
135+
<div>
136+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
137+
Step 4
138+
</Typography>
139+
<Typography variant="h6">
140+
PDO CBIP will consolidate all of the evaluated PAPs to serve as the BulSU IP and summarize the approved PAPs based on the MTDP Goals.
141+
</Typography>
142+
</div>
143+
</div>
144+
145+
<div style={textStyle}>
146+
<ApprovalOutlined style={{ fontSize: "50px", color: "#95060c" }} />
147+
<div>
148+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
149+
Step 5
150+
</Typography>
151+
<Typography variant="h6">
152+
The BulSU IP will be submitted to the Office of the President for Approval.
153+
</Typography>
154+
</div>
155+
</div>
156+
157+
<div style={textStyle}>
158+
<TerminalOutlined style={{ fontSize: "50px", color: "#95060c" }} />
159+
<div>
160+
<Typography variant="h5" fontWeight="bold" style={{ color: "#95060c" }}gutterBottom>
161+
Step 6
162+
</Typography>
163+
<Typography variant="h6">
164+
Finally, the approved PAP will be submitted for Board approval and encoded to the PIPOL System.
165+
</Typography>
166+
</div>
167+
</div>
168+
</div>
169+
</div>
170+
</div>
171+
172+
{/* Footer */}
173+
<div style={footer}>
174+
<Typography variant="body1" style={{ fontWeight: "bold" }}>
175+
[email protected]
176+
</Typography>
177+
<div style={{ display: "flex", alignItems: "center", gap: "5px" }}>
178+
<LanguageOutlined style={{ fontSize: "1.2rem", color: "white" }} />
179+
<Typography variant="body1" style={{ fontWeight: "bold" }}>
180+
www.bulsu.edu.ph
181+
</Typography>
182+
</div>
183+
</div>
18184
</div>
19185
);
20186
};
21187

22-
export default Carousel6;
188+
export default Carousel6;

0 commit comments

Comments
 (0)