teks shadow

This commit is contained in:
JERRY F 2025-12-16 07:25:03 +07:00
parent 9c4dc721a2
commit 258ca6bf43
3 changed files with 117 additions and 92 deletions

View File

@ -128,15 +128,17 @@
.text { .text {
padding-top: 30px; padding-top: 30px;
padding-left: 50px; padding-left: 50px;
color: rgb(0, 0, 0); color: rgb(255, 255, 255);
font-weight: 90px; font-weight: 90px;
text-shadow: black 3px 4px 1px;
} }
.text-spd { .text-spd {
padding-bottom: 0px; padding-bottom: 0px;
padding-left: 50px; padding-left: 50px;
font-size: 28px; font-size: 28px;
color: rgb(0, 0, 0); color: rgb(255, 255, 255);
font-weight: 1000; font-weight: 1000;
text-shadow: black 3px 4px 1px;
} }
#gameover { #gameover {
color: red; color: red;

View File

@ -1,15 +1,16 @@
<!DOCTYPE html> <!DOCTYPE html>
<!-- tes merge -->
<html> <html>
<head> <head>
<link rel="stylesheet" href="GameStyle.css" /> <link rel="stylesheet" href="GameStyle.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link <link
href="https://fonts.googleapis.com/css2?family=Coral+Pixels&family=Jacquarda+Bastarda+9&family=Pixelify+Sans:wght@400..700&display=swap" href="https://fonts.googleapis.com/css2?family=Coral+Pixels&family=Jacquarda+Bastarda+9&family=Pixelify+Sans:wght@400..700&display=swap"
rel="stylesheet" rel="stylesheet" />
/>
</head> </head>
<body> <body>
<!-- header --> <!-- header -->
<header> <header>
@ -28,12 +29,17 @@
<div id="gameover-overlay" class="starting" style="display: none"> <div id="gameover-overlay" class="starting" style="display: none">
<div class="popAwal1"> <div class="popAwal1">
<h1 style="color: red" id="gameover-title">YOU DIED</h1> <h1 style="color: red" id="gameover-title">YOU DIED</h1>
<p id="gameover-score">Score: 0</p> <p id="gameover-score">Score: 0</p>
<button id="ulangi" class="modegame">Main lagi?</button> <button id="ulangi" class="modegame">Main lagi?</button>
<a href="http://localhost/uas_sem_1/index.php"> <a href="http://localhost/uas_sem_1/index.php">
<button id="keluar" class="">Keluar?</button> <button id="keluar" class="out">Keluar?</button>
</a> </a>
</div> </div>
</div> </div>
@ -64,4 +70,5 @@
<!-- akhir html body --> <!-- akhir html body -->
<script src="GameLogic.js"></script> <script src="GameLogic.js"></script>
</body> </body>
</html> </html>

View File

@ -9,38 +9,50 @@ if (!isset($_SESSION['users'])) {
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<link rel="stylesheet" href="GameStyle.css" /> <link rel="stylesheet" href="GameStyle.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link <link
href="https://fonts.googleapis.com/css2?family=Coral+Pixels&family=Jacquarda+Bastarda+9&family=Pixelify+Sans:wght@400..700&display=swap" href="https://fonts.googleapis.com/css2?family=Coral+Pixels&family=Jacquarda+Bastarda+9&family=Pixelify+Sans:wght@400..700&display=swap"
rel="stylesheet" rel="stylesheet" />
/>
</head> </head>
<body> <body>
<!-- header --> <!-- header -->
<header> <header>
<div class="centered"> <div class="centered">
<div class="icon"></div> <div class="icon"></div>
<h1>Snake - <?php echo htmlspecialchars($_SESSION['users']['nama']); ?></h1> <h1>Snake</h1>
</div> </div>
</header> </header>
<img src="" alt="">
<!-- main konten --> <!-- main konten -->
<div class="HalamanFull"> <div class="HalamanFull">
<div class="text-spd">UP & DOWN SPD: E Q<br /><br /></div>
<!-- Kontainer baru untuk game dan overlay-nya -->
<div class="game-container">
<canvas width="1056" height="480" id="game"></canvas> <canvas width="1056" height="480" id="game"></canvas>
<div id="gameover-overlay" class="starting" style="display: none"> <div id="gameover-overlay" class="starting" style="display: none">
<div class="popAwal"> <div class="popAwal1">
<h1 style="color: red" id="gameover-title">YOU DIED</h1> <h1 style="color: red" id="gameover-title">YOU DIED</h1>
<p id="gameover-score">Score: 0</p> <p id="gameover-score">Score: 0</p>
<button id="ulangi" class="modegame">Main lagi?</button> <button id="ulangi" class="modegame">Main lagi?</button>
<a href="index.php">
<a href="http://localhost/uas_sem_1/index.php">
<button id="keluar" class="">Keluar?</button> <button id="keluar" class="">Keluar?</button>
</a> </a>
</div> </div>
</div> </div>
<div id="gameover" class="gameover"></div> <div id="gameover" class="gameover"></div>
<div id="start" class="starting"> <div id="start" class="starting">
<div class="popAwal"> <div class="popAwal">
<h1>Start Game?</h1> <h1>Start Game?</h1>
@ -49,9 +61,12 @@ if (!isset($_SESSION['users'])) {
<button id="mode-tambahan" class="modegame">Normal++</button> <button id="mode-tambahan" class="modegame">Normal++</button>
</div> </div>
</div> </div>
</div>
<div> <div>
<div id="text" class="text"></div> <div id="text" class="text"></div>
</div> </div>
</div> </div>
<!-- footer --> <!-- footer -->
@ -63,4 +78,5 @@ if (!isset($_SESSION['users'])) {
<!-- akhir html body --> <!-- akhir html body -->
<script src="GameLogic.js"></script> <script src="GameLogic.js"></script>
</body> </body>
</html> </html>