forked from Textureman35/Textureman35.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathNewUI.html
133 lines (126 loc) · 5.5 KB
/
NewUI.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>
<head>
<title>Steam Store Clone</title>
<style>
body {
font-family: 'Roboto', sans-serif;
color: white;
height: 100vh;
margin: 0;
background-size: 400% 400%;
animation: Gradient 15s ease infinite;
background-image: linear-gradient(45deg, #000428, #004e92, #000428);
}
.game {
position: relative;
width: 200px;
height: 300px;
margin: 10px;
border-radius: 10px;
overflow: hidden;
}
.game img {
width: 100%;
height: 100%;
}
.game .title {
position: absolute;
bottom: 0;
left: 0;
padding: 5px;
color: white;
background-color: rgba(0, 0, 0, 0.5);
}
.games-row {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
.category-header {
font-size: 24px;
margin-top: 20px;
}
@keyframes Gradient {
0% {background-position: 0% 50%}
50% {background-position: 100% 50%}
100% {background-position: 0% 50%}
}
</style>
</head>
<body>
<main>
<section id="featured-games">
<h2 class="category-header">Featured Games</h2>
<div class="games-row">
<a href="/cookieclicker/index.html" class="game">
<img src="https://cdn.cloudflare.steamstatic.com/steam/apps/1454400/library_600x900_2x.jpg?t=1683221839" alt="Game 1">
<div class="title">Cookie Clicker</div>
</a>
<div class="games-row">
<a href="https://images-opensocial.googleusercontent.com/gadgets/ifr?url=https://cdn.jsdelivr.net/gh/sk1bx/element@9cccb2fafb569c963501a5d818472b561121cea6/totm.xml" class="game">
<img src="https://media.pocketgamer.com/artwork/na-suyrov/tomb-of-the-mask-ios-1.png" alt="Game 1">
<div class="title">Tomb of the Mask</div>
</a>
</div>
</section>
<section id="new-releases">
<h2 class="category-header">New Releases</h2>
<div class="games-row">
<a href="https://images-opensocial.googleusercontent.com/gadgets/ifr?url=https://cdn.jsdelivr.net/gh/gertdoro/Toolkit@93a27eabbbe5eb626af5b9b7dd0926ac16810a41/Code/Java/hole.xml" class="game">
<img src="images/holeio.webp" alt="Game 1">
<div class="title">Hole.IO</div>
</a>
</div>
</section>
<section id="all-games">
<h2 class="category-header">All Games</h2>
<div class="games-row">
<!-- Cookie Clicker -->
<a href="/cookieclicker/index.html" class="game">
<img src="https://cdn.cloudflare.steamstatic.com/steam/apps/1454400/library_600x900_2x.jpg?t=1683221839" alt="Cookie Clicker">
<div class="title">Cookie Clicker</div>
</a>
<!-- Block Stack -->
<a href="https://script.google.com/macros/s/AKfycbyLWFYJx-2JHloJ6N4ur-dbi73G9696alxyaOzi-ikNB0HIOI6JeK13brJQbb2fU9Cksg/exec" class="game">
<img src="images\643x0w.jpg" alt="Block Stack">
<div class="title">Block Stack</div>
</a>
<!-- Five Nights at Freddy's -->
<a href="https://images-opensocial.googleusercontent.com/gadgets/ifr?url=https://s3.amazonaws.com/production-assetsbucket-8ljvyr1xczmb/1ee20621-61bc-4ec8-a8ec-5e839c2e6edc%2Ffive-nights-at-freddy-s.xml" class="game">
<img src="images/fnaf1.webp" alt="Five Nights at Freddy's">
<div class="title">Five Nights at Freddy's</div>
</a>
<!-- Plants Vs Zombies -->
<a href="https://images-opensocial.googleusercontent.com/gadgets/ifr?url=https://s3.amazonaws.com/production-assetsbucket-8ljvyr1xczmb/1ee20621-61bc-4ec8-a8ec-5e839c2e6edc%2Fplants-vs-zombies.xml" class="game">
<img src="images/pvz.jpg" alt="Plants Vs Zombies">
<div class="title">Plants Vs Zombies</div>
</a>
<!-- Angry Birds -->
<a href="https://cdn.jsdelivr.net/gh/gertdoro/UnityExplorer@30e7601c53b57634d2288fd993d8baaeae060eb2/CSConsole/Lexers/ab.xml" class="game">
<img src="images/angrybird.jpg" alt="Angry Birds">
<div class="title">Angry Birds</div>
</a>
<!-- Subway Surfers -->
<a href="https://ubg77.github.io/updatefaqs/subway-surfers/" class="game">
<img src="images/subsurf.jpg" alt="Subway Surfers">
<div class="title">Subway Surfers</div>
</a>
<!-- Tomb of the Mask -->
<a href="https://cdn.jsdelivr.net/gh/sk1bx/element@9cccb2fafb569c963501a5d818472b561121cea6/totm.xml" class="game">
<img src="https://media.pocketgamer.com/artwork/na-suyrov/tomb-of-the-mask-ios-1.png" alt="Tomb of the Mask">
<div class="title">Tomb of the Mask</div>
</a>
<!-- Hole IO -->
<a href="https://images-opensocial.googleusercontent.com/gadgets/ifr?url=https://cdn.jsdelivr.net/gh/gertdoro/Toolkit@93a27eabbbe5eb626af5b9b7dd0926ac16810a41/Code/Java/hole.xml" class="game">
<img src="images/holeio.webp" alt="Game 1">
<div class="title">Hole.IO</div>
</a>
</div>
</section>
</main>
<footer>
<!-- Footer content goes here -->
</footer>
</body>
</html>