Stirling-PDF/src/main/resources/static/css/dragdrop.css
jordy b470cdf60c fix bugs in drag/drop, move styling for functions to separate sheets
To clean up the multi tool page and make the pdf adapters more re-usable the style for them was moved to separate pages that are inserted into head when the adapter is created.
2023-04-30 13:38:30 +02:00

78 lines
No EOL
1.4 KiB
CSS

#drag-container {
position: fixed;
display:flex;
inset: 0;
pointer-events: none;
z-index: 10000;
visibility: hidden;
}
#drag-container:not(:empty) {
visibility: visible;
}
#drag-container .dragged-img {
position: fixed;
max-width: 200px;
max-height: 200px;
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.58);
transform-origin: top left;
}
.drag-manager_dragging {
width: 0px;
visibility: hidden;
}
.drag-manager_draghover {
width: 375px !important;
}
.drag-manager_draghover .insert-file-button-container {
display: none !important;
}
.drag-manager_draghover .button-container {
visibility: hidden !important;
}
html[lang-direction=ltr] .drag-manager_draghover img {
left: calc(50% + 62.5px) !important;
}
html[lang-direction=rtl] .drag-manager_draghover img {
left: unset;
}
.drag-manager_dragging-container .hide-on-drag {
display: none !important;
}
.drag-manager_endpoint {
width: 80px;
height: 100%;
background-color: #FFFFFF10;
transition: width 0.1s;
animation: end-drop-expand .3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.drag-manager_endpoint svg {
width: 50px;
height: 50px;
}
.drag-manager_endpoint.drag-manager_draghover {
width: 150px !important;
}
@keyframes end-drop-expand {
from {
width: 0;
}
to {
width: 80px;
}
}