collapse using ellipsis, hide media

1 files changed, 12 insertions, 11 deletions

diff --git a/src/ui/Note.js b/src/ui/Note.js
index e35171a..d4ef30a 100644
--- a/src/ui/Note.js
+++ b/src/ui/Note.js
@@ -151,16 +151,12 @@ section.hidden {
 	display: none;
 }
 
-section.collapsed {
-	width: auto;
-}
-section.collapsed > main {
-	display: none;
-}
-
 section.ellipsis > main {
 	max-height: 7em;
 }
+section.ellipsis > .attachment {
+	display: none;
+}
 section.ellipsis > main::after {
 	position: absolute;
 	display: block;
@@ -177,6 +173,10 @@ section.ellipsis > main::after {
 section.type-Tombstone.ellipsis > main::after {
 	background: linear-gradient(0deg, var(--theme-note-fg) 5%, var(--theme-note-fg-trans) 100%);
 }
+
+section.collapsed > main {
+	max-height: 2em;
+}
 `;
 
 const colors = new ColorHash({ lightness: 0.8 });
@@ -185,6 +185,11 @@ export const Note = ({
 	smallHeader = false, collapsed = false, ellipsis = false, position,
 	onCollapse, onSelect, onSize,
 }) => {
+	ellipsis ||= collapsed;
+	attachment ||= [];
+	if (!Array.isArray(attachment))
+		attachment = [attachment];
+
 	const backgroundColor = attributedTo.color || colors.hex(attributedTo.id);
 
 	const onClick = onSelect && ((e) => {
@@ -197,10 +202,6 @@ export const Note = ({
 		onSize(id, root.current.offsetWidth, root.current.offsetHeight);
 	});
 
-	attachment ||= [];
-	if (!Array.isArray(attachment))
-		attachment = [attachment];
-
 	return (
 		<section
 			style={{