zakarya/puzzles
1
0
Fork 0
mirror of git://git.tartarus.org/simon/puzzles.git synced 2025-04-21 08:01:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

js: More conventional marking of menu item types

Browse Source 
Menu items that open dialogue boxes are now marked with ellipses, while
menu items that lead to submenus have pointing triangles.

The triangles are implemented as SVG files embedded in data: URLs in the
CSS, which is kind of silly but also works really well.  There are
suitable characters in Unicode, but some of my test systems don't have
fonts containing them, so maybe the SVG is better.
This commit is contained in:
Ben Harris
2022-11-24 16:13:57 +00:00
parent fe29d1cbf5
commit 271fb7f47c
2 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
emcc.c
View File

@ -975,7 +975,7 @@ int main(int argc, char **argv)
populate_js_preset_menu(0, menu);
if (thegame.can_configure)
js_add_preset(0, "Custom", -1);
js_add_preset(0, "Custom...", -1);
have_presets_dropdown = npresets > 0 || thegame.can_configure;

25
html/jspage.pl
View File

@ -228,6 +228,19 @@ EOF
color: transparent;
}
#gamemenu li > div:after {
/* Downward arrow for submenu headings at the top level. */
content: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='10'%3E%3Cpolygon%20points='0,5,10,5,5,10'/%3E%3C/svg%3E");
margin-left: 0.5em;
}
#gamemenu li li > div:after {
/* Rightward arrow marker for submenus on lower-level menus. */
content: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='10'%20height='10'%3E%3Cpolygon%20points='0,0,10,5,0,10'/%3E%3C/svg%3E");
float: right;
}
#statusbar {
overflow: hidden;
height: 1.2em;
@ -307,13 +320,13 @@ ${unfinishedpara}
<hr>
<div id="puzzle" style="display: none">
<form id="gamemenu"><ul>
<li><div tabindex="0">Game...<ul>
<li><button type="button" id="specific">Enter game ID</button></li>
<li><button type="button" id="random">Enter random seed</button></li>
<li><button type="button" id="save">Download save file</button></li>
<li><button type="button" id="load">Upload save file</button></li>
<li><div tabindex="0">Game<ul>
<li><button type="button" id="specific">Enter game ID...</button></li>
<li><button type="button" id="random">Enter random seed...</button></li>
<li><button type="button" id="save">Download save file...</button></li>
<li><button type="button" id="load">Upload save file...</button></li>
</ul></div></li>
<li><div tabindex="0">Type...<ul role="menu" id="gametype"></ul></div></li>
<li><div tabindex="0">Type<ul role="menu" id="gametype"></ul></div></li>
<li role="separator"></li>
<li><button type="button" id="new">
New<span class="verbiage"> game</span>