Skip to content

Commit 5bdf67e

Browse files
premagarwalspremagarwals
authored
Merge branch 'truth-redefined-again' into responsive24
2 parents c39b575 + a8b0914 commit 5bdf67e

File tree

12 files changed

+67
-142
lines changed

12 files changed

+67
-142
lines changed

‎src/App.tsx‎

Lines changed: 3 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -15,65 +15,17 @@ import PastProgramsPage from "./pages/PastProgramsPage";
1515
import StudentDashboard from "./pages/StudentDashboard";
1616
import RegistrationForm from "./pages/RegistrationForm";
1717
import Snowfall from "react-snowfall";
18-
import Lottie from "lottie-react";
19-
import { CSSProperties, useState, useEffect } from "react";
2018
import { Header } from "./components/Header";
2119
import Footer from "./components/Footer";
2220

23-
24-
const santaAnimationStyle: CSSProperties = {
25-
position: "fixed",
26-
top: "40%",
27-
width: "500px",
28-
height: "500px",
29-
zIndex: 1,
30-
pointerEvents: "none",
31-
animation: "santa-fly 20s linear infinite",
32-
};
33-
34-
const santaMirrorAnimationStyle: CSSProperties = {
35-
position: "fixed",
36-
top: "40%",
37-
width: "500px",
38-
height: "500px",
39-
zIndex: 1,
40-
pointerEvents: "none",
41-
animation: "santa-fly-mirror 20s linear infinite", // Ensure the same duration for uniformity
42-
};
43-
4421
function App() {
45-
const [santaAnimationData, setSantaAnimationData] = useState(null);
46-
const [isLeftToRight, setIsLeftToRight] = useState(true); // State to toggle between animations
47-
48-
useEffect(() => {
49-
const fetchAnimation = async () => {
50-
try {
51-
const response = await fetch(
52-
"https://lottie.host/205b9306-eb12-4261-b310-bcbe2d44dfaf/8fIFkoFeKd.json"
53-
);
54-
const data = await response.json();
55-
setSantaAnimationData(data);
56-
} catch (error) {
57-
console.error("Error fetching the animation data:", error);
58-
}
59-
};
60-
61-
fetchAnimation();
62-
63-
const interval = setInterval(() => {
64-
setIsLeftToRight((prev) => !prev); // Toggle between left to right and right to left every time
65-
}, 20000); // Change direction every 20 seconds (matching animation duration)
66-
67-
return () => clearInterval(interval); // Cleanup the interval on component unmount
68-
}, []);
69-
7022
return (
7123
<div className="App">
7224
<BrowserRouter>
7325
<AuthProvider>
7426
<Header />
7527
<Snowfall // the image can be edited into anything we want, feel free to change
76-
snowflakeCount={150}
28+
snowflakeCount={75}
7729
speed={[0.5, 1]} // array takes [min, max]
7830
wind={[-0.5, 0.5]}
7931
radius={[2, 4]}
@@ -82,20 +34,9 @@ function App() {
8234
width: "100vw",
8335
height: "100vh",
8436
opacity: 0.5,
37+
zIndex: 0,
8538
}}
8639
/>
87-
{santaAnimationData && (
88-
<Lottie
89-
animationData={santaAnimationData}
90-
loop={true}
91-
autoplay={true}
92-
style={
93-
(isLeftToRight
94-
? santaAnimationStyle
95-
: santaMirrorAnimationStyle) as React.CSSProperties
96-
}
97-
/>
98-
)}
9940
<Routes>
10041
<Route index element={<Home />} />
10142
<Route
@@ -131,7 +72,7 @@ function App() {
13172
path={ROUTER_PATHS.PASTPROGRAMS}
13273
element={<PastProgramsPage />}
13374
/>
134-
<Route path="*" element={<NotFoundPage />} />
75+
<Route path="*" element={<NotFoundPage />} />
13576
</Routes>
13677
<Footer />
13778
</AuthProvider>

‎src/components/Footer.tsx‎

Lines changed: 32 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,37 @@
11
import "../styles/Footer.css";
2-
import { ROUTER_PATHS } from "../util/constants";
2+
import { ROUTER_PATHS, DISCORD_INVITE, KOSS_CONTACT_EMAIL, KOSS_LINKEDIN_URL, KOSS_TWITTER_URL, KOSS_WEBSITE_URL } from "../util/constants";
33

44
const Footer = () => {
5-
return (
6-
<footer className="footer">
7-
<div className="footer-content">
8-
<div className="footer-columns">
9-
<div className="footer-column">
10-
<h2>Social Groups</h2>
11-
<p><a href="https://discord.gg/efFwh6fnjk">Discord</a></p>
12-
<p><a href="https://kwoc-koss.slack.com/join/shared_invite/zt-wlftnk75-VoQHEEB9WpkHfza6~GGpWQ#/shared-invite/email">Slack</a></p>
13-
<p><a href="https://www.linkedin.com/company/kharagpur-open-source-society/mycompany/">LinkedIn</a></p>
14-
<p><a href="https://x.com/kossiitkgp">Twitter</a></p>
15-
</div>
16-
<div className="footer-column">
17-
<h2>Quick Links</h2>
18-
<p><a href={`${ROUTER_PATHS.HOME}#timeline`}>Timeline</a></p>
19-
<p><a href={ROUTER_PATHS.FAQ}>FAQs</a></p>
20-
<p><a href={`${ROUTER_PATHS.HOME}#about`}>About KWoC</a></p>
21-
</div>
22-
<div className="footer-column">
23-
<h2>Other</h2>
24-
<p><a href="https://kossiitkgp.org/">About KOSS</a></p>
25-
<p><a href="">Past Programs</a></p>
26-
<p><a href="">contact@kossiitkgp.org</a></p>
27-
</div>
28-
</div>
29-
</div>
30-
<div className="footer-bottom">
31-
<h1>Kharagpur Winter of Code</h1>
32-
<p>With 💙 by KOSS</p>
33-
</div>
34-
</footer>
35-
);
5+
return (
6+
<footer className="footer">
7+
<div className="footer-content">
8+
<div className="footer-columns">
9+
<div className="footer-column">
10+
<h2>Social Groups</h2>
11+
<p><a href={DISCORD_INVITE}>Discord</a></p>
12+
<p><a href={KOSS_LINKEDIN_URL}>LinkedIn</a></p>
13+
<p><a href={KOSS_TWITTER_URL}>Twitter</a></p>
14+
</div>
15+
<div className="footer-column">
16+
<h2>Quick Links</h2>
17+
<p><a href={`${ROUTER_PATHS.HOME}#timeline`}>Timeline</a></p>
18+
<p><a href={ROUTER_PATHS.FAQ}>FAQs</a></p>
19+
<p><a href={`${ROUTER_PATHS.HOME}#about`}>About KWoC</a></p>
20+
</div>
21+
<div className="footer-column">
22+
<h2>Other</h2>
23+
<p><a href={KOSS_WEBSITE_URL}>About KOSS</a></p>
24+
<p><a href="https://kwoc23.kossiitkgp.org/pastprograms">Past Programs</a></p>
25+
<p><a href={KOSS_CONTACT_EMAIL}>contact@kossiitkgp.org</a></p>
26+
</div>
27+
</div>
28+
</div>
29+
<div className="footer-bottom">
30+
<h1>Kharagpur Winter of Code</h1>
31+
<p>With 💙 by KOSS</p>
32+
</div>
33+
</footer>
34+
);
3635
};
3736

38-
export default Footer
37+
export default Footer

‎src/components/Hero.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import hook from '../assets/igloo-scroll-hook-edit.png';
33
import sign from '../assets/sign-post.png';
44
import "../styles/Hero.css";
55
import "../styles/App.css";
6+
import { MENTOR_MANUAL_LINK, STUDENT_MANUAL_LINK } from '../util/constants';
67

78
export const HeroComponent = () => {
89
return (
@@ -15,8 +16,8 @@ export const HeroComponent = () => {
1516
<h1>Kharagpur <span className='yellow-text'>Winter<br />of Code</span> 2024</h1>
1617
</div>
1718
<div className="hero-button-container">
18-
<button className="hero-button"> <a href="https://drive.google.com/file/d/1gc2NWeMDA3ZFzH4RWVspuerduRdfY9yu/view?usp=drive_link" target="_blank">Student Manual </a></button>
19-
<button className="hero-button"> <a href="https://drive.google.com/file/d/1XUGfHygE3_KYX_qhcpvw8jhKLlcRkzHP/view?usp=drive_link" target="_blank">Mentor Manual </a></button>
19+
<button className="hero-button"> <a href={STUDENT_MANUAL_LINK} target="_blank">Student Manual </a></button>
20+
<button className="hero-button"> <a href={MENTOR_MANUAL_LINK} target="_blank">Mentor Manual </a></button>
2021
</div>
2122
</div>
2223
<div className="hero-images">

‎src/pages/FAQ.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -71,8 +71,11 @@ function FAQ() {
7171
<div className="accordion-header">
7272
<span>{question}</span>
7373
<div className="accordion-icon">
74-
<FaPlus className={`plus-icon ${activeIndex === i ? "hidden" : ""}`} />
75-
<FaMinus className={`minus-icon ${activeIndex === i ? "visible" : ""}`} />
74+
{activeIndex === i ? (
75+
<FaMinus className={`minus-icon visible`} />
76+
) : (
77+
<FaPlus className={`plus-icon hidden`} />
78+
)}
7679
</div>
7780
</div>
7881
</button>

‎src/pages/Home.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,13 @@ import Testimonials from "../components/Testimonials";
88
function Home() {
99

1010
return (
11-
<>
11+
<div>
1212
<HeroComponent />
1313
<AboutSection />
1414
<WhyKWoC />
1515
<Timeline />
1616
<Testimonials />
17-
</>
17+
</div>
1818
);
1919
}
2020

‎src/pages/StudentDashboard.tsx‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import {
55
MID_EVALS_ENDED,
66
REPORT_SUBMISSION_OPEN,
77
ROUTER_PATHS,
8-
SLACK_INVITE,
98
STUDENT_MANUAL_LINK,
109
} from "../util/constants";
1110
import { useAuthContext } from "../util/auth";
@@ -246,12 +245,6 @@ function StudentDashboard() {
246245
announcements.
247246
</p>
248247
<div className="flex justify-center gap-4 mx-auto">
249-
<Link
250-
to={SLACK_INVITE}
251-
className="text-white w-fit mx-auto focus:outline-none focus:ring-4 font-medium rounded-lg text-sm px-5 py-2.5 bg-primary-700 hover:bg-primary-600 focus:ring-primary-600 border-primary-600"
252-
>
253-
Slack Workspace
254-
</Link>
255248
<Link
256249
to={DISCORD_INVITE}
257250
className="text-white w-fit mx-auto focus:outline-none focus:ring-4 font-medium rounded-lg text-sm px-5 py-2.5 bg-primary-700 hover:bg-primary-600 focus:ring-primary-600 border-primary-600"

‎src/styles/FAQ.css‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
background-color: #fff;
3636
border-radius: 50px;
3737
border: 1px solid #dcdfe5;
38-
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
38+
box-shadow: 0 0px 4px rgba(0, 0, 0, 0.1);
3939
padding: 0.5rem 1rem;
4040
max-width: 800px;
4141
width: 100%;
@@ -85,6 +85,7 @@
8585
font-weight: 500;
8686
color: #333;
8787
width: 100%;
88+
text-align: left;
8889
}
8990

9091
.accordion-toggle {
@@ -110,7 +111,8 @@
110111
transition: transform 0.3s ease, opacity 0.3s ease;
111112
transform: scale(1);
112113
opacity: 1;
113-
margin-left: 8px; /* Adds space between question text and icon */
114+
margin-left: 8px;
115+
/* Adds space between question text and icon */
114116
}
115117

116118
/* Minus Icon */
@@ -141,10 +143,12 @@
141143
}
142144

143145
.accordion-item.open .accordion-content {
144-
max-height: 1000px; /* Large enough to reveal full content */
146+
max-height: 1000px;
147+
/* Large enough to reveal full content */
145148
opacity: 1;
146149
padding: 1rem;
147150
border-top: 4px solid #071b44;
151+
text-align: left;
148152
}
149153

150154
.accordion-content p {

‎src/styles/Form.css‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,15 @@
66
}
77

88
.form-container {
9-
background-color: #ffffff; /* White background for the form */
9+
background-color: #ffffff;
10+
/* White background for the form */
1011
padding: 2rem;
1112
border-radius: 0.75rem;
12-
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); /* Soft shadow for the form */
13+
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
14+
/* Soft shadow for the form */
1315
width: 100%;
14-
max-width: 600px; /* Limiting the form width */
16+
max-width: 600px;
17+
/* Limiting the form width */
1518
transition: box-shadow 0.3s ease-in-out;
1619
}
1720

@@ -78,7 +81,6 @@
7881

7982
.button:hover {
8083
background-color: #3730a3;
81-
transform: scale(1.05); /* Slight scaling effect on hover */
8284
}
8385

8486
/* Disabled button styling */
@@ -96,7 +98,6 @@
9698

9799
.cancel-button:hover {
98100
background-color: #991b1b;
99-
transform: scale(1.05);
100101
}
101102

102103
/* Form input field styles */

‎src/styles/Hero.css‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
.hero-quote {
2121
margin: 0;
2222
padding: 0;
23+
font-size: 2rem;
2324
}
2425

2526
.hero-title h1 {
@@ -44,14 +45,14 @@
4445
background: #fff;
4546
color: #0a0a19;
4647
box-shadow: 4px 4px #6a6a6a;
47-
transition: scale 200ms;
48+
transition: background-color 200ms;
4849
font-size: 1rem;
4950
padding: 1rem;
5051
border-radius: 0.5rem;
5152
}
5253

5354
.hero-button:hover {
54-
scale: 1.05;
55+
background-color: rgba(256, 256, 256, 0.8);
5556
cursor: pointer;
5657
}
5758

‎src/styles/WhyKWoC.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,12 +50,12 @@
5050
box-shadow: 1px 2px 4px 0 #000;
5151
background-color: rgba(128, 128, 128, 0.4);
5252
backdrop-filter: blur(0.2rem);
53-
transition: scale 0.2s, backdrop-filter 0.2s;
53+
transition: backdrop-filter 0.2s, background-color 0.2s;
5454
}
5555

5656
.card-container:hover {
57-
scale: 1.02;
5857
backdrop-filter: blur(0.5rem);
58+
background-color: rgba(128, 128, 128, 0.5);
5959
}
6060

6161
.card-title {

0 commit comments

Comments
 (0)