From a39bda323adf7ac87df07c11858faf7b2ca96298 Mon Sep 17 00:00:00 2001
From: Alejandro Gomez <alejandro@strike.me>
Date: Mon, 16 Jan 2023 16:17:08 +0100
Subject: [PATCH] note ui improvements

---
 src/element/Invoice.css      | 3 ++-
 src/element/Note.css         | 2 +-
 src/element/NoteReaction.css | 2 +-
 src/element/Text.css         | 7 +++++++
 src/element/Text.tsx         | 2 +-
 5 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/element/Invoice.css b/src/element/Invoice.css
index 9651fa5b..04dbf0b1 100644
--- a/src/element/Invoice.css
+++ b/src/element/Invoice.css
@@ -2,7 +2,8 @@
     background: var(--bg-color);
     border-radius: 10px;
     border: 1px solid var(--gray-tertiary);
-    padding: 10px;
+    padding: 12px;
+    margin: 10px auto;
 }
 
 .note-invoice h2, .note-invoice h4, .note-invoice p {
diff --git a/src/element/Note.css b/src/element/Note.css
index e052cf1c..d894da48 100644
--- a/src/element/Note.css
+++ b/src/element/Note.css
@@ -17,7 +17,7 @@
 }
 
 .note > .header > .info {
-    font-size: small;
+    font-size: 10px;
     white-space: nowrap;
     color: var(--gray-light);
     align-self: flex-start;
diff --git a/src/element/NoteReaction.css b/src/element/NoteReaction.css
index 2876cb03..e1dbe593 100644
--- a/src/element/NoteReaction.css
+++ b/src/element/NoteReaction.css
@@ -19,7 +19,7 @@
 
 .reaction > .header > .info {
     color: var(--gray-light);
-    font-size: small;
+    font-size: 10px;
     align-self: flex-start;
 }
 
diff --git a/src/element/Text.css b/src/element/Text.css
index e58c07ce..6d3c7b8f 100644
--- a/src/element/Text.css
+++ b/src/element/Text.css
@@ -33,6 +33,13 @@
     margin: 0;
 }
 
+.text li {
+    margin-top: -1em;
+}
+.text li:last-child {
+    margin-bottom: -2em;
+}
+
 .text hr {
     border: 0;
     height: 1px;
diff --git a/src/element/Text.tsx b/src/element/Text.tsx
index 0f6339d1..d7bc1011 100644
--- a/src/element/Text.tsx
+++ b/src/element/Text.tsx
@@ -150,7 +150,7 @@ function transformLi({ body, tags, users }: TextFragment) {
 
 function transformParagraph({ body, tags, users }: TextFragment) {
     const fragments = transformText({ body, tags, users })
-    if (fragments.every(f => typeof f === 'string')) {
+    if (fragments.every(f => typeof f === 'string') && fragments.length > 1) {
         return <p>{fragments}</p>
     }
     return <>{fragments}</>