Skip to content

Commit 751f093

Browse files
Tyrone6161Tyrone6161
committed
carousel 2 for PR
1 parent 1046cd9 commit 751f093

File tree

2 files changed

+91
-144
lines changed

2 files changed

+91
-144
lines changed

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

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,13 @@ import Carousel6 from './carousel6';
1010
import Carousel7 from './carousel7';
1111

1212
const items = [
13-
// { component: <Carousel1 />, alt: 'Carousel 1' },
14-
{ component: <Carousel2 />, alt: 'Carousel 2' },
15-
// { component: <Carousel3 />, alt: 'Carousel 3' },
16-
// { component: <Carousel4 />, alt: 'Carousel 4' },
17-
// { component: <Carousel5 />, alt: 'Carousel 5' },
18-
// { component: <Carousel6 />, alt: 'Carousel 6' },
19-
// { component: <Carousel7 />, alt: 'Carousel 7' },
13+
{ component: <Carousel1 />, alt: 'Carousel 1' },
14+
{ component: <Carousel2 />, alt: 'Carousel 2' },
15+
{ component: <Carousel3 />, alt: 'Carousel 3' },
16+
{ component: <Carousel4 />, alt: 'Carousel 4' },
17+
{ component: <Carousel5 />, alt: 'Carousel 5' },
18+
{ component: <Carousel6 />, alt: 'Carousel 6' },
19+
{ component: <Carousel7 />, alt: 'Carousel 7' },
2020
];
2121

2222
const BulsuPips101 = () => {

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

Lines changed: 84 additions & 137 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,9 @@ import React from "react";
22
import { Typography } from "@material-ui/core";
33
import BalanceOutlinedIcon from "@mui/icons-material/BalanceOutlined";
44
import PlayArrowSharpIcon from "@mui/icons-material/PlayArrowSharp";
5-
import { textAlign } from "@mui/system";
65

76

87
const Carousel2 = () => {
9-
10-
118
const logo = {
129
height: "100%",
1310
maxWidth: "100%",
@@ -23,91 +20,80 @@ const Carousel2 = () => {
2320
backgroundColor: "#7d0001",
2421
color: "white",
2522
fontStyle: "italic",
26-
width: "100%", // Ensures full-width layout
23+
width: "100%",
2724
marginBottom: "30px",
2825
};
2926

3027
const body = {
3128
display: "flex",
3229
flexDirection: "row",
33-
justifyContent: "flex-start", // Adjusted spacing
30+
justifyContent: "center", // Space sections evenly
3431
alignItems: "flex-start",
3532
textAlign: "justify",
36-
width: "100%", // Ensures full-width layout
37-
paddingBottom: "40px", // Ensures space for footer
33+
padding: "20px", // Adds spacing from edges
3834
};
39-
35+
4036
const bodyContent = {
4137
display: "flex",
42-
flexDirection: "row",
43-
justifyContent: "flex-start",
44-
alignItems: "flex-start",
38+
flexDirection: "column",
39+
justifyContent: "center",
40+
alignItems: "flex-start", // Align text to left
4541
textAlign: "justify",
46-
width: "100%", // Ensures full-width layout
47-
paddingBottom: "60px", // Ensures space for footer
48-
marginRight: "110px",
42+
width: "45%", // Adjusts width for balance
43+
backgroundColor: "white", // Keeps it clean
44+
padding: "20px",
45+
borderRadius: "8px",
4946
};
50-
51-
const footer = {
52-
width: "100%",
53-
backgroundColor: "#7d0001",
54-
color: "white",
55-
textAlign: "center",
56-
padding: "20px 0",
57-
fontSize: "18px",
58-
marginTop: "5px", // Adds space above footer
47+
48+
const description_title = {
5949
display: "flex",
60-
justifyContent: "space-between", // Positions items on the left and right
61-
paddingLeft: "20px", // Adds padding to the left
62-
paddingRight: "20px", // Adds padding to the right
50+
alignItems: "center",
51+
gap: "10px",
52+
fontWeight: "bold",
53+
color: "blue",
54+
fontSize: "22px",
55+
fontStyle: "italic",
56+
alignSelf: "flex-start",
57+
6358
};
64-
59+
6560
const intro = {
6661
display: "block",
6762
color: "#7d0001",
6863
fontSize: "22px",
6964
fontWeight: "bold",
70-
marginLeft: "30px",
71-
textAlign:'justify'
65+
textAlign: 'justify'
7266
};
73-
74-
const description_title = {
75-
display: "flex",
76-
alignItems: "center",
77-
gap: "8px",
78-
fontWeight: "bold",
79-
color: "blue",
80-
fontSize: "22px",
81-
fontStyle: "italic",
82-
83-
84-
}
85-
67+
8668
const description = {
69+
textAlign: "justify",
8770
display: "block",
88-
marginLeft: "30px",
89-
textAlign: 'justify'
90-
}
91-
71+
};
72+
73+
74+
const footer = {
75+
width: "100%",
76+
backgroundColor: "#7d0001",
77+
color: "white",
78+
textAlign: "center",
79+
padding: "20px 0",
80+
fontSize: "18px",
81+
marginTop: "5px",
82+
display: "flex",
83+
justifyContent: "space-between",
84+
paddingLeft: "20px",
85+
paddingRight: "20px",
86+
};
9287

9388

9489
return (
95-
<div
96-
style={{
97-
display: "flex",
98-
flexDirection: "column",
99-
width: "100%",
100-
height: "100%",
101-
}}
102-
>
90+
<div>
10391
<div style={header}>
104-
<div>
105-
<img
106-
src="./logo192.png"
107-
alt="BulSU PIPS Logo"
108-
style={{ ...logo, marginRight: "30px" }}
109-
/>
110-
</div>
92+
<img
93+
src="./logo192.png"
94+
alt="BulSU PIPS Logo"
95+
style={{ ...logo, marginRight: "30px" }}
96+
/>
11197
<div>
11298
<Typography
11399
variant="h4"
@@ -125,85 +111,46 @@ const Carousel2 = () => {
125111
THE LAW
126112
</Typography>
127113
</div>
128-
<div>
129-
<BalanceOutlinedIcon
130-
style={{ fontSize: "140px", marginLeft: "30px" }}
131-
/>
132-
</div>
114+
<BalanceOutlinedIcon
115+
style={{ fontSize: "140px", marginLeft: "30px" }}
116+
/>
133117
</div>
134118

135119
<div style={body}>
136-
<div>
137-
<div style={bodyContent}>
138-
<div>
139-
<Typography
140-
variant="body1"
141-
style={{
142-
marginTop: "40px",
143-
textAlign: "left",
144-
marginLeft: "100px",
145-
}}
146-
gutterBottom
147-
>
148-
<span
149-
style={description_title}
150-
>
151-
<PlayArrowSharpIcon /> Executive Order No. 27 s. 2017
152-
</span>
153-
154-
<span
155-
style={intro}
156-
>
157-
On the implementation of the 2017 – 2022 Philippine
158-
Development Plan (PDP).
159-
</span>
160-
161-
<span style={description}>
162-
The implementation of the 2017 – 2022 Philippine Development
163-
Plan (PDP), the annual updating of Philippine Investment
164-
Program (PIP), and the updating of the Three-Year Rolling
165-
Infrastructure Projects (TRIP), has been exerting efforts to
166-
create its priority Projects and Programs (PAPs) or FY 2022 as
167-
an input to the budget preparation for the said Fiscal Year
168-
</span>
169-
</Typography>
170-
</div>
171-
</div>
172-
</div>
173-
<div style={bodyContent}>
174-
<div></div>
175-
<div>
176-
<Typography
177-
variant="body1"
178-
style={{
179-
marginTop: "40px",
180-
textAlign: "left",
181-
marginLeft: "120px",
182-
}}
183-
gutterBottom
184-
>
185-
<span
186-
style={description_title}
187-
>
188-
<PlayArrowSharpIcon /> Section 4, Feb 18, 2020
189-
</span>
120+
<div style={bodyContent}>
121+
<Typography variant="body1" gutterBottom>
122+
<span style={description_title}>
123+
<PlayArrowSharpIcon /> Executive Order No. 27 s. 2017
124+
</span>
125+
<span style={intro}>
126+
On the implementation of the 2017 – 2022 Philippine Development Plan (PDP).
127+
</span>
128+
<span style={description}>
129+
The implementation of the 2017 – 2022 Philippine Development Plan (PDP), the annual
130+
updating of Philippine Investment Program (PIP), and the updating of the Three-Year
131+
Rolling Infrastructure Projects (TRIP), has been exerting efforts to create its priority
132+
Projects and Programs (PAPs) for FY 2022 as an input to the budget preparation for the
133+
said Fiscal Year.
134+
</span>
135+
</Typography>
136+
</div>
137+
138+
<div style={bodyContent}>
139+
<Typography variant="body1" gutterBottom>
140+
<span style={description_title}>
141+
<PlayArrowSharpIcon /> Section 4, Feb 18, 2020
142+
</span>
143+
<span style={intro}>
144+
Call for preparation of FY 2022 PAPs by CHED.
145+
</span>
146+
<span style={description}>
147+
It requires SUC to seek endorsement/approval of the proposed PAPs from the Governing
148+
Board before its enrollment to the NEDA PIP Online (PIPOL) System.
149+
</span>
150+
</Typography>
151+
</div>
152+
</div>
190153

191-
<span
192-
style={intro}
193-
>
194-
Call for preparation of FY 2022 PAPs by CHED.
195-
</span>
196-
197-
<span style={description}>
198-
{" "}
199-
It requires SUC to seek endorsement/approval of the proposed
200-
PAPs from the Governing Board before its enrollment to the NEDA
201-
PIP Online (PIPOL) System.
202-
</span>
203-
</Typography>
204-
</div>
205-
</div>
206-
</div>
207154
{/* Footer */}
208155
<div style={footer}>
209156
<Typography variant="body1">
@@ -215,4 +162,4 @@ const Carousel2 = () => {
215162
);
216163
};
217164

218-
export default Carousel2;
165+
export default Carousel2;

0 commit comments

Comments
 (0)