From 24c9f12695060681719caaf673601b1624a92d31 Mon Sep 17 00:00:00 2001 From: root Date: Fri, 24 Mar 2023 08:34:29 +0100 Subject: [PATCH] * CSS Klassen umbenannt * Debug Code entfernt --- index.php | 2 +- script.js | 22 ++++++++++------------ themes/gideonstar/style.css | 11 ++++++----- 3 files changed, 17 insertions(+), 18 deletions(-) diff --git a/index.php b/index.php index a92b014..90c2c93 100644 --- a/index.php +++ b/index.php @@ -17,7 +17,7 @@
-
+

diff --git a/script.js b/script.js index 27cf0b8..2b1776e 100644 --- a/script.js +++ b/script.js @@ -2,25 +2,23 @@ dropzone = document.getElementById('dropzone'); dropzone.addEventListener('dragover', function(e) { e.preventDefault(); - this.classList.remove('nodrop'); - this.classList.add('drop'); + this.classList.remove('inactive'); + this.classList.add('active'); }); dropzone.addEventListener('dragleave', function(e) { - this.classList.remove('drop'); - this.classList.add('nodrop'); + this.classList.remove('active'); + this.classList.add('inactive'); }); dropzone.addEventListener('mousedown', function(e) { - this.classList.remove('nodrop'); - this.classList.add('drop'); - console.log('click'); + this.classList.remove('inactive'); + this.classList.add('active'); }); dropzone.addEventListener('mouseup', function(e) { - this.classList.remove('drop'); - this.classList.add('nodrop'); - console.log('unclick'); + this.classList.remove('active'); + this.classList.add('inactive'); }); dropzone.addEventListener('click', function(e) { @@ -39,8 +37,8 @@ dropzone.addEventListener('click', function(e) { dropzone.addEventListener('drop', function(e) { e.preventDefault(); - this.classList.remove('drop'); - this.classList.add('nodrop'); + this.classList.remove('active'); + this.classList.add('inactive'); file = e.dataTransfer.files[0]; if( file.type == 'image/png' || file.type == 'image/jpeg' ) { diff --git a/themes/gideonstar/style.css b/themes/gideonstar/style.css index 0786f1b..67a4b4e 100644 --- a/themes/gideonstar/style.css +++ b/themes/gideonstar/style.css @@ -36,12 +36,13 @@ body { justify-content: center; } -.nodrop { +.active { + background-color: #ffb703; + outline: 2px dashed #fb8500; +} + +.inactive { background-color: #f5f5f5; outline: 2px dashed #d5d5d5; } -.drop { - background-color: #ffb703; - outline: 2px dashed #fb8500; -}