fix: tags alignment

src/element/tags.tsx

@@ -1,13 +1,21 @@
+import type { ReactNode } from "react";
 import moment from "moment";
 import { TaggedRawEvent } from "@snort/system";
 import { StreamState } from "index";
 import { findTag } from "utils";
 
-export function Tags({ ev }: { ev: TaggedRawEvent }) {
+export function Tags({
+  children,
+  ev,
+}: {
+  children?: ReactNode;
+  ev: TaggedRawEvent;
+}) {
   const status = findTag(ev, "status");
   const start = findTag(ev, "starts");
   return (
     <div className="tags">
+      {children}
       {status === StreamState.Planned && (
         <span className="pill">
           {status === StreamState.Planned ? "Starts " : ""}

src/pages/stream-page.tsx

@@ -46,8 +46,11 @@ function ProfileInfo({ link }: { link: NostrLink }) {
         <div className="f-grow stream-info">
           <h1>{findTag(thisEvent.data, "title")}</h1>
           <p>{findTag(thisEvent.data, "summary")}</p>
+          {thisEvent?.data && (
+            <Tags ev={thisEvent.data}>
               <StatePill state={status as StreamState} />
-          {thisEvent?.data && <Tags ev={thisEvent.data} />}
+            </Tags>
+          )}
           {isMine && (
             <div className="actions">
               {thisEvent.data && (