57 lines
3.3 KiB
Plaintext
57 lines
3.3 KiB
Plaintext
<rml>
|
|
<head>
|
|
<title>Load game</title>
|
|
<link type="text/rcss" href="rem.rcss"/>
|
|
<style>
|
|
body.window.lg { left: 50%; margin-left: -460dp; top: 12%; width: 920dp; height: 600dp; }
|
|
.cols { flex: 1; display: flex; flex-direction: row; min-height: 0; }
|
|
.savelist { flex: 1; overflow-y: auto; border: 1dp #24405c; border-radius: 3dp; background-color: #0d1622; }
|
|
.sv { display: flex; flex-direction: row; align-items: center; padding: 9dp 12dp; border-bottom: 1dp #ffffff08; border-left: 3dp #00000000; }
|
|
.sv:hover { background-color: #122033; }
|
|
.sv.sel { border-left-color: #f2b13c; background-color: #f2b13c1a; }
|
|
.sv .n { flex: 1; font-size: 16dp; white-space: nowrap; overflow: hidden; }
|
|
.sv .t { font-family: "IBM Plex Mono"; font-size: 12dp; color: #8197ad; margin-left: 12dp; }
|
|
.det { width: 300dp; margin-left: 16dp; padding: 14dp; border: 1dp #24405c; border-radius: 3dp; background-color: #0d1622; }
|
|
.det .row { display: flex; flex-direction: row; padding: 7dp 0; border-bottom: 1dp #ffffff08; }
|
|
.det .row .k { width: 90dp; color: #8197ad; font-size: 13dp; text-transform: uppercase; letter-spacing: 1dp; }
|
|
.det .row .v { flex: 1; font-size: 15dp; }
|
|
.acts { display: flex; flex-direction: row; justify-content: flex-end; margin-top: 14dp; }
|
|
.acts .btn { margin-left: 8dp; }
|
|
</style>
|
|
</head>
|
|
<body class="window lg" data-model="loadgame">
|
|
<div class="win-head">
|
|
<span class="title">LOAD GAME</span>
|
|
<span class="spacer"></span>
|
|
<span class="chip">Saves <span class="v">{{ saves.size }}</span></span>
|
|
</div>
|
|
<div class="win-main">
|
|
<div class="content" style="display: flex; flex-direction: column;">
|
|
<div class="cols">
|
|
<div class="savelist">
|
|
<div class="hint" style="padding: 12dp;" data-if="saves.size == 0">No saved games.</div>
|
|
<div class="sv" data-for="s : saves" data-class-sel="s.selected" data-action="pick" data-attr-data-arg="s.key">
|
|
<span class="n">{{ s.name }}</span><span class="t">{{ s.time }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="det">
|
|
<h3>Saved game</h3>
|
|
<div class="hint" data-if="!has_pick">Pick a saved game.</div>
|
|
<div data-if="has_pick">
|
|
<div class="row"><span class="k">Credits</span><span class="v">{{ money }}</span></div>
|
|
<div class="row"><span class="k">Rank</span><span class="v">{{ rank }}</span></div>
|
|
<div class="row"><span class="k">Place</span><span class="v">{{ place }}</span></div>
|
|
<div class="row"><span class="k">Ship</span><span class="v">{{ ship }}</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="acts">
|
|
<div class="btn" data-class-disabled="busy" data-action="menu">Main menu</div>
|
|
<div class="btn" data-class-disabled="!has_pick || busy" data-action="delete">Delete</div>
|
|
<div class="btn primary" data-class-disabled="!has_pick || busy" data-action="load">Load game</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</rml>
|