imxyy1soope1/quoridor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: single player

Browse Source
This commit is contained in:
imxyy_soope_
2025-09-23 18:16:50 +08:00
commit c7d34659db
22 changed files with 4272 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/Room.tsx Normal file
View File

@@ -0,0 +1,61 @@
import { useParams } from "@solidjs/router";
function Room() {
const params = useParams();
return (
<>
<div class="flex-grow flex flex-col">
<div class="pt-2 flex items-center justify-center">
<span class="text-xl">路墙棋</span>
</div>
<div class="text-center text-sm mb-4">房间号: {params.roomId}</div>
<div class="flex flex-wrap justify-center -my-2">
<div class="relative box-shadow w-14 h-14 rounded-full border text-center flex items-center justify-center mx-4 my-2">
<div class="text-2xl overflow-hidden">
player1
</div>
<div class="absolute whitespace-nowrap px-1 translate-x-[-50%] rounded-full text-white text-xs bg-orange-600 top-0 left-[7px]">
房主
</div>
<div class="absolute whitespace-nowrap px-1 translate-x-[-50%] rounded-full text-white text-xs bg-orange-600 font-mono top-[39px] left-[46px]">
1
</div>
<div class="absolute whitespace-nowrap px-1 translate-x-[-50%] rounded-full text-white text-xs bg-orange-600 top-[39px] left-[7px]">
我
</div>
<button type="button" class="block absolute w-14 h-14 rounded-full" />
</div>
<div class="relative box-shadow w-14 h-14 rounded-full border text-center flex items-center justify-center mx-4 my-2">
<div class="text-2xl overflow-hidden">
player2
</div>
<div class="absolute whitespace-nowrap px-1 translate-x-[-50%] rounded-full text-white text-xs bg-gray-600 font-mono top-[39px] left-[46px]">
2
</div>
<div class="absolute left-[3px] top-[42px] border border-black rounded-full w-2.5 h-2.5 bg-gray-500" />
<button type="button" class="absolute rounded-full block h-6 w-6 leading-6 -top-1 left-9 bg-red-500 text-white active:bg-red-600 box-shadow">
✕
</button>
</div>
</div>
<div class="text-center">
<div class="mt-8 mb-12">
<button type="button" class="inline-block overflow-hidden whitespace-nowrap transition-colors rounded-full box-shadow h-6 leading-6 px-2 text-xs text-black/90 bg-slate-200/80 active:bg-slate-300/70">
离开座位，观战
</button>
</div>
<div class="my-8">
<button type="button" class="inline-block overflow-hidden whitespace-nowrap transition-colors rounded-full box-shadow h-10 leading-10 px-4 text-base text-white primary">
开始游戏
</button>
</div>
</div>
</div>
</>
)
}
export default Room;