min-height for quote & spinner

packages/app/src/Element/Event/Note.css

@@ -1,10 +1,3 @@
-.note {
-  min-height: 110px;
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
 .note > .header .reply {
   font-size: 13px;
   color: var(--font-secondary-color);

packages/app/src/Element/Event/NoteInner.tsx

@@ -33,7 +33,7 @@ const TEXT_TRUNCATE_LENGTH = 400;
 export function NoteInner(props: NoteProps) {
   const { data: ev, related, highlight, options: opt, ignoreModeration = false, className } = props;
 
-  const baseClassName = classNames("note card", className);
+  const baseClassName = classNames("note min-h-[110px] flex flex-col gap-4 card", className);
   const navigate = useNavigate();
   const [showReactions, setShowReactions] = useState(false);
 

packages/app/src/Element/Event/NoteQuote.tsx

@@ -6,7 +6,12 @@ import PageSpinner from "@/Element/PageSpinner";
 
 export default function NoteQuote({ link, depth }: { link: NostrLink; depth?: number }) {
   const ev = useEventFeed(link);
-  if (!ev.data) return <PageSpinner />;
+  if (!ev.data)
+    return (
+      <div className="note-quote flex items-center justify-center h-[110px]">
+        <PageSpinner />
+      </div>
+    );
   return (
     <Note
       data={ev.data}

packages/app/src/index.css

@@ -210,7 +210,6 @@ a.ext {
 .card .card {
   border: 1px solid var(--border-color);
   border-radius: 16px;
-  min-height: 0;
 }
 
 .card .header {