olyakonstantin/gallery
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

basic button/action iconography...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-14 11:49:34 +03:00
parent d7fc670604
commit 693a75b8bc
2 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
css/grid-n-view.css
View File

@ -235,6 +235,7 @@ body {
z-index: calc(var(--base-layer) + 1); z-index: calc(var(--base-layer) + 1);
border: solid 1px var(--gallery-secondary-color);
background: var(--gallery-background-color); background: var(--gallery-background-color);
} }
/* XXX need to hide parts of the toolbar and make it transparent... */ /* XXX need to hide parts of the toolbar and make it transparent... */
@ -243,9 +244,20 @@ body {
display: none; display: none;
} }
/* XXX */ /* buttons... */
.gallery .toolbar button { .gallery .toolbar button {
line-height: 1.5rem;
min-width; 1.5rem;
text-align: center;
border: solid 1px transparent;
background: var(--gallery-background-color);
} }
.gallery .toolbar button:hover {
border-radius: calc(1.5rem / 5);
border: solid 1px var(--gallery-secondary-color);
}

20
grid-n-view.html
View File

@ -142,17 +142,17 @@ For more info see: <a href="./README.md">README.md</a>
<div class="gallery"> <div class="gallery">
<!-- toolbar --> <!-- toolbar -->
<div class="toolbar"> <div class="toolbar">
<button onclick="gallery.toggleMark()" title="toggle mark current (space)">M</button> <button onclick="gallery.toggleMark()" title="toggle mark current (space)">&#9680;</button>
<button onclick="gallery.markAll()" title="mark all (ctrl-a)">+M*</button> <button onclick="gallery.markAll()" title="mark all (ctrl-a)">&#9210;*</button>
<button onclick="gallery.unmarkAll()" title="unmark all (ctrl-d)">-M*</button> <button onclick="gallery.unmarkAll()" title="unmark all (ctrl-d)">&#11096;*</button>
<button onclick="gallery.markInverse()" title="reverse mark (ctrl-i)">!M</button> <button onclick="gallery.markInverse()" title="reverse mark (ctrl-i)">&#9680;*</button>
<button onclick="gallery.remove('marked')" title="remove marked">-M</button> <button onclick="gallery.remove('marked')" title="remove marked">&olcross;</button>
| |
<button onclick="gallery.toggleQueueRemoval()" title="toggle removal (del)">D</button> <button onclick="gallery.toggleQueueRemoval()" title="queue removal (del)">&#9703;</button>
<button onclick="gallery.queueRemoval('marked')" title="queue marked removal">+DM</button> <button onclick="gallery.queueRemoval('marked')" title="queue marked removal">&#9724;&#9210;</button>
<button onclick="gallery.unqueueRemoval('marked')" title="unqueue marked removal">-DM</button> <button onclick="gallery.unqueueRemoval('marked')" title="unqueue marked removal">&#9723;&#9210;</button>
<button onclick="gallery.toggleQueueRemoval('marked')" title="toggle marked removal">!DM</button> <button onclick="gallery.toggleQueueRemoval('marked')" title="toggle marked removal">&#9703;&#9210;</button>
<button onclick="gallery.removeQueued()" title="remove queued (shift-del)">Remove</button> <button onclick="gallery.removeQueued()" title="remove queued (shift-del)">&#9746;</button>
| |
<button onclick="gallery.clear()" title="clear">Clear</button> <button onclick="gallery.clear()" title="clear">Clear</button>
</div> </div>