fix z-index issue

lumehq · Aug 13, 2023 · 4a0f2c9 · 4a0f2c9
1 parent 9e5f15e
commit 4a0f2c9
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 14 deletions.
diff --git a/src/shared/notes/kinds/kind1.tsx b/src/shared/notes/kinds/kind1.tsx
@@ -20,9 +20,9 @@ export function NoteKind_1({
       <div className="relative overflow-hidden rounded-xl bg-white/10 px-3 pt-3">
         <div className="relative flex flex-col">
           <User pubkey={event.pubkey} time={event.created_at} />
-          <div className="relative z-20 -mt-6 flex items-start gap-3">
+          <div className="-mt-6 flex items-start gap-3">
             <div className="w-11 shrink-0" />
-            <div className="flex-1">
+            <div className="relative z-20 flex-1">
               <NoteContent content={content} />
               <NoteActions id={event.event_id || event.id} pubkey={event.pubkey} />
             </div>

diff --git a/src/shared/notes/kinds/kind1063.tsx b/src/shared/notes/kinds/kind1063.tsx
@@ -16,9 +16,9 @@ export function NoteKind_1063({ event }: { event: LumeEvent }) {
       <div className="relative overflow-hidden rounded-xl bg-white/10 px-3 pt-3">
         <div className="flex flex-col">
           <User pubkey={event.pubkey} time={event.created_at} />
-          <div className="relative z-20 -mt-6 flex items-start gap-3">
+          <div className="-mt-6 flex items-start gap-3">
             <div className="w-11 shrink-0" />
-            <div className="flex-1">
+            <div className="relative z-20 flex-1">
               {isImage(url) && (
                 <Image
                   src={url}

diff --git a/src/shared/notes/kinds/repost.tsx b/src/shared/notes/kinds/repost.tsx
@@ -35,13 +35,13 @@ export function Repost({ event }: { event: LumeEvent }) {
     <div className="h-min w-full px-3 py-1.5">
       <div className="relative overflow-hidden rounded-xl bg-white/10 px-3 pt-3">
         <div className="relative flex flex-col">
-          <div className="isolate flex flex-col -space-y-4 overflow-hidden">
+          <div className="isolate flex flex-col -space-y-4">
             <RepostUser pubkey={event.pubkey} />
             <User pubkey={data.pubkey} time={data.created_at} isRepost={true} />
           </div>
-          <div className="relative z-20 flex items-start gap-3">
+          <div className="flex items-start gap-3">
             <div className="w-11 shrink-0" />
-            <div className="flex-1">
+            <div className="relative z-20 flex-1">
               <NoteContent content={data.content} />
               <NoteActions id={repostID} pubkey={data.pubkey} />
             </div>

diff --git a/src/shared/notes/kinds/sub.tsx b/src/shared/notes/kinds/sub.tsx
@@ -27,9 +27,9 @@ export function SubNote({ id, root }: { id: string; root?: string }) {
       <div className="absolute bottom-0 left-[18px] h-[calc(100%-3.4rem)] w-0.5 bg-gradient-to-t from-white/20 to-white/10" />
       <div className="mb-5 flex flex-col">
         <User pubkey={data.pubkey} time={data.created_at} />
-        <div className="relative z-20 -mt-6 flex items-start gap-3">
+        <div className="-mt-6 flex items-start gap-3">
           <div className="w-11 shrink-0" />
-          <div className="flex-1">
+          <div className="relative z-20 flex-1">
             <NoteContent content={data.content} long={data.kind === 30023} />
             <NoteActions id={data.event_id} pubkey={data.pubkey} root={root} />
           </div>

diff --git a/src/shared/notes/kinds/thread.tsx b/src/shared/notes/kinds/thread.tsx
@@ -24,9 +24,9 @@ export function NoteThread({
         <div className="relative">{reply && <SubNote id={reply} root={root} />}</div>
         <div className="relative flex flex-col">
           <User pubkey={event.pubkey} time={event.created_at} />
-          <div className="relative z-20 -mt-6 flex items-start gap-3">
+          <div className="-mt-6 flex items-start gap-3">
             <div className="w-11 shrink-0" />
-            <div className="flex-1">
+            <div className="relative z-20 flex-1">
               <NoteContent content={content} />
               <NoteActions id={event.event_id} pubkey={event.pubkey} />
             </div>

diff --git a/src/shared/notes/kinds/unsupport.tsx b/src/shared/notes/kinds/unsupport.tsx
@@ -9,9 +9,9 @@ export function NoteKindUnsupport({ event }: { event: LumeEvent }) {
       <div className="relative overflow-hidden rounded-xl bg-white/10 px-3 pt-3">
         <div className="flex flex-col">
           <User pubkey={event.pubkey} time={event.created_at} />
-          <div className="relative z-20 -mt-6 flex items-start gap-3">
+          <div className="-mt-6 flex items-start gap-3">
             <div className="w-11 shrink-0" />
-            <div className="flex-1">
+            <div className="relative z-20 flex-1">
               <div className="mt-3 flex w-full flex-col gap-2">
                 <div className="inline-flex flex-col gap-1 rounded-md bg-white/10 px-2 py-2">
                   <span className="text-sm font-medium leading-none text-white/50">

diff --git a/src/shared/notes/users/repost.tsx b/src/shared/notes/users/repost.tsx
@@ -18,7 +18,7 @@ export function RepostUser({ pubkey }: { pubkey: string }) {
         src={user?.picture || user?.image || DEFAULT_AVATAR}
         fallback={DEFAULT_AVATAR}
         alt={pubkey}
-        className="relative z-20 inline-block h-6 w-6 rounded bg-white ring-1 ring-zinc-800"
+        className="relative z-20 inline-block h-6 w-6 rounded bg-white ring-1 ring-black"
       />
       <div className="inline-flex items-baseline gap-1">
         <h5 className="max-w-[18rem] truncate text-white/50">