Main, pause, options, and in-game menu systems wired up; ready for gameplay

This commit is contained in:
2026-08-24 22:49:16 -05:00
parent 4dacb370a6
commit 0fe31615c5
12 changed files with 327 additions and 88 deletions

11
assets/game-ui.rml Normal file
View File

@@ -0,0 +1,11 @@
<rml>
<head>
<title>game_ui</title>
<link type="text/rcss" href="globals.rcss" />
</head>
<body data-model="game_data">
<h1>Hello from RmlUi!</h1>
</body>
</rml>

42
assets/globals.rcss Normal file
View File

@@ -0,0 +1,42 @@
body {
--primary-color: #446043;
--primary-background-color: #2c3e2b;
--text-color: #ffffea;
font-family: rmlui-debugger-font;
font-size: 16dp;
color: var(--text-color);
background-color: #ffffff00;
}
h1 {
font-size: 24px;
margin-bottom: 10px;
}
p {
margin-bottom: 15px;
}
.hidden {
display: none;
}
.menu-btn {
display: block;
padding: 8px;
width: 200dp;
text-align: center;
background-color: var(--primary-color);
border: 1px #ffffff00;
font-size: 22dp;
}
.menu-btn:hover {
background-color: #4a7eb5;
}
.menu-btn:active {
background-color: #2e4e70;
}

16
assets/main-menu.rcss Normal file
View File

@@ -0,0 +1,16 @@
body {
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: var(--primary-background-color);
}
#start_menu {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
min-width: 80%;
}

16
assets/main-menu.rml Normal file
View File

@@ -0,0 +1,16 @@
<rml>
<head>
<title>gamejam</title>
<link type="text/rcss" href="globals.rcss" />
<link type="text/rcss" href="main-menu.rcss" />
</head>
<body data-model="game_data">
<div id="start_menu">
<h1>Curious Critters</h1>
<button class="menu-btn" id="start-btn" data-event-click="start_game">Start</button>
<button class="menu-btn" id="options-btn" data-event-click="open_options_menu">Options</button>
</div>
</body>
</rml>

View File

@@ -1,45 +0,0 @@
body {
font-family: rmlui-debugger-font;
font-size: 16px;
color: white;
width: 100vw;
height: 100vh;
}
#panel {
position: absolute;
top: 40px;
left: 40px;
width: 300px;
padding: 20px;
background-color: rgba(20, 20, 20, 220);
border: 2px #888;
}
h1 {
font-size: 24px;
color: #ffd35c;
margin-bottom: 10px;
}
p {
margin-bottom: 15px;
}
.hidden {
display: none;
}
.menu-btn {
display: block;
width: 100px;
padding: 8px;
text-align: center;
background-color: #3a6ea5;
color: white;
border: 1px #5a8ec5;
}
.menu-btn:hover {
background-color: #4a7eb5;
}

15
assets/options-menu.rml Normal file
View File

@@ -0,0 +1,15 @@
<rml>
<head>
<title>options_menu</title>
<link type="text/rcss" href="globals.rcss" />
<link type="text/rcss" href="main-menu.rcss" />
</head>
<body data-model="game_data">
<div id="start_menu">
<h1>Options</h1>
<button class="menu-btn" id="back-btn" data-event-click="go_back">Done</button>
</div>
</body>
</rml>

18
assets/pause-menu.rml Normal file
View File

@@ -0,0 +1,18 @@
<rml>
<head>
<title>pause_menu</title>
<link type="text/rcss" href="globals.rcss" />
<link type="text/rcss" href="main-menu.rcss" />
</head>
<body data-model="game_data">
<div id="start_menu">
<h1>Pause</h1>
<button class="menu-btn" id="continue-btn" data-event-click="unpause_game">Continue</button>
<button class="menu-btn" id="options-btn" data-event-click="open_options_menu">Options</button>
<button class="menu-btn" id="end-game-btn" data-event-click="end_current_game">End Game (All progress will
be lost)</button>
</div>
</body>
</rml>