tiennm99/ai-coding-workflow-labs
1
0
Fork 0
mirror of https://github.com/tiennm99/ai-coding-workflow-labs.git synced 2026-09-16 22:21:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(03-02): add score display HTML overlay

Browse Source 
- Added div with id=\"score-display\" in top-right corner
- Semi-transparent background (rgba(26, 26, 70, 0.9))
- Large bold font (24px) with light text color (#eaeaea)
- Initial text shows \"Score: 0\"
- Positioned above canvas with z-index: 100
This commit is contained in:
tiennm99
2026-03-11 04:41:00 +00:00
parent 1099f83a5c
commit ff85264326
1 changed files with 42 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
gsd-framework/index.html
+42 -29
View File
@@ -1,29 +1,42 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Pikachu Match Game</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #1a1a2e;
}
#game {
border-radius: 8px;
}
</style>
</head>
<body>
<canvas id="game"></canvas>
<script type="module" src="/src/main.ts"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Pikachu Match Game</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #1a1a2e;
}
#game {
border-radius: 8px;
}
#score-display {
position: absolute;
top: 20px;
right: 20px;
background-color: rgba(26, 26, 70, 0.9);
color: #eaeaea;
padding: 16px 24px;
border-radius: 8px;
font-size: 24px;
font-weight: bold;
z-index: 100;
}
</style>
</head>
<body>
<canvas id="game"></canvas>
<div id="score-display">Score: 0</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>