Skip to content

Commit ce59852

Browse files
muzerlymuzerly
authored
Update index.html
1 parent 52009de commit ce59852

1 file changed

Lines changed: 60 additions & 70 deletions

File tree

‎index.html‎

Lines changed: 60 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
47
<!-- TikTok Pixel Code Start -->
58
<script>
69
!function (w, d, t) {
@@ -14,92 +17,79 @@
1417
}(window, document, 'ttq');
1518
</script>
1619
<!-- TikTok Pixel Code End -->
17-
18-
<meta charset="UTF-8">
20+
1921
<title>NightClub Simulator VR</title>
20-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2122
<style>
22-
html, body {
23-
height: 100%;
24-
margin: 0;
25-
padding: 0;
23+
:root {
24+
--primary: #5865f2; /* Discord blurple */
25+
--highlight: #ffcc00;
26+
--accent: #ff3366;
2627
}
28+
html, body {height: 100%; margin: 0;}
2729
body {
28-
height: 100vh;
29-
width: 100vw;
30+
height: 100vh; width: 100vw;
3031
background: url('bg.png') no-repeat center center/cover;
31-
display: flex;
32-
flex-direction: column;
33-
justify-content: center;
34-
align-items: center;
35-
color: #fff;
36-
font-family: 'Arial Rounded MT Bold', Arial, Helvetica, sans-serif;
37-
position: relative;
38-
min-height: 100vh;
39-
overflow: hidden;
40-
}
41-
.overlay {
42-
position: absolute;
43-
top: 0; left: 0;
44-
width: 100%; height: 100%;
45-
background: rgba(0,0,0,0.6);
46-
z-index: 0;
47-
}
48-
.content {
49-
position: relative;
50-
z-index: 1;
51-
text-align: center;
52-
width: 90vw;
53-
max-width: 420px;
32+
display: flex; align-items: center; justify-content: center;
33+
color: #fff; font-family: 'Segoe UI', Roboto, Arial, sans-serif;
34+
position: relative; overflow: hidden;
5435
}
36+
.overlay {position: absolute; inset: 0; background: rgba(0,0,0,.6);}
37+
.content {position: relative; z-index: 1; text-align: center; width: 90vw; max-width: 460px;}
5538
.title {
56-
font-size: 2.5rem;
57-
font-weight: bold;
58-
margin-bottom: 1.5rem;
59-
margin-top: 4rem;
60-
letter-spacing: 2px;
61-
text-shadow: 0 4px 12px rgba(0,0,0,0.45);
39+
font-size: 2.6rem; font-weight: 800; letter-spacing: 1.5px;
40+
margin: 3.5rem 0 1.25rem;
41+
background: linear-gradient(90deg, var(--highlight), var(--accent));
42+
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
43+
text-shadow: 0 0 20px rgba(255, 204, 0, 0.6);
44+
opacity: 0; transform: translateY(16px) scale(.98);
45+
animation: fadeUp .8s cubic-bezier(.2,.9,.2,1) .1s forwards;
6246
}
6347
.beta-text {
64-
font-size: 1.2rem;
65-
margin-bottom: 2rem;
66-
line-height: 1.4;
67-
font-weight: 500;
68-
text-shadow: 0 3px 8px rgba(0,0,0,0.5);
48+
font-size: 1.2rem; line-height: 1.45; font-weight: 700;
49+
letter-spacing: .4px; margin: 0 0 2rem;
50+
}
51+
.line {
52+
display: block; opacity: 0; transform: translateY(14px) scale(.98);
53+
background: linear-gradient(90deg, var(--accent), var(--highlight));
54+
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
55+
text-shadow: 0 0 15px rgba(255, 51, 102, 0.6);
56+
animation: fadeUp .9s cubic-bezier(.2,.9,.2,1) forwards, glow 1.8s ease-in-out .9s 1;
6957
}
58+
.line:nth-child(1) {animation-delay: .25s, 1.05s;}
59+
.line:nth-child(2) {animation-delay: .45s, 1.25s;}
7060
.discord-btn {
71-
padding: 1rem 2.2rem;
72-
font-size: 1.2rem;
73-
background: linear-gradient(90deg, #5865f2 60%, #36393f 100%);
74-
color: #fff;
75-
border: none;
76-
border-radius: 999px;
77-
box-shadow: 0 4px 14px rgba(54,97,242,0.2);
78-
cursor: pointer;
79-
transition: background 0.25s, transform 0.12s;
80-
font-weight: bold;
81-
letter-spacing: 1px;
61+
padding: 1rem 2.2rem; font-size: 1.15rem; font-weight: 800; letter-spacing: .8px;
62+
background: linear-gradient(90deg, var(--primary) 0%, #36393f 100%);
63+
color: #fff; border: 0; border-radius: 999px; cursor: pointer;
64+
box-shadow: 0 8px 24px rgba(88,101,242,.25);
65+
transition: transform .12s ease, filter .25s ease;
66+
opacity: 0; transform: translateY(14px) scale(.98);
67+
animation: fadeUp .8s cubic-bezier(.2,.9,.2,1) .75s forwards;
8268
}
83-
.discord-btn:hover {
84-
background: linear-gradient(90deg, #36393f 0%, #5865f2 100%);
85-
transform: translateY(-2px) scale(1.04);
69+
.discord-btn:hover {transform: translateY(-2px) scale(1.04); filter: brightness(1.06);}
70+
@keyframes fadeUp {to {opacity: 1; transform: translateY(0) scale(1);}}
71+
@keyframes glow {
72+
0% {text-shadow: 0 0 0 rgba(255,255,255,0);}
73+
30% {text-shadow: 0 0 20px rgba(255, 204, 0, .9), 0 0 40px rgba(255, 51, 102, .5);}
74+
60% {text-shadow: 0 0 15px rgba(255, 204, 0, .6), 0 0 25px rgba(255, 51, 102, .3);}
75+
100% {text-shadow: 0 0 15px rgba(255, 51, 102, 0.6);}
8676
}
87-
@media (max-width: 600px) {
88-
.title { font-size: 2rem; margin-top: 2.5rem; }
89-
.beta-text { font-size: 1rem; }
90-
.discord-btn { font-size: 1rem; padding: 0.8rem 1.5rem; }
77+
@media (max-width:600px) {
78+
.title {font-size: 2.1rem; margin-top: 2.4rem;}
79+
.beta-text {font-size: 1rem;}
80+
.discord-btn {font-size: 1rem; padding: .9rem 1.6rem;}
9181
}
9282
</style>
9383
</head>
9484
<body>
95-
<div class="overlay"></div>
96-
<div class="content">
97-
<div class="title">NightClub Simulator VR</div>
98-
<div class="beta-text">Join The Beta Test FOR FREE!<br>And get ready to win the FREE Game Key!</div>
99-
<button class="discord-btn"
100-
onclick="window.open('https://discord.gg/74K429PbSH', '_blank')">
101-
Join Discord
102-
</button>
103-
</div>
85+
<div class="overlay" aria-hidden="true"></div>
86+
<main class="content" role="main">
87+
<h1 class="title">NightClub Simulator VR</h1>
88+
<p class="beta-text" aria-live="polite">
89+
<span class="line">Join The Beta Test FOR FREE!</span>
90+
<span class="line">And get ready to win the FREE Game Key!</span>
91+
</p>
92+
<button class="discord-btn" onclick="window.open('https://discord.gg/74K429PbSH','_blank')" aria-label="Join our Discord on a new tab">Join Discord</button>
93+
</main>
10494
</body>
10595
</html>

0 commit comments

Comments
 (0)