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

wip: cross platform ui

Browse Source
This commit is contained in:
Ren Amamiya
2023-08-28 16:00:11 +07:00
parent 5a3207f878
commit c89e7e48ee
86 changed files with 376 additions and 416 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/shared/composer/composer.tsx
View File

@@ -130,7 +130,7 @@ export function Composer() {
<div className="flex h-full flex-col px-4 pb-4">
<div className="flex h-full w-full gap-3">
<div className="flex w-8 shrink-0 items-center justify-center">
<div className="h-full w-[2px] bg-white/10" />
<div className="h-full w-[2px] bg-white/10 backdrop-blur-xl" />
</div>
<div className="w-full">
<EditorContent
@@ -146,7 +146,7 @@ export function Composer() {
<button
type="button"
onClick={() => clearReply()}
className="absolute right-3 top-3 inline-flex h-6 w-6 items-center justify-center rounded bg-white/10 px-2"
className="absolute right-3 top-3 inline-flex h-6 w-6 items-center justify-center rounded bg-white/10 px-2 backdrop-blur-xl"
>
<CancelIcon className="h-4 w-4 text-white" />
</button>
@@ -158,7 +158,7 @@ export function Composer() {
<button
type="button"
onClick={() => uploadImage()}
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-white/10"
className="inline-flex h-8 w-8 items-center justify-center rounded-md backdrop-blur-xl hover:bg-white/10"
>
<PlusCircleIcon className="h-5 w-5 text-white/50" />
</button>

10
src/shared/composer/modal.tsx
View File

@@ -21,30 +21,30 @@ export function ComposerModal() {
<Dialog.Trigger asChild>
<button
type="button"
className="inline-flex h-9 w-max items-center justify-center gap-2 rounded-md bg-white/10 px-4 text-sm font-medium text-white hover:bg-fuchsia-500 focus:outline-none active:translate-y-1"
className="inline-flex h-10 w-full items-center justify-center gap-1.5 rounded-lg bg-white/20 from-fuchsia-200 via-red-200 to-orange-300 px-4 font-medium text-white hover:bg-fuchsia-500 hover:bg-gradient-to-r hover:text-black focus:outline-none active:translate-y-1"
>
<ComposeIcon className="h-4 w-4" />
<ComposeIcon className="h-5 w-5" />
Postr
</button>
</Dialog.Trigger>
<Dialog.Portal className="relative z-10">
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/80 backdrop-blur-xl" />
<Dialog.Content className="fixed inset-0 z-50 flex min-h-full items-center justify-center">
<div className="relative h-min w-full max-w-2xl rounded-xl bg-white/10">
<div className="relative h-min w-full max-w-2xl rounded-xl bg-white/10 backdrop-blur-xl">
<div className="flex items-center justify-between px-4 py-4">
<div className="flex items-center gap-2">
<ComposerUser pubkey={db.account.pubkey} />
<span>
<ChevronRightIcon className="h-4 w-4 text-white/50" />
</span>
<div className="inline-flex h-7 w-max items-center justify-center gap-0.5 rounded bg-white/10 pl-3 pr-1.5 text-sm font-medium text-white">
<div className="inline-flex h-7 w-max items-center justify-center gap-0.5 rounded bg-white/10 pl-3 pr-1.5 text-sm font-medium text-white backdrop-blur-xl">
New Post
<ChevronDownIcon className="h-4 w-4" />
</div>
</div>
<Dialog.Close
onClick={() => toggle(false)}
className="inline-flex h-8 w-8 items-center justify-center rounded-md hover:bg-white/10"
className="inline-flex h-8 w-8 items-center justify-center rounded-md backdrop-blur-xl hover:bg-white/10"
>
<CancelIcon className="h-5 w-5 text-white/50" />
</Dialog.Close>