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

tweaking and cleanup...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-13 13:03:16 +03:00
parent d8d6a74273
commit fcf1cb4d2d
2 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -9,6 +9,7 @@
:root { :root {
/* dimensions */ /* dimensions */
--gallery-image-base-height: 18rem;
--gallery-image-margin: 0; --gallery-image-margin: 0;
--gallery-current-image-border: 0.7rem; --gallery-current-image-border: 0.7rem;
--gallery-padding: 3rem; --gallery-padding: 3rem;
@ -19,8 +20,8 @@
--gallery-padding-left: var(--gallery-padding-horizontal); --gallery-padding-left: var(--gallery-padding-horizontal);
--gallery-padding-right: var(--gallery-padding-horizontal); --gallery-padding-right: var(--gallery-padding-horizontal);
--gallery-image-scroll-margin: calc(2 * var(--gallery-current-image-border)); --gallery-image-scroll-margin: calc(2 * var(--gallery-current-image-border));
--gallery-empty-height: var(--gallery-image-base-height);
--gallery-scrollbar-width: 0.5rem; --gallery-scrollbar-width: 0.5rem;
--gallery-empty-height: 20rem;
--lightbox-frame: 5vmin; --lightbox-frame: 5vmin;
--lightbox-image-margin-top: 0.75; --lightbox-image-margin-top: 0.75;
@ -124,7 +125,7 @@ body {
/* image... */ /* image... */
.gallery .images img { .gallery .images img {
height: 300px; height: var(--gallery-image-base-height);
width: auto; width: auto;
border: solid var(--gallery-image-margin) transparent; border: solid var(--gallery-image-margin) transparent;

6
grid-n-view.html
View File

@ -111,8 +111,12 @@ var restoreScroll = function(){
- ... - ...
</pre> </pre>
<hr>
<h3>Keyboard controls</h3>
<pre> <pre>
Keyboard controls:
Left / Reight - Previos / next image Left / Reight - Previos / next image
Up / Down - Image above / below Up / Down - Image above / below
Space - Mark image (also shift-click) Space - Mark image (also shift-click)