2526-web/kelompok12-codebeater
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: styling leaderboard

Browse Source
This commit is contained in:
Matthew Florentino 2025-11-24 11:16:48 +07:00
parent 7e6d71d67a
commit fb1ebd6fee
3 changed files with 36 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/css/global.css
View File

@ -10,14 +10,3 @@ body {
background-color: black;
}
.row {
display: flex;
height: 100dvh;
}
.col {
flex: 1;
width: 50%;
padding: 30px;
box-sizing: border-box;
}

31
src/css/style.css
View File

@ -134,6 +134,13 @@
color: yellow;
}
.container-board {
display: flex;
justify-content: space-around;
align-items: center;
height: 100dvh;
}
.container-board .chara {
display: flex;
flex-direction: column;
@ -148,3 +155,27 @@
align-items: center;
flex-direction: column;
}
.container-board .chara .character img {
width: 300px;
image-rendering: pixelated;
margin: 20px;
}
.container-board .menu {
margin: 0 auto;
border-radius: 10px;
width: 400px;
border: 1px solid;
height: 40px;
align-content: center;
}
.container-board table {
margin: 0 auto;
border-radius: 10px;
width: 400px;
border: 1px solid;
height: 40px;
align-content: center;
}

47
src/leaderboard.php
View File

@ -22,46 +22,9 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>leaderboard</title>
<link rel="stylesheet" href="css/global.css">
<link rel="stylesheet" href="css/style.css">
</head>
<style>
.chara {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.chara .character {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
}
.chara .character img {
width: 300px;
image-rendering: pixelated;
margin: 20px;
}
.menu {
margin: 0 auto;
border-radius: 10px;
width: 400px;
border: 1px solid;
height: 40px;
align-content: center;
}
table {
width: 100%;
border: 1px solid;
height: 20px;
}
</style>
<body>
<div class="container-board">
<div class="chara">
@ -70,10 +33,10 @@
</div>
<h1 style="text-align: center;">150pts</h1>
<div class="character">
<img src="../src/assets/Design/KnightPixLE.png" alt="knight">
<img src="assets/Design/KnightPixLE.png" alt="knight">
</div>
</div>
<div class="board col">
<div class="board">
<table>
<thead>
<tr>
@ -83,7 +46,7 @@
</tr>
</thead>
<tbody>
<?php
<!-- <?php
$peringkat = 1;
foreach ($leaderboard as $pemain) :
?>
@ -101,7 +64,7 @@
if (empty($leaderboard)) {
echo '<tr><td colspan="3" style="text-align: center;">Belum ada pemain</td></tr>';
}
?>
?> -->
</tbody>
</table>
</div>