Zelda64Recomp/assets/config_menu.rml

138 lines
4.2 KiB
Plaintext

<rml>
<head>
<link type="text/rcss" href="rml.rcss"/>
<link type="text/rcss" href="recomp.rcss"/>
<title>Inventory</title>
<style>
body
{
width: 100%;
height: 100%;
}
/* Hide the window icon. */
div#title_bar div#icon
{
display: none;
}
.flex-grid {
display: flex;
}
.col {
flex: 1;
text-align: center;
}
</style>
<link type="text/template" href="config_menu/general.rml" />
<link type="text/template" href="config_menu/controls.rml" />
<link type="text/template" href="config_menu/graphics.rml" />
<link type="text/template" href="config_menu/sound.rml" />
<link type="text/template" href="config_menu/debug.rml" />
<link type="text/template" href="components/prompt.rml" />
</head>
<body class="window">
<!-- <handle move_target="#document"> -->
<div id="window" class="rmlui-window rmlui-window--hidden" style="display:flex; flex-flow: column; background-color:rgba(0,0,0,0)" onkeydown="config_keydown">
<div class="centered-page" onclick="close_config_menu_backdrop">
<div class="centered-page__modal">
<tabset class="tabs" id="config_tabset">
<tab class="tab" autofocus id="tab_general">
<div>General</div>
<div class="tab__indicator"></div>
</tab>
<panel class="config" data-model="general_model">
<template src="config-menu__general" />
</panel>
<tab class="tab" id="tab_controls">
<div>Controls</div>
<div class="tab__indicator"></div>
</tab>
<panel class="config" data-model="controls_model">
<template src="config-menu__controls" />
</panel>
<tab class="tab" id="tab_graphics">
<div>Graphics</div>
<div class="tab__indicator"></div>
</tab>
<panel class="config" data-model="graphics_model">
<template src="config-menu__graphics" />
</panel>
<tab class="tab" id="tab_sound">
<div>Sound</div>
<div class="tab__indicator"></div>
</tab>
<panel class="config" data-model="sound_options_model">
<template src="config-menu__sound" />
</panel>
<tab class="tab" data-model="debug_model" data-if="debug_enabled" id="tab_debug">
<div>Debug</div>
<div class="tab__indicator"></div>
</tab>
<panel class="config" data-model="debug_model">
<template src="config-menu__debug" />
</panel>
</tabset>
<div data-model="game_reset_model" class="config__icon-buttons">
<button
class="icon-button"
onclick="open_reset_game_prompt"
id="config__reset_game-button"
data-if="reset_button_visibility"
>
<svg src="icons/Reset.svg" />
</button>
<button
class="icon-button"
onclick="open_quit_game_prompt"
id="config__quit-game-button"
>
<svg src="icons/Quit.svg" />
</button>
<button
class="icon-button"
onclick="close_config_menu"
id="config__close-menu-button"
>
<svg src="icons/X.svg" />
</button>
</div>
</div>
<div
class="centered-page__controls"
data-model="nav_help_model"
>
<label>
<span>Navigate</span>
<span class="prompt-font-sm">{{nav_help__navigate}}</span>
</label>
<label>
<span>Accept</span>
<span class="prompt-font-sm">{{nav_help__accept}}</span>
</label>
<label>
<span>Exit</span>
<span class="prompt-font-sm">{{nav_help__exit}}</span>
</label>
<!-- <label><span style="font-family:promptfont;">&#x21F3;</span> Navigate</label>
<label><span style="font-family:promptfont;">&#x21A7;</span> Accept</label> -->
</div>
</div>
<div
id="prompt-root"
data-model="prompt_model"
data-if="prompt__open"
data-alias-promptOpen="prompt__open"
data-alias-promptHeader="prompt__header"
data-alias-promptContent="prompt__content"
data-alias-promptConfirmLabel="prompt__confirmLabel"
data-alias-promptCancelLabel="prompt__cancelLabel"
data-event-click="prompt__on_click"
>
<template src="prompt"/>
</div>
</div>
<!-- </handle> -->
<!-- <handle size_target="#document" style="position: absolute; width: 16dp; height: 16dp; bottom: 0px; right: 0px; cursor: resize;"></handle> -->
</body>
</rml>