Merge pull request #2 from QuarkPixel/master

Fix Multiple UI/UX Issues and Improve Configuration Management

1 files changed, 9 insertions, 11 deletions

diff --git a/src/overlay.js b/src/overlay.js
index 613340c..78fb579 100644
--- a/src/overlay.js
+++ b/src/overlay.js
@@ -1,15 +1,13 @@
-export default class Overlay {
-  zIndex = 900;
-  zIndexHidden = -100;
+import config from './config';
 
+export default class Overlay {
   constructor() {
     const overlay = document.createElement('div');
     overlay.id = 'libra-overlay';
-    overlay.classList.add('libra-overlay');
+    overlay.classList.add('libra-overlay', 'libra-hidden');
 
-    // initialized state
-    overlay.style.zIndex = this.zIndexHidden;
-    overlay.style.opacity = '0';
+    // Set transition duration from config
+    overlay.style.transitionDuration = config.transitionDuration + 'ms';
 
     this.element = overlay;
     document.body.appendChild(overlay);
@@ -18,12 +16,12 @@ export default class Overlay {
   }
 
   show() {
-    this.element.style.opacity = '1';
-    this.element.style.zIndex = this.zIndex;
+    this.element.classList.remove('libra-hidden');
+    this.element.classList.add('libra-visible');
   }
 
   hide() {
-    this.element.style.opacity = '0';
-    this.element.style.zIndex = '-100';
+    this.element.classList.remove('libra-visible');
+    this.element.classList.add('libra-hidden');
   }
 }