From bd578b5294cadd1ca7b2de40328451d79eb76ac8 Mon Sep 17 00:00:00 2001
From: Arsen Mirzaev Tatyano-Muradovich <arsen@mirzaev.sexy>
Date: Mon, 30 Jun 2025 22:33:47 +0700
Subject: [PATCH] created

---
 README.md | 34 +++++++++++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 9ace70e..c6878f7 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,35 @@
 # gallery.mjs
+Module for creating galleries with re-ordering
 
-Module for creating galleries with re-ordering
\ No newline at end of file
+## Example
+```html
+<section id="wrap">
+  <label for="images" class="unselectable">
+    Choose images
+    <input id="images" type="file" name="images" accept="image/png, image/jpeg, image/webp" multiple="true" onchange="document.getElementById('wrap')?.gallery.import(this.files)" />
+  </label>
+  <button id="reset" onclick="document.getElementById('wrap')?.gallery.ascending()">Reset</button>
+
+  <label id="loader" for="images" class="unselectable">Empty</label>
+  <div id="gallery"></div>
+
+  <span id="order" class="unselectable">Order:</div>
+</section>
+```
+```js
+import("/js/modules/gallery.mjs").then((module) => {
+  // Initializing the instance
+  const instance = new module.gallery(
+    document.getElementById("wrap"),
+    document.getElementById("images"),
+    document.getElementById("gallery"),
+    true
+  );
+});
+```
+CSS in the `/index.css` file
+
+## Demonstration
+### [CodePen](https://codepen.io/mirzaev-sexy/pen/RNPdYvv)<br><br>
+![CodePen preview](preview/1.png)
+![CodePen preview](preview/2.gif)
\ No newline at end of file