From a95b1cef1f50b4a93f7c4d83fc13903871c7179b Mon Sep 17 00:00:00 2001
From: sangge <2251250136@qq.com>
Date: Wed, 29 Nov 2023 08:40:51 +0800
Subject: [PATCH] feat: add game page

---
 game.html | 72 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 72 insertions(+)
 create mode 100644 game.html
diff --git a/game.html b/game.html
new file mode 100644
index 0000000..b69341a
--- /dev/null
+++ b/game.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>餐厅游戏</title>
+        <style>
+  body {
+    background-image: url('src/pic/desktop.png'); /* 替换为您的餐厅背景图片路径 */
+    background-repeat: no-repeat;
+  }
+  #restaurant .character {
+    position: absolute;
+    width: 128px; /* 固定图片的宽度 */
+    transform:scale(0.5);
+  }
+  #restaurant .dish {
+    position: absolute;
+    width: 128px; /* 固定图片的宽度 */
+    transform:scale(0.3);
+  }
+  /* 根据图片实际位置调整left和top值 */
+  #customer1 { /* 中年男 */
+    left: 100px;
+    top: 200px;
+  }
+  #customer2 { /* 小女孩 */
+    left: 200px;
+    top: 200px;
+  }
+  #customer3 { /* 老奶奶 */
+    left: 300px;
+    top: 200px;
+  }
+  #mapo-tofu { /* 麻婆豆腐 */
+    left: 400px;
+    top: 500px;
+  }
+  #roast-duck { /* 烤鸭 */
+    left: 500px;
+    top: 500px;
+    /*display: none; /* 一开始不显示烤鸭 */
+  }
+</style>
+    </head>
+    <body>
+        <!-- 游戏的界面元素 -->
+        <div id="restaurant">
+            <div id="customer1" class="character">
+                <img src="src/pic/Customer1_YoungMan.png" alt="中年男">
+            </div>
+            <div id="customer2" class="character">
+                <img src="src/pic/Customer2_LittleGirl.png" alt="小女孩">
+            </div>
+            <div id="customer3" class="character">
+                <img src="src/pic/Customer3_OldLady.png" alt="老奶奶">
+            </div>
+            <div id="mapo-tofu" class="dish">
+                <img src="src/pic/MapoTofu_FinishedDish.png" alt="麻婆豆腐">
+            </div>
+            <div id="roast-duck" class="dish">
+                <img src="src/pic/roast_duck.png" alt="烤鸭">
+            </div>
+            <!-- 在这里添加您的餐厅布局和游戏元素 -->
+        </div>
+
+        <script>
+// 在这里添加您的游戏逻辑
+// 这将涉及到食客的随机出现，接受订单，点击生成食物，以及满足订单后消失的逻辑
+</script>
+    </body>
+</html>
