fix(files): drag ghost image

Signed-off-by: skjnldsv <skjnldsv@protonmail.com>
This commit is contained in:
skjnldsv
2025-07-16 16:14:41 +02:00
committed by John Molakvoæ
parent 6ef7700ec9
commit d1f0cee6ed

View File

@ -92,7 +92,7 @@ export default Vue.extend({
</script>
<style lang="scss">
$size: 24px;
$size: 28px;
$stack-shift: 6px;
.files-list-drag-image {
@ -102,24 +102,24 @@ $stack-shift: 6px;
display: flex;
overflow: hidden;
align-items: center;
height: 44px;
padding: 6px 12px;
height: $size + $stack-shift;
padding: $stack-shift $stack-shift * 2;
background: var(--color-main-background);
&__icon,
.files-list__row-icon {
.files-list__row-icon-preview-container {
display: flex;
overflow: hidden;
align-items: center;
justify-content: center;
width: $size;
height: $size;
width: $size - $stack-shift;
height: $size - $stack-shift;;
border-radius: var(--border-radius);
}
&__icon {
overflow: visible;
margin-inline-end: 12px;
margin-inline-end: $stack-shift * 2;
img {
max-width: 100%;
@ -138,13 +138,15 @@ $stack-shift: 6px;
display: flex;
// Stack effect if more than one element
.files-list__row-icon + .files-list__row-icon {
// Max 3 elements
> .files-list__row-icon-preview-container + .files-list__row-icon-preview-container {
margin-top: $stack-shift;
margin-inline-start: $stack-shift - $size;
& + .files-list__row-icon {
margin-inline-start: $stack-shift * 2 - $size;
& + .files-list__row-icon-preview-container {
margin-top: $stack-shift * 2;
}
}
// If we have manually clone the preview,
// let's hide any fallback icons
&:not(:empty) + * {