Skip to content
This repository was archived by the owner on Nov 1, 2025. It is now read-only.

Commit 07de966

Browse files
DarkIgniteDarkIgnite
authored
Add files via upload
1 parent 2b29f6b commit 07de966

File tree

2 files changed

+111
-74
lines changed

2 files changed

+111
-74
lines changed

‎index.html‎

Lines changed: 45 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -8,30 +8,6 @@
88
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
99
<link rel="stylesheet" href="style.css" />
1010
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" />
11-
<style>
12-
.logo {
13-
display: flex;
14-
align-items: center;
15-
font-weight: bold;
16-
font-size: 1.2rem;
17-
}
18-
19-
.logo img {
20-
height: 40px;
21-
width: auto;
22-
margin-right: 10px;
23-
}
24-
25-
@media (max-width: 600px) {
26-
.logo img {
27-
height: 30px;
28-
}
29-
30-
.logo {
31-
font-size: 1rem;
32-
}
33-
}
34-
</style>
3511
<script>
3612
function copyIP() {
3713
navigator.clipboard.writeText("leftycraft.my.id").then(function() {
@@ -41,7 +17,6 @@
4117
</script>
4218
</head>
4319
<body>
44-
<!-- Header -->
4520
<header class="header">
4621
<div class="logo">
4722
<a href="index.html" style="display: flex; align-items: center; text-decoration: none; color: inherit;">
@@ -57,60 +32,56 @@
5732
</nav>
5833
</header>
5934

60-
<!-- Hero -->
61-
<section class="hero">
62-
<h1>Selamat Datang di LeftyCraft</h1>
63-
<p>Temukan informasi lengkap dan dukung server dengan membeli rank!</p>
64-
<a href="https://discord.gg/pY6QrjEshm" class="btn-yellow" target="_blank"><i class="fa-brands fa-discord"></i> Join Server</a>
65-
</section>
35+
<main class="page-content">
36+
<section class="hero">
37+
<h1>Selamat Datang di LeftyCraft</h1>
38+
<p>Temukan informasi lengkap dan dukung server dengan membeli rank!</p>
39+
<a href="https://discord.gg/pY6QrjEshm" class="btn-yellow" target="_blank"><i class="fa-brands fa-discord"></i> Join Server</a>
40+
</section>
6641

67-
<!-- Fitur -->
68-
<section class="fitur">
69-
<h2>Meningkatkan pengalaman bermainmu di server!</h2>
70-
<p>Kami menyediakan fitur-fitur unggulan yang akan membuatmu betah di server.</p>
71-
<div class="fitur-grid">
72-
<div><i class="fa-solid fa-layer-group"></i> Banyak Fitur</div>
73-
<div><i class="fa-solid fa-cubes"></i> GUI Mudah</div>
74-
<div><i class="fa-solid fa-star"></i> Rank Lengkap</div>
75-
</div>
76-
</section>
42+
<section class="fitur">
43+
<h2>Meningkatkan pengalaman bermainmu di server!</h2>
44+
<p>Kami menyediakan fitur-fitur unggulan yang akan membuatmu betah di server.</p>
45+
<div class="fitur-grid">
46+
<div><i class="fa-solid fa-layer-group"></i> Banyak Fitur</div>
47+
<div><i class="fa-solid fa-cubes"></i> GUI Mudah</div>
48+
<div><i class="fa-solid fa-star"></i> Rank Lengkap</div>
49+
</div>
50+
</section>
7751

78-
<!-- Keunggulan Server -->
79-
<section class="fitur">
80-
<h2>Meningkatkan pengalaman bermainmu di server!</h2>
81-
<p>Kenapa LeftyCraft jadi pilihan terbaik?</p>
82-
<div class="fitur-grid">
83-
<div><i class="fa-solid fa-earth-asia"></i> Skyblock & Pulau Luas</div>
84-
<div><i class="fa-solid fa-dragon"></i> Sistem RPG & Dungeons</div>
85-
<div><i class="fa-solid fa-flask"></i> Slimefun & Addon</div>
86-
<div><i class="fa-solid fa-box-open"></i> Crate / Gacha</div>
87-
<div><i class="fa-solid fa-sack-dollar"></i> Shop & PlayerShop</div>
88-
<div><i class="fa-solid fa-columns-3"></i> CrazyEnchantments / CustomEnchant</div>
89-
</div>
90-
</section>
52+
<section class="fitur">
53+
<h2>Meningkatkan pengalaman bermainmu di server!</h2>
54+
<p>Kenapa LeftyCraft jadi pilihan terbaik?</p>
55+
<div class="fitur-grid">
56+
<div><i class="fa-solid fa-earth-asia"></i> Skyblock & Pulau Luas</div>
57+
<div><i class="fa-solid fa-dragon"></i> Sistem RPG & Dungeons</div>
58+
<div><i class="fa-solid fa-flask"></i> Slimefun & Addon</div>
59+
<div><i class="fa-solid fa-box-open"></i> Crate / Gacha</div>
60+
<div><i class="fa-solid fa-sack-dollar"></i> Shop & PlayerShop</div>
61+
<div><i class="fa-solid fa-columns-3"></i> CrazyEnchantments / CustomEnchant</div>
62+
</div>
63+
</section>
9164

92-
<!-- Link Server -->
93-
<section class="server-links" id="support">
94-
<h2>Informasi Server</h2>
95-
<div class="link-grid">
96-
<div class="link-card" onclick="copyIP()" style="cursor:pointer;"><i class="fa-solid fa-server"></i> IP Server: leftycraft.my.id | Bedrock Port: 20627</div>
97-
<div class="link-card"><i class="fa-brands fa-discord"></i> Discord: <a href="https://discord.gg/pY6QrjEshm" target="_blank">discord.gg/pY6QrjEshm</a></div>
98-
<div class="link-card"><i class="fa-solid fa-vote-yea"></i> Vote: <a href="https://minecraft-mp.com/server/341916/vote/" target="_blank">minecraft-mp.com/server/341916/vote/</a></div>
99-
<div class="link-card"><i class="fa-brands fa-whatsapp"></i> Group Wa: <a href="https://chat.whatsapp.com/BQBZzXMyPVoDP5NZ6NvYUf" target="_blank">chat.whatsapp.com/BQBZzXMyPVoDP5NZ6NvYUf</a></div>
100-
</div>
101-
</section>
65+
<section class="server-links" id="support">
66+
<h2>Informasi Server</h2>
67+
<div class="link-grid">
68+
<div class="link-card" onclick="copyIP()" style="cursor:pointer;"><i class="fa-solid fa-server"></i> IP Server: leftycraft.my.id | Bedrock Port: 20627</div>
69+
<div class="link-card"><i class="fa-brands fa-discord"></i> Discord: <a href="https://discord.gg/pY6QrjEshm" target="_blank">discord.gg/pY6QrjEshm</a></div>
70+
<div class="link-card"><i class="fa-solid fa-vote-yea"></i> Vote: <a href="https://minecraft-mp.com/server/341916/vote/" target="_blank">minecraft-mp.com/server/341916/vote/</a></div>
71+
<div class="link-card"><i class="fa-brands fa-whatsapp"></i> Group Wa: <a href="https://chat.whatsapp.com/BQBZzXMyPVoDP5NZ6NvYUf" target="_blank">chat.whatsapp.com/BQBZzXMyPVoDP5NZ6NvYUf</a></div>
72+
</div>
73+
</section>
10274

103-
<!-- Sosial Media -->
104-
<section class="tutorial">
105-
<h2>Sosial Media</h2>
106-
<p>Ikuti kami di media sosial untuk update terbaru!</p>
107-
<div class="btn-row">
108-
<a href="https://www.instagram.com/darkignite_who/" class="btn-outline" target="_blank"><i class="fa-brands fa-instagram"></i></a>
109-
<a href="https://www.tiktok.com/@leftycraft.my.id" class="btn-outline" target="_blank"><i class="fa-brands fa-tiktok"></i></a>
110-
</div>
111-
</section>
75+
<section class="tutorial">
76+
<h2>Sosial Media</h2>
77+
<p>Ikuti kami di media sosial untuk update terbaru!</p>
78+
<div class="btn-row">
79+
<a href="https://www.instagram.com/darkignite_who/" class="btn-outline" target="_blank"><i class="fa-brands fa-instagram"></i></a>
80+
<a href="https://www.tiktok.com/@leftycraft.my.id" class="btn-outline" target="_blank"><i class="fa-brands fa-tiktok"></i></a>
81+
</div>
82+
</section>
83+
</main>
11284

113-
<!-- Footer -->
11485
<footer>
11586
<p>© 2025 LeftyCraft. All rights reserved.</p>
11687
</footer>

‎style.css‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,72 @@ nav a {
6969
overflow: hidden;
7070
text-overflow: ellipsis;
7171
}
72+
.btn-yellow,
73+
nav a.btn-yellow,
74+
.btn-outline {
75+
position: relative;
76+
z-index: 1;
77+
}
78+
/* Fade in saat halaman dimuat */
79+
body {
80+
animation: fadeSlideIn 0.7s ease-out;
81+
}
82+
83+
@keyframes fadeSlideIn {
84+
0% {
85+
opacity: 0;
86+
transform: translateY(30px);
87+
}
88+
100% {
89+
opacity: 1;
90+
transform: translateY(0);
91+
}
92+
}
93+
94+
95+
.btn-yellow,
96+
nav a.btn-yellow,
97+
.btn-outline {
98+
position: relative;
99+
z-index: 1;
100+
transition: all 0.3s ease;
101+
}
102+
103+
.btn-yellow:hover,
104+
nav a.btn-yellow:hover,
105+
.btn-outline:hover {
106+
background: #ffe066;
107+
color: #000;
108+
box-shadow: 0 0 8px #ffcc00, 0 0 16px #ffcc00, 0 0 32px #ffcc00;
109+
animation: pulseGlow 1.2s infinite alternate;
110+
}
111+
112+
@keyframes pulseGlow {
113+
from {
114+
box-shadow: 0 0 6px #ffcc00, 0 0 12px #ffcc00;
115+
}
116+
to {
117+
box-shadow: 0 0 12px #ffcc00, 0 0 24px #ffcc00;
118+
}
119+
}
120+
121+
}
122+
/* TRANSISI HALAMAN */
123+
.page-content {
124+
animation: fadeSlideIn 0.7s ease-out;
125+
}
126+
127+
@keyframes fadeSlideIn {
128+
0% {
129+
opacity: 0;
130+
transform: translateY(30px);
131+
}
132+
100% {
133+
opacity: 1;
134+
transform: translateY(0);
135+
}
136+
}
137+
72138

73139
/* khusus untuk tombol di dalam rank-card */
74140
.rank-footer .btn-yellow {

0 commit comments

Comments
 (0)