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

update widgets

Browse Source
This commit is contained in:
Ren Amamiya
2023-09-06 08:58:02 +07:00
parent 45c5a890b9
commit 09aea3cff5
5 changed files with 38 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/auth/onboarding/step-3.tsx
View File

@@ -118,10 +118,11 @@ export function OnboardStep3Screen() {
<LoaderIcon className="h-4 w-4 animate-spin text-white" />
</div>
) : relaysAsArray.length === 0 ? (
<div className="flex h-full w-full items-center justify-center">
<div className="flex h-full w-full items-center justify-center px-6">
<p className="text-center text-white/50">
Can&apos;t found any relays, you can skip this step and use default relays
instead
Lume couldn&apos;t find any relays from your follows.
<br />
You can skip this step and use default relays instead.
</p>
</div>
) : (
@@ -145,7 +146,7 @@ export function OnboardStep3Screen() {
))
)}
{relays.size > 5 && (
<div className="sticky bottom-0 left-0 inline-flex w-full items-center justify-center bg-white/10 px-4 py-2 backdrop-blur-2xl backdrop-blur-xl">
<div className="sticky bottom-0 left-0 inline-flex w-full items-center justify-center bg-white/10 px-4 py-2 backdrop-blur-2xl">
<p className="text-sm text-orange-400">
Using too much relay can cause high resource usage
</p>

25
src/app/space/components/widgetList.tsx
View File

@@ -25,11 +25,12 @@ export function WidgetList({ params }: { params: Widget }) {
return (
<div className="flex flex-col gap-3">
<h3 className="font-medium text-white/50">{row.title}</h3>
<div className="grid grid-cols-3 gap-6">
<div className="flex flex-col divide-y divide-white/5 overflow-hidden rounded-xl bg-white/10">
{row.data.map((item, index) => (
<button onClick={() => openWidget(item)} key={index}>
<div className="inline-flex aspect-square h-full w-full transform-gpu flex-col items-center justify-center gap-2.5 rounded-2xl bg-white/5 hover:bg-white/10">
<h5 className="text-sm font-medium">{item.title}</h5>
<div className="inline-flex h-14 w-full flex-col items-start justify-center gap-1 px-4 hover:bg-white/10">
<h5 className="font-medium leading-none">{item.title}</h5>
<p className="text-xs leading-none text-white/50">{item.description}</p>
</div>
</button>
))}
@@ -41,11 +42,27 @@ export function WidgetList({ params }: { params: Widget }) {
);
return (
<div className="relative h-full shrink-0 grow-0 basis-[400px] overflow-hidden">
<div className="relative h-full shrink-0 grow-0 basis-[400px] overflow-hidden bg-white/10">
<TitleBar id={params.id} title="Add widget" />
<div className="flex flex-col gap-8 px-3">
{DefaultWidgets.map((row: WidgetGroup) => renderItem(row))}
</div>
<div className="mt-6 px-3">
<div className="border-t border-white/5 pt-6">
<button
type="button"
disabled
className="inline-flex h-14 w-full items-center justify-center gap-2.5 rounded-xl bg-white/5 text-sm font-medium text-white/50"
>
Build your own widget{' '}
<div className="-rotate-3 transform rounded-md bg-white/10 px-1.5 py-1">
<span className="bg-gradient-to-t from-fuchsia-200 via-red-200 to-orange-300 bg-clip-text text-xs text-transparent">
Coming soon
</span>
</div>
</button>
</div>
</div>
</div>
);
}