From 18de12dc7e1759206f3e544f2430dcb7071af936 Mon Sep 17 00:00:00 2001
From: "Alex A. Naanou" <alex.nanou@gmail.com>
Date: Tue, 15 Aug 2023 20:59:21 +0300
Subject: [PATCH] minor tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
---
 README.md           |  7 ++++---
 css/grid-n-view.css | 17 +++++++++++++++++
 grid-n-view.html    |  1 +
 3 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index f8a2185..d2bbc3b 100644
--- a/README.md
+++ b/README.md
@@ -8,11 +8,12 @@
 - ~~toolbar -- floating over gallery~~
 	- lightbox (current)
 	- info (current)
-	- select / deselect (current / all)
-	- delete / clear deleted (current / all)
+	- ~~select / deselect (current / all)~~
+	- ~~delete / clear deleted (current / all)~~
 	- crop
 	- load
-	- **styling and icons...**
+	- ~~styling and icons...~~
+	- draggable?
 - toolbar -- floating over image (gallery/lightbox/details/...)
 	- lightbox
 	- info
diff --git a/css/grid-n-view.css b/css/grid-n-view.css
index 4cb5507..065259e 100644
--- a/css/grid-n-view.css
+++ b/css/grid-n-view.css
@@ -254,6 +254,8 @@ body {
 		padding-right 0.2s,
 		opacity 0.2s,
 		translate 0.2s;
+
+	user-select: none;
 }
 /* XXX need to hide parts of the toolbar and make it transparent... */
 .gallery.lightboxed .toolbar,
@@ -366,6 +368,21 @@ body {
 	border: solid 1px transparent;
 }
 
+.gallery .toolbar .drag-handle {
+	font-family: "Material Symbols Outlined";
+	font-size: var(--toolbar-button-size); 
+	line-height: var(--toolbar-button-size);
+	font-weight: 300;
+
+	cursor: pointer;
+
+	opacity: 0.3;
+}
+.gallery .toolbar .drag-handle:hover {
+	opacity: 1;
+}
+
+
 
 /******************************************************* Overlays ****/
 
diff --git a/grid-n-view.html b/grid-n-view.html
index 0cbe28d..b72750c 100644
--- a/grid-n-view.html
+++ b/grid-n-view.html
@@ -79,6 +79,7 @@ For more info see: <a href="./README.md">README.md</a>
 <div class="gallery">
 	<!-- toolbar -->
 	<div class="toolbar">
+		<div class="drag-handle" title="drag">drag_indicator</div> 
 		<div>
 			<button onclick="gallery" title="upload">cloud_upload</button> 
 			<button onclick="gallery" title="save">save</button>