Attempt to fix note resizing with React keys and Muuri sync

This commit is contained in:
2026-01-24 19:52:13 +01:00
parent d59ec592eb
commit 8e35780717
48 changed files with 3369 additions and 279 deletions

View File

@@ -26,7 +26,7 @@
.masonry-item-content {
position: relative;
width: 100%;
height: 100%;
/* height: auto - let content determine height */
box-sizing: border-box;
}
@@ -45,16 +45,22 @@
}
/* Note Size Styles - Desktop Default */
.masonry-item[data-size="small"],
.note-card[data-size="small"] {
min-height: 150px !important;
min-height: 150px;
height: auto !important;
}
.masonry-item[data-size="medium"],
.note-card[data-size="medium"] {
min-height: 200px !important;
min-height: 200px;
height: auto !important;
}
.masonry-item[data-size="large"],
.note-card[data-size="large"] {
min-height: 300px !important;
min-height: 300px;
height: auto !important;
}
/* Drag State Styles - Clean and flat behavior requested by user */
@@ -124,16 +130,22 @@
}
/* Smaller note sizes on mobile */
.masonry-item[data-size="small"],
.masonry-item-content .note-card[data-size="small"] {
min-height: 120px;
height: auto !important;
}
.masonry-item[data-size="medium"],
.masonry-item-content .note-card[data-size="medium"] {
min-height: 160px;
height: auto !important;
}
.masonry-item[data-size="large"],
.masonry-item-content .note-card[data-size="large"] {
min-height: 240px;
height: auto !important;
}
/* Reduced drag effect on mobile */
@@ -183,7 +195,7 @@
.masonry-item,
.masonry-item-content,
.note-card {
transition-property: transform, box-shadow, opacity;
transition-property: box-shadow, opacity;
transition-duration: 0.2s;
transition-timing-function: ease-out;
}