2526-web/Kelompok02-Memory-Card
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: 2526-web:447c86bf394d9a96f4883dc6a9b4653c7a16f8a6
Branches Tags
2526-web:main
..
compare: 2526-web:27fdee756671993a625f7fa1fdd33dc5e1e5abf0
Branches Tags
2526-web:main

No commits in common. "447c86bf394d9a96f4883dc6a9b4653c7a16f8a6" and "27fdee756671993a625f7fa1fdd33dc5e1e5abf0" have entirely different histories.
447c86bf39 ... 27fdee7566

2 changed files with 14 additions and 9 deletions
Show Stats Expand all files Collapse all files

19
gameboard-hard.html
View File

@ -19,7 +19,7 @@ body {
flex-direction: column; flex-direction: column;
} }
/* TOP UI */
.topbar { .topbar {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -56,7 +56,7 @@ body {
box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 0 6px rgba(255,255,255,0.6); box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 0 6px rgba(255,255,255,0.6);
} }
/* === 5×4 GRID === */
.gameboard { .gameboard {
flex: 1; flex: 1;
display: grid; display: grid;
@ -67,7 +67,7 @@ body {
box-sizing: border-box; box-sizing: border-box;
} }
/* === CARDS === */
.card { .card {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -84,7 +84,7 @@ body {
border-radius: 10px; border-radius: 10px;
} }
/* Face */
.front, .back { .front, .back {
position: absolute; position: absolute;
width: 100%; width: 100%;
@ -116,7 +116,7 @@ body {
filter: drop-shadow(0 3px 4px rgba(0,0,0,0.45)); filter: drop-shadow(0 3px 4px rgba(0,0,0,0.45));
} }
/* Hover & Flip */
.card:not(.flipped):hover .front { .card:not(.flipped):hover .front {
transform: scale(1.05); transform: scale(1.05);
transition: 0.25s; transition: 0.25s;
@ -124,14 +124,14 @@ body {
.card.flipped .inner { transform: rotateY(180deg); } .card.flipped .inner { transform: rotateY(180deg); }
/* Match Shine */
.card.matched .front, .card.matched .front,
.card.matched .back { .card.matched .back {
border-color: #7affd6; border-color: #7affd6;
box-shadow: 0 0 15px #7affd6, 0 0 30px rgba(122,255,214,0.8); box-shadow: 0 0 15px #7affd6, 0 0 30px rgba(122,255,214,0.8);
} }
/* === COMBO POPUP === */
.combo-popup { .combo-popup {
position: absolute; position: absolute;
padding: 12px 20px; padding: 12px 20px;
@ -222,6 +222,7 @@ body {
<div class="end-box"> <div class="end-box">
<div class="end-title">🎉 Selamat!</div> <div class="end-title">🎉 Selamat!</div>
<p>Anda berhasil menyelesaikan permainan!</p> <p>Anda berhasil menyelesaikan permainan!</p>
<div class="score-row"><span>Skor Base:</span> <span id="baseScoreEnd">0</span></div> <div class="score-row"><span>Skor Base:</span> <span id="baseScoreEnd">0</span></div>
<div class="score-row"><span>Time Bonus:</span> <span id="timeBonusEnd">0</span></div> <div class="score-row"><span>Time Bonus:</span> <span id="timeBonusEnd">0</span></div>
<div class="score-row"><span>Move Bonus:</span> <span id="moveBonusEnd">0</span></div> <div class="score-row"><span>Move Bonus:</span> <span id="moveBonusEnd">0</span></div>
@ -240,7 +241,7 @@ body {
</div> </div>
<script> <script>
/* === 10 GAMBAR (20 kartu) === */
const images = [ const images = [
"images/fruit1.png", "images/fruit1.png",
"images/fruit2.png", "images/fruit2.png",
@ -261,6 +262,7 @@ let time = 60;
let moves = 0; let moves = 0;
let score = 0; let score = 0;
let countdown; let countdown;
let combo = 1; let combo = 1;
let pendingMatch = false; let pendingMatch = false;
let lastMatchTime = 0; let lastMatchTime = 0;
@ -280,6 +282,7 @@ function showComboPopup(targetCard, combo, bonus) {
setTimeout(() => popup.remove(), 1500); setTimeout(() => popup.remove(), 1500);
} }
function shuffleDistant(cards, minDistance = 4) { function shuffleDistant(cards, minDistance = 4) {
let valid = false; let valid = false;
let result; let result;

4
gameboard-medium.html
View File

@ -267,7 +267,7 @@ body {
</div> </div>
<script> <script>
/* === 8 GAMBAR (16 kartu) === */
const images = [ const images = [
"images/fruit1.png", "images/fruit1.png",
"images/fruit2.png", "images/fruit2.png",
@ -286,6 +286,7 @@ let time = 60;
let moves = 0; let moves = 0;
let score = 0; let score = 0;
let countdown; let countdown;
let combo = 1; let combo = 1;
let pendingMatch = false; let pendingMatch = false;
let lastMatchTime = 0; let lastMatchTime = 0;
@ -305,6 +306,7 @@ function showComboPopup(targetCard, combo, bonus) {
setTimeout(() => popup.remove(), 1500); setTimeout(() => popup.remove(), 1500);
} }
function shuffleDistant(cards, minDistance = 4) { function shuffleDistant(cards, minDistance = 4) {
let valid = false; let valid = false;
let result; let result;