From c69e1ab653e6ab5e9a0f9f9fe5cb23d236994f67 Mon Sep 17 00:00:00 2001 From: s-ol Date: Fri, 12 Feb 2021 14:04:50 +0100 Subject: collapse using ellipsis, hide media --- src/ui/Note.js | 23 ++++++++++++----------- 1 file changed, 12 insertions(+), 11 deletions(-) (limited to 'src/ui') 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 (