reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: update chats to new ui

Browse Source
This commit is contained in:
Ren Amamiya
2023-08-03 14:09:12 +07:00
parent ae1e84655a
commit d10462cd4a
21 changed files with 335 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/shared/notes/kinds/repost.tsx
View File

@@ -17,7 +17,7 @@ export function Repost({ event }: { event: LumeEvent }) {
if (status === 'loading') {
return (
<div className="relative overflow-hidden rounded-xl border-t border-zinc-800/50 bg-zinc-900 px-3 pt-3">
<div className="relative overflow-hidden rounded-xl bg-white/10 px-3 py-3">
<NoteSkeleton />
</div>
);
@@ -25,7 +25,7 @@ export function Repost({ event }: { event: LumeEvent }) {
if (status === 'error') {
return (
<div className="flex items-center justify-center overflow-hidden rounded-xl border-t border-zinc-800/50 bg-zinc-900 px-3 py-3">
<div className="flex items-center justify-center overflow-hidden rounded-xl bg-white/10 px-3 py-3">
<p className="text-white/50">Failed to fetch</p>
</div>
);

4
src/shared/notes/kinds/sub.tsx
View File

@@ -8,7 +8,7 @@ export function SubNote({ id, root }: { id: string; root?: string }) {
if (status === 'loading') {
return (
<div className="relative mb-5 overflow-hidden rounded-xl bg-zinc-900 pt-3">
<div className="relative mb-5 overflow-hidden rounded-xl bg-white/10 py-3">
<NoteSkeleton />
</div>
);
@@ -16,7 +16,7 @@ export function SubNote({ id, root }: { id: string; root?: string }) {
if (status === 'error') {
return (
<div className="mb-5 flex overflow-hidden rounded-xl bg-zinc-800 px-3 py-3">
<div className="mb-5 flex overflow-hidden rounded-xl bg-white/10 px-3 py-3">
<p className="text-white/50">Failed to fetch</p>
</div>
);

6
src/shared/notes/kinds/unsupport.tsx
View File

@@ -13,11 +13,11 @@ export function NoteKindUnsupport({ event }: { event: LumeEvent }) {
<div className="w-11 shrink-0" />
<div className="flex-1">
<div className="mt-3 flex w-full flex-col gap-2">
<div className="inline-flex flex-col gap-1 rounded-md bg-zinc-800 px-2 py-2">
<span className="text-sm font-medium leading-none text-zinc-500">
<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">
Kind: {event.kind}
</span>
<p className="text-sm leading-none text-fuchsia-500">
<p className="text-sm leading-none text-white">
Lume isn&apos;t fully support this kind
</p>
</div>

2
src/shared/notes/preview/image.tsx
View File

@@ -22,7 +22,7 @@ export function ImagePreview({ urls, truncate }: { urls: string[]; truncate?: bo
alt="image"
className={`${
truncate ? 'h-auto max-h-[300px]' : 'h-auto'
} w-full rounded-lg border border-zinc-800/50 object-cover`}
} w-full rounded-lg border border-white/10 object-cover`}
/>
<button
type="button"

16
src/shared/notes/skeleton.tsx
View File

@@ -1,17 +1,15 @@
export function NoteSkeleton() {
return (
<div className="flex h-min flex-col pb-3">
<div className="flex h-min flex-col">
<div className="flex items-start gap-3">
<div className="relative h-11 w-11 shrink overflow-hidden rounded-lg bg-zinc-700" />
<div className="flex flex-col gap-0.5">
<div className="h-3 w-20 rounded bg-zinc-700" />
</div>
<div className="relative h-11 w-11 shrink overflow-hidden rounded-lg bg-white/10" />
<div className="h-3 w-20 rounded bg-white/10" />
</div>
<div className="-mt-5 animate-pulse pl-[49px]">
<div className="-mt-6 animate-pulse pl-[49px]">
<div className="flex flex-col gap-1">
<div className="h-3 w-full rounded bg-zinc-700" />
<div className="h-3 w-2/3 rounded bg-zinc-700" />
<div className="h-3 w-1/2 rounded bg-zinc-700" />
<div className="h-3 w-full rounded bg-white/10" />
<div className="h-3 w-2/3 rounded bg-white/10" />
<div className="h-3 w-1/2 rounded bg-white/10" />
</div>
</div>
</div>