Merge pull request #2 from QuarkPixel/master

Fix Multiple UI/UX Issues and Improve Configuration Management

1 files changed, 15 insertions, 3 deletions

diff --git a/README.md b/README.md
index cf174f9..b78b968 100644
--- a/README.md
+++ b/README.md
@@ -41,12 +41,24 @@ You can configure Libra.js by passing an object to the constructor. The defaults
 
 ```js
 new LightBox({
-  selector: '[data-libra]', // Selector for images to be lightboxed
-  margin: 50,               // Margin around the lightbox
-  offset: { x: 0, y: 0 }    // Offset for the lightbox position
+  selector: "[data-libra]", // Selector for images to be lightboxed
+  margin: 50, // Margin around the lightbox
+  offset: { x: 0, y: 0 }, // Offset for the lightbox position
+  transitionDuration: 200, // Animation duration in milliseconds
+  imageCursor: "zoom-in", // Cursor style for hoverable images
 });
 ```
 
+### Z-index Configuration
+
+Z-index values are managed through CSS classes for better maintainability:
+
+- `.libra-overlay.libra-visible`: z-index 900 (overlay when visible)
+- `.libra-overlay.libra-hidden`: z-index -100 (overlay when hidden)
+- `.libra-shadow`: z-index 1000 (shadow image)
+
+You can customize these values by overriding the CSS classes in your own stylesheet.
+
 ## Development
 
 ```