forked from DevUrf/Game-Hub
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsurvival.html
133 lines (128 loc) · 4.76 KB
/
survival.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Survival Games - Game On! 🎮</title>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
margin: 0;
padding: 0;
color: #333;
overflow-y: auto;
position: relative;
min-height: 100vh;
background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 100%);
scroll-behavior: smooth;
display: flex;
flex-direction: column;
align-items: center;
transition: background 0.5s, color 0.5s;
}
h1 {
text-align: center;
color: #00796b;
font-size: 2.5em;
margin: 20px 0;
}
.game-list {
width: 100%;
max-width: 800px;
text-align: center;
margin: 20px 0;
}
.game-item {
background-color: #ffffff;
border: 1px solid #00796b;
border-radius: 12px;
padding: 15px;
margin: 10px 0;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
transition: transform 0.3s, box-shadow 0.3s;
}
.game-item:hover {
transform: translateY(-5px);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.footer {
margin-top: auto;
padding: 20px;
text-align: center;
font-size: 0.9em;
color: #555;
}
/* Dark Mode Styles */
body.dark {
background: linear-gradient(135deg, #263238 0%, #37474f 100%);
color: #e0e0e0;
}
.dark .game-item {
background-color: #424242;
border: 1px solid #90a4ae;
color: #e0e0e0;
}
/* Home Button */
.home-button {
position: absolute;
top: 20px;
left: 20px;
background-color: #00796b;
border: none;
border-radius: 50px;
color: white;
padding: 10px 20px;
cursor: pointer;
transition: background-color 0.3s, transform 0.3s;
font-size: 1em;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.home-button:hover {
background-color: #005f51;
transform: scale(1.05);
}
</style>
<script>
// Dark Mode Toggle
function toggleDarkMode() {
const body = document.body;
body.classList.toggle("dark");
}
</script>
</head>
<body>
<button class="home-button" onclick="window.location.href='index.html'">🏠 Home</button>
<h1>Survival Games</h1>
<div class="game-list">
<div class="game-item">Survival Game 1: The Forest 🌲</div>
<div class="game-item">Survival Game 2: ARK: Survival Evolved 🦖</div>
<div class="game-item">Survival Game 3: Rust 🔥</div>
<div class="game-item">Survival Game 4: Don't Starve 🌙</div>
<div class="game-item">Survival Game 5: Subnautica 🌊</div>
<div class="game-item">Survival Game 6: 7 Days to Die 🧟♂️</div>
<div class="game-item">Survival Game 7: DayZ ☠️</div>
<div class="game-item">Survival Game 8: Green Hell 🍃</div>
<div class="game-item">Survival Game 9: The Long Dark ❄️</div>
<div class="game-item">Survival Game 10: SCUM 🏝️</div>
<div class="game-item">Survival Game 11: The Wild Eight 🐻</div>
<div class="game-item">Survival Game 12: Raft 🚣♂️</div>
<div class="game-item">Survival Game 13: Stranded Deep 🏝️</div>
<div class="game-item">Survival Game 14: Mist Survival 🌫️</div>
<div class="game-item">Survival Game 15: The Isle 🦕</div>
<div class="game-item">Survival Game 16: Grounded 🐜</div>
<div class="game-item">Survival Game 17: Project Zomboid 🧟♀️</div>
<div class="game-item">Survival Game 18: The Infected 🦠</div>
<div class="game-item">Survival Game 19: Outlast 2 😱</div>
<div class="game-item">Survival Game 20: The Walking Dead: Season One 🧟</div>
<div class="game-item">Survival Game 21: Dead by Daylight 🔪</div>
<div class="game-item">Survival Game 22: The Hunted: One Step Too Far 🏃♂️</div>
<div class="game-item">Survival Game 23: No More Room in Hell 🔒</div>
<div class="game-item">Survival Game 24: H1Z1 🪖</div>
<div class="game-item">Survival Game 25: The Blackout Club 🎭</div>
</div>
<div class="footer">
<p>Join our community and stay updated with the latest games and offers! 🎉</p>
</div>
</body>
</html>