More bean

This commit is contained in:
Joey Yakimowich-Payne 2025-04-17 16:38:08 -06:00
commit 5809cb02fd
No known key found for this signature in database
GPG key ID: 6BFE655FA5ABD1E1
3 changed files with 128 additions and 27 deletions

View file

@ -7,7 +7,7 @@
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="css/beango.css">
</head>
<body class="flex h-screen overflow-hidden font-sans relative">
<body class="flex flex-col items-center justify-center p-4 font-sans relative">
<!-- Notification Area -->
<div id="notification-area" class="fixed bottom-4 left-1/2 transform -translate-x-1/2 z-50 px-4 py-2 rounded shadow-lg text-white text-sm transition-opacity duration-300 opacity-0">
@ -15,8 +15,8 @@
</div>
<!-- Main Content Area (Board and Controls) -->
<div class="flex-grow flex flex-col items-center justify-center p-4 overflow-y-auto">
<div id="board-header" class="bg-white rounded-t-lg p-4 w-full max-w-2xl centered">
<div class="w-full flex flex-col items-center justify-center p-4 overflow-y-auto">
<div id="board-header" class="bg-white rounded-t-lg pt-4 w-full max-w-2xl centered">
<h1 class="text-4xl font-bold text-green-800 mb-6">Beango!</h1>
<img id="bean" src="../bean.svg" alt="Bean" onclick="explodeBeans()">
</div>
@ -50,7 +50,7 @@
</div>
<!-- Configuration Pane (Right Side) -->
<div id="config-pane" class="w-80 bg-white p-6 shadow-lg fixed top-0 right-0 h-full z-20 overflow-y-auto transition-transform duration-300 ease-in-out">
<div id="config-pane" class="w-80 bg-white p-6 shadow-lg fixed top-0 right-0 h-full z-20 overflow-y-auto transition-transform duration-300 ease-in-out config-pane-closed">
<h2 class="text-xl font-semibold text-green-700 mb-4">Configuration</h2>
<div class="space-y-4">
<div>