gideonstar/imgpaste
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity

* CSS Klassen umbenannt

Browse Source 
* Debug Code entfernt
This commit is contained in:
root 2023-03-24 08:34:29 +01:00
parent e7fb076f12
commit 24c9f12695
3 changed files with 17 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.php
View File

@ -17,7 +17,7 @@
</head>
<body>
<div id="wrapper">
<div id="dropzone" class="nodrop">
<div id="dropzone" class="inactive">
<p><?php echo $text; ?></p>
</div>
</div>

22
script.js
View File

@ -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' ) {

11
themes/gideonstar/style.css
View File

@ -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;
}