allow organize pics
All checks were successful
Deploy Sokko G / deploy (push) Successful in 6s

This commit is contained in:
Shinuwa 2026-07-25 18:49:11 +02:00
parent 895fec2b40
commit 0c7ae46b4d
4 changed files with 129 additions and 29 deletions

View file

@ -1720,6 +1720,60 @@ textarea:focus {
background: rgba(5, 7, 17, 0.38);
}
.images figure.is-dragging {
opacity: 0.42;
}
.images figure.is-drop-target {
border-color: rgba(246, 196, 83, 0.72);
box-shadow: 0 0 0 1px rgba(246, 196, 83, 0.26), 0 0 18px rgba(246, 196, 83, 0.12);
}
.images figure.is-drop-target.drop-after {
border-color: rgba(112, 89, 255, 0.82);
box-shadow: 0 0 0 1px rgba(164, 124, 255, 0.3), 0 0 18px rgba(112, 89, 255, 0.16);
}
.image-drag-handle {
position: absolute;
z-index: 4;
top: 12px;
left: 12px;
display: grid;
width: 32px;
height: 32px;
place-items: center;
padding: 0;
border: 1px solid rgba(138, 150, 197, 0.22);
border-radius: var(--radius-md);
background: rgba(9, 13, 29, 0.76);
color: rgba(229, 235, 255, 0.78);
cursor: grab;
opacity: 0;
transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast), box-shadow var(--transition-fast);
}
.image-drag-handle .ui-icon {
width: 16px;
height: 16px;
}
.images figure:hover .image-drag-handle,
.images figure:focus-within .image-drag-handle {
opacity: 1;
}
.image-drag-handle:hover {
border-color: rgba(246, 196, 83, 0.56);
background: rgba(20, 28, 55, 0.86);
color: var(--color-accent-gold);
box-shadow: 0 0 14px rgba(246, 196, 83, 0.12);
}
.image-drag-handle:active {
cursor: grabbing;
}
.image-preview {
display: block;
width: 100%;