aesthetics...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-09-12 15:51:25 +03:00
parent 58f44fc983
commit 1ad674e466
3 changed files with 7 additions and 5 deletions

View File

@ -9,7 +9,8 @@
- ~~Views: Gallery / Details / Lightbox~~ - ~~Views: Gallery / Details / Lightbox~~
- Details: populate fields - Details: populate fields
- Details: edit - Details: edit
- ~~toolbar -- floating over gallery~~ - ~~toolbar: collapsed view icon...~~
- ~~toolbar: floating over gallery~~
- ~~info (current)~~ -- should this be floating over image?? - ~~info (current)~~ -- should this be floating over image??
- ~~select / deselect (current / all)~~ - ~~select / deselect (current / all)~~
- ~~delete / clear deleted (current / all)~~ - ~~delete / clear deleted (current / all)~~

View File

@ -474,20 +474,21 @@ button:active {
/* button: collapse... */ /* button: collapse... */
.gallery .toolbar button.collapse { .gallery .toolbar button.collapse {
position: absolute; position: absolute;
width: var(--height);
height: 100%; height: 100%;
top: 0; top: 0;
right: 0; right: 0;
opacity: 0.4; opacity: 0.4;
}
.gallery .toolbar button.collapse sec {
transition: transition:
rotate 0.2s, rotate 0.2s,
text-shadow var(--color-transition) ease, text-shadow var(--color-transition) ease,
background var(--color-transition) ease, background var(--color-transition) ease,
color var(--color-transition) ease; color var(--color-transition) ease;
} }
.gallery .toolbar:not(.shown) button.collapse { .gallery .toolbar:not(.shown) button.collapse sec {
rotate: 180deg; rotate: 180deg;
} }
.gallery .toolbar button.collapse:hover { .gallery .toolbar button.collapse:hover {

View File

@ -96,7 +96,7 @@ For more info see: <a href="./README.md">README.md</a>
<button title="2">2</button> <button title="2">2</button>
<button title="3">3</button> <button title="3">3</button>
</div> </div>
<button class="collapse" title="toggle toolbar (hold to make sticky)">keyboard_double_arrow_left</button> <button class="collapse" title="toggle toolbar (hold to make sticky)">crossword<sec>keyboard_double_arrow_left</sec></button>
</div--> </div-->
<!-- toolbar: general... --> <!-- toolbar: general... -->
<div class="toolbar fixed"> <div class="toolbar fixed">
@ -128,7 +128,7 @@ For more info see: <a href="./README.md">README.md</a>
<div> <div>
<button onclick="gallery.clear()" title="clear">close</button> <button onclick="gallery.clear()" title="clear">close</button>
</div> </div>
<button class="collapse" title="toggle toolbar (hold to make sticky)">keyboard_double_arrow_left</button> <button class="collapse" title="toggle toolbar (hold to make sticky)">edit_square<sec>keyboard_double_arrow_left</sec></button>
</div> </div>
</div> </div>
<!-- gallery: content --> <!-- gallery: content -->