Skip to content

Commit 7e4c0b5

Browse files
Update and rename summer-slam-dsa.html to summer-slams-dsa.html
1 parent 4b0b4f4 commit 7e4c0b5

1 file changed

Lines changed: 25 additions & 53 deletions

File tree

Lines changed: 25 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,13 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Coming Soon - Event Launch</title>
5+
<title>Summer Slams DSA25</title>
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77

88
<!-- Google Font -->
99
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;800&display=swap" rel="stylesheet">
1010

1111
<style>
12-
/* Base Reset */
1312
* {
1413
margin: 0;
1514
padding: 0;
@@ -26,129 +25,102 @@
2625
justify-content: center;
2726
align-items: center;
2827
overflow: hidden;
28+
text-align: center;
2929
}
3030

3131
/* Logo */
3232
.logo {
3333
width: 160px;
3434
height: 160px;
35-
object-fit: contain;
35+
object-fit: cover;
3636
border-radius: 50%;
37-
box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
37+
box-shadow: 0 0 25px rgba(255, 255, 255, 0.2);
3838
margin-bottom: 30px;
39-
animation: zoomIn 2s ease-out;
39+
animation: zoomIn 1.8s ease-out;
4040
}
4141

4242
/* Headline */
4343
h1 {
44-
font-size: 3rem;
44+
font-size: 3.2rem;
4545
font-weight: 800;
4646
color: #38bdf8;
47-
text-shadow: 0 0 15px rgba(56, 189, 248, 0.7);
48-
margin-bottom: 10px;
47+
text-shadow: 0 0 12px rgba(56, 189, 248, 0.6);
48+
margin-bottom: 12px;
4949
animation: fadeIn 2s ease-out;
5050
}
5151

5252
/* Subtitle */
5353
p {
54-
font-size: 1.1rem;
54+
font-size: 1.2rem;
5555
color: #cbd5e1;
56-
margin-bottom: 50px;
57-
animation: fadeIn 2s ease-out;
56+
margin-bottom: 60px;
57+
animation: fadeIn 2.2s ease-out;
5858
}
5959

60-
/* Footer */
6160
footer {
6261
position: absolute;
6362
bottom: 20px;
6463
font-size: 0.9rem;
6564
color: #94a3b8;
6665
}
6766

68-
/* Animations */
6967
@keyframes zoomIn {
70-
0% {
71-
transform: scale(0.6);
72-
opacity: 0;
73-
}
74-
100% {
75-
transform: scale(1);
76-
opacity: 1;
77-
}
68+
0% { transform: scale(0.6); opacity: 0; }
69+
100% { transform: scale(1); opacity: 1; }
7870
}
7971

8072
@keyframes fadeIn {
81-
0% {
82-
opacity: 0;
83-
transform: translateY(20px);
84-
}
85-
100% {
86-
opacity: 1;
87-
transform: translateY(0);
88-
}
73+
0% { opacity: 0; transform: translateY(20px); }
74+
100% { opacity: 1; transform: translateY(0); }
8975
}
9076

91-
/* Particle Background */
77+
/* Particles */
9278
.particles {
9379
position: absolute;
9480
top: 0; left: 0;
9581
width: 100%;
9682
height: 100%;
9783
z-index: -1;
98-
overflow: hidden;
84+
pointer-events: none;
9985
}
10086

10187
.particle {
10288
position: absolute;
103-
background: rgba(255, 255, 255, 0.1);
89+
background: rgba(255, 255, 255, 0.05);
10490
border-radius: 50%;
10591
animation: float 10s infinite ease-in-out;
10692
}
10793

10894
@keyframes float {
109-
0% {
110-
transform: translateY(0) scale(1);
111-
opacity: 0.4;
112-
}
113-
50% {
114-
transform: translateY(-50vh) scale(1.3);
115-
opacity: 0.8;
116-
}
117-
100% {
118-
transform: translateY(0) scale(1);
119-
opacity: 0.4;
120-
}
95+
0% { transform: translateY(0) scale(1); opacity: 0.3; }
96+
50% { transform: translateY(-50vh) scale(1.2); opacity: 0.7; }
97+
100% { transform: translateY(0) scale(1); opacity: 0.3; }
12198
}
12299
</style>
123100
</head>
124101

125102
<body>
126-
<!-- Particle Background -->
127103
<div class="particles" id="particles-container"></div>
128104

129-
<!-- Logo -->
130105
<img src="Vibrant-Summer-Slams-DSA25-Logo.png" alt="Event Logo" class="logo">
131106

132-
<!-- Coming Soon -->
133107
<h1>Coming Soon</h1>
134108
<p>Stay tuned — Something exciting is on the way!</p>
135109

136-
<!-- Footer -->
137-
<footer>&copy; 2025 Your Event Name. All rights reserved.</footer>
110+
<footer>&copy; 2025 Summer Slams DSA25. All rights reserved.</footer>
138111

139112
<script>
140-
// Generate floating particles dynamically
141113
const particleContainer = document.getElementById("particles-container");
142114

143-
for (let i = 0; i < 25; i++) {
115+
for (let i = 0; i < 30; i++) {
144116
const p = document.createElement("div");
145117
p.classList.add("particle");
146-
const size = Math.random() * 10 + 4;
118+
const size = Math.random() * 12 + 5;
147119
p.style.width = `${size}px`;
148120
p.style.height = `${size}px`;
149121
p.style.left = `${Math.random() * 100}%`;
150122
p.style.top = `${Math.random() * 100}%`;
151-
p.style.animationDuration = `${5 + Math.random() * 10}s`;
123+
p.style.animationDuration = `${5 + Math.random() * 8}s`;
152124
particleContainer.appendChild(p);
153125
}
154126
</script>

0 commit comments

Comments
 (0)