Skip to content

Commit 2c85b4e

Browse files
Fixed bug of contributor list in About Us page
1 parent 15892bd commit 2c85b4e

File tree

2 files changed

+141
-153
lines changed

2 files changed

+141
-153
lines changed

src/components/AboutUs.css

Lines changed: 140 additions & 152 deletions
Original file line numberDiff line numberDiff line change
@@ -1,245 +1,233 @@
11
body {
2-
background-color: #000;
3-
color: #fff;
4-
margin: 0;
5-
padding: 0;
6-
overflow-x: hidden;
2+
background-color: #000;
3+
color: #fff;
4+
margin: 0;
5+
padding: 0;
6+
overflow-x: hidden;
77
}
88

99
/* .about-container {
10-
padding: 20px;
10+
padding: 20px;
1111
} */
1212

1313
/* .about-content {
14-
display: flex;
15-
margin-bottom: 50px;
14+
display: flex;
15+
margin-bottom: 50px;
1616
}
1717
1818
.text-container {
19-
flex: 1;
19+
flex: 1;
2020
} */
2121
/* Hover effects for About Us */
2222
.about-content .about-title {
23-
/* font-style: italic; */
24-
/* font-size: 32px; */
25-
/* font-weight: bold; */
26-
/* margin-bottom: 20px; */
27-
/* margin-top: 100px; */
28-
/* margin-left: 35%; */
29-
transition: all 0.3s ease;
23+
/* font-style: italic; */
24+
/* font-size: 32px; */
25+
/* font-weight: bold; */
26+
/* margin-bottom: 20px; */
27+
/* margin-top: 100px; */
28+
/* margin-left: 35%; */
29+
transition: all 0.3s ease;
3030
}
3131

3232
.about-content .about-title:hover {
33-
font-size: 2.6em;
33+
font-size: 2.6em;
3434
}
3535

36-
3736
.about-text {
38-
/* font-style: italic; */
39-
/* font-size: 18px; */
40-
/* line-height: 1.6; */
41-
/* margin-bottom: 20px; */
42-
/* margin-left: 20px; */
37+
/* font-style: italic; */
38+
/* font-size: 18px; */
39+
/* line-height: 1.6; */
40+
/* margin-bottom: 20px; */
41+
/* margin-left: 20px; */
4342
}
4443

4544
.image-container {
46-
/* margin-right: 20px; */
45+
/* margin-right: 20px; */
4746
}
4847

4948
.about-image {
50-
/* width: 500px; */
51-
/* height: auto; */
52-
/* margin-top: 70px; */
53-
/* border-radius: 50%; */
54-
/* transition: transform 0.3s ease; */
49+
/* width: 500px; */
50+
/* height: auto; */
51+
/* margin-top: 70px; */
52+
/* border-radius: 50%; */
53+
/* transition: transform 0.3s ease; */
5554
}
5655

5756
.about-image:hover {
58-
transform: scale(1.1);
57+
transform: scale(1.1);
5958
}
6059

6160
.our-vision {
62-
/* display: flex; */
63-
/* margin-bottom: 50px; */
61+
/* display: flex; */
62+
/* margin-bottom: 50px; */
6463
}
6564

6665
.our-vision .text-container {
67-
/* flex: 1; */
68-
/* text-align: left; */
66+
/* flex: 1; */
67+
/* text-align: left; */
6968
}
7069

7170
.our-vision .image-container {
72-
/* margin-right: auto; */
73-
/* margin-left: 0; */
71+
/* margin-right: auto; */
72+
/* margin-left: 0; */
7473
}
7574

7675
.our-vision .about-title {
77-
/* margin-top: 0; */
78-
transition: font-size 0.3s ease;
76+
/* margin-top: 0; */
77+
transition: font-size 0.3s ease;
7978
}
8079

81-
8280
.our-vision .about-title:hover {
83-
font-size:2.6em;
81+
font-size: 2.6em;
8482
}
8583

8684
.our-vision .about-text {
87-
/* margin-bottom: 0; */
85+
/* margin-bottom: 0; */
8886
}
8987

9088
::-webkit-scrollbar {
91-
width: 10px;
92-
background-color: #000;
89+
width: 10px;
90+
background-color: #000;
9391
}
9492

9593
::-webkit-scrollbar-thumb:hover {
96-
background: black;
94+
background: black;
9795
}
9896

9997
::-webkit-scrollbar-thumb {
100-
background: #0a86c8;
101-
border-radius: 5px;
98+
background: #0a86c8;
99+
border-radius: 5px;
102100
}
103101

104102
::-webkit-scrollbar-track {
105-
background: #000;
103+
background: #000;
106104
}
107105

108106
.team-container {
109-
/* display: flex; */
110-
/* justify-content: space-between; */
111-
/* flex-wrap: wrap; */
112-
/* margin-top: 20px; */
107+
/* display: flex; */
108+
/* justify-content: space-between; */
109+
/* flex-wrap: wrap; */
110+
/* margin-top: 20px; */
113111
}
114112

115113
.team-member {
116-
/* text-align: center; */
117-
/* width: 23%; */
118-
/* margin-bottom: 20px; */
119-
transition: transform 0.3s ease;
114+
/* text-align: center; */
115+
/* width: 23%; */
116+
/* margin-bottom: 20px; */
117+
transition: transform 0.3s ease;
120118
}
121119
.middle-boy {
122-
text-align: center;
123-
margin-bottom: 70px;
124-
font-style: italic;
120+
text-align: center;
121+
margin-bottom: 70px;
122+
font-style: italic;
125123
}
126124
/* Hover effects for headings */
127-
h1::before {
128-
transform: scaleX(0);
129-
transform-origin: bottom right;
130-
}
131-
132-
h1:hover::before {
133-
transform: scaleX(1);
134-
transform-origin: bottom left;
135-
136-
}
137-
138-
h1::before {
139-
content: " ";
140-
display: block;
141-
position: absolute;
142-
top: 0; right: 0; bottom: 0; left: 0;
143-
inset: 0 0 0 0;
144-
background: hsl(200 100% 80%);
145-
z-index: -1;
146-
transition: transform .3s ease;
147-
}
148-
149-
h1 {
150-
position: relative;
151-
152-
153-
}
125+
h1::before {
126+
transform: scaleX(0);
127+
transform-origin: bottom right;
128+
}
154129

155-
/* hover effects for our team */
130+
h1:hover::before {
131+
transform: scaleX(1);
132+
transform-origin: bottom left;
133+
}
156134

157-
.our-team-section .our-team-heading:hover {
158-
font-size:1.5em;
135+
h1::before {
136+
content: " ";
137+
display: block;
138+
position: absolute;
139+
top: 0;
140+
right: 0;
141+
bottom: 0;
142+
left: 0;
143+
inset: 0 0 0 0;
144+
background: hsl(200 100% 80%);
145+
z-index: -1;
146+
transition: transform 0.3s ease;
159147
}
160-
.our-team-section .our-team-heading {
161-
transition:font-size 0.3s ease;
162-
163-
}
164148

149+
h1 {
150+
position: relative;
151+
}
165152

166-
img:hover{
167-
transform:scale(1.1);
168-
}
169-
img{
170-
transition:all 0.3s ease;
171-
}
172-
173-
174-
175-
@media (orientation: landscape) {
176-
body {
177-
grid-auto-flow: column;
178-
}
179-
}
180-
181-
182-
.team-member p {
183-
/* margin-top: 10px;
184-
font-size: 20px;
185-
font-weight: bold; */
153+
/* hover effects for our team */
154+
155+
.our-team-section .our-team-heading:hover {
156+
font-size: 1.5em;
157+
}
158+
.our-team-section .our-team-heading {
159+
transition: font-size 0.3s ease;
186160
}
187161

188-
#tsparticles{
189-
position: absolute;
190-
top: 0;
191-
left: 0;
192-
z-index: -1;
162+
img:hover {
163+
transform: scale(1.1);
164+
}
165+
img {
166+
transition: all 0.3s ease;
193167
}
194168

169+
@media (orientation: landscape) {
170+
body {
171+
grid-auto-flow: column;
172+
}
173+
}
195174

175+
.team-member p {
176+
/* margin-top: 10px;
177+
font-size: 20px;
178+
font-weight: bold; */
179+
}
180+
181+
#tsparticles {
182+
position: absolute;
183+
top: 0;
184+
left: 0;
185+
z-index: -1;
186+
}
196187

197188
.about-container {
198-
position: relative; /* positioning context */
199-
overflow-x: hidden;
200-
189+
position: relative; /* positioning context */
190+
overflow-x: hidden;
201191
}
202192

203193
@media screen and (max-width: 1198px) {
204-
.flex {
205-
flex-direction: column !important;
206-
}
194+
.flex {
195+
flex-direction: column !important;
196+
}
207197

208-
.image-container-one {
209-
order: -1;
210-
}
211-
.team-member {
212-
width: 48% !important;
213-
}
198+
.image-container-one {
199+
order: -1;
200+
}
201+
.team-member {
202+
width: 48% !important;
203+
}
214204

215-
.team-container {
216-
align-items: center;
217-
}
205+
.team-container {
206+
align-items: center;
207+
}
218208
}
219209

220210
@media screen and (max-width: 576px) {
221-
.team-member {
222-
width: 100%;
223-
}
211+
.team-member {
212+
width: 100%;
213+
}
224214
}
225215

226-
227216
.marquee {
228-
overflow: hidden;
229-
white-space: nowrap;
230-
}
231-
232-
.marquee-content {
233-
display: flex;
234-
animation: marquee 15s linear infinite;
217+
overflow: hidden;
218+
white-space: nowrap;
219+
}
220+
221+
.marquee-content {
222+
display: flex;
223+
animation: marquee 30s linear infinite;
224+
}
225+
226+
@keyframes marquee {
227+
from {
228+
transform: translateX(100%);
235229
}
236-
237-
@keyframes marquee {
238-
from {
239-
transform: translateX(100%);
240-
}
241-
to {
242-
transform: translateX(-100%);
243-
}
230+
to {
231+
transform: translateX(-660%);
244232
}
245-
233+
}

src/components/AboutUs.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -207,4 +207,4 @@ const AboutUs = () => {
207207
);
208208
};
209209

210-
export default AboutUs;
210+
export default AboutUs;

0 commit comments

Comments
 (0)