fix css and bug
This commit is contained in:
parent
52dab54b97
commit
bb2aa2701a
@ -3333,10 +3333,12 @@ function dragAndDropFileUpload($htmlname)
|
||||
$out .= "<script>";
|
||||
$out .= '
|
||||
jQuery(document).ready(function() {
|
||||
var enterTargetDragDrop = null;
|
||||
$("#'.$htmlname.'").addClass("cssDragDropArea");
|
||||
$(".cssDragDropArea").on("dragenter", function(ev) {
|
||||
// Entering drop area. Highlight area
|
||||
console.log("We add class highlightDragDropArea")
|
||||
enterTargetDragDrop = ev.target;
|
||||
$(this).addClass("highlightDragDropArea");
|
||||
$("#'.$htmlname.'Message").removeClass("hidden");
|
||||
ev.preventDefault();
|
||||
@ -3344,9 +3346,11 @@ function dragAndDropFileUpload($htmlname)
|
||||
|
||||
$(".cssDragDropArea").on("dragleave", function(ev) {
|
||||
// Going out of drop area. Remove Highlight
|
||||
console.log("We remove class highlightDragDropArea")
|
||||
$("#'.$htmlname.'Message").addClass("hidden");
|
||||
$(this).removeClass("highlightDragDropArea");
|
||||
if (enterTargetDragDrop == ev.target){
|
||||
console.log("We remove class highlightDragDropArea")
|
||||
$("#'.$htmlname.'Message").addClass("hidden");
|
||||
$(this).removeClass("highlightDragDropArea");
|
||||
}
|
||||
});
|
||||
|
||||
$(".cssDragDropArea").on("dragover", function(ev) {
|
||||
|
||||
@ -7597,27 +7597,21 @@ div.clipboardCPValue.hidewithsize {
|
||||
|
||||
.cssDragDropArea{
|
||||
position: relative;
|
||||
border: 2px rgba(123, 123, 123, .2) dashed !important;
|
||||
padding: 10px !important;
|
||||
}
|
||||
.highlightDragDropArea{
|
||||
border: 2px #000 dashed !important;
|
||||
background-color: #666 !important;
|
||||
}
|
||||
.highlightDragDropArea * {
|
||||
pointer-events: none;
|
||||
background-color: #bbbbbb !important;
|
||||
}
|
||||
.highlightDragDropArea * :not(.dragDropAreaMessage *){
|
||||
opacity:0.5;
|
||||
opacity:0.7;
|
||||
filter: blur(3px) grayscale(100%);
|
||||
}
|
||||
.dragDropAreaMessage {
|
||||
position: absolute;
|
||||
left:50%;
|
||||
top:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
top:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align:center;
|
||||
/*BIEN PLACER CETTE DIV */
|
||||
}
|
||||
|
||||
/* ============================================================================== */
|
||||
|
||||
@ -7508,6 +7508,28 @@ div.clipboardCPValue.hidewithsize {
|
||||
zoom: 0.20;
|
||||
}
|
||||
|
||||
/* ============================================================================== */
|
||||
/* For drag and drop feature */
|
||||
/* ============================================================================== */
|
||||
|
||||
.cssDragDropArea{
|
||||
position: relative;
|
||||
}
|
||||
.highlightDragDropArea{
|
||||
border: 2px #000 dashed !important;
|
||||
background-color: #bbbbbb !important;
|
||||
}
|
||||
.highlightDragDropArea * :not(.dragDropAreaMessage *){
|
||||
opacity:0.7;
|
||||
filter: blur(3px) grayscale(100%);
|
||||
}
|
||||
.dragDropAreaMessage {
|
||||
position: absolute;
|
||||
left:50%;
|
||||
top:50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
/* ============================================================================== */
|
||||
/* CSS style used for small screen */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user