The weeb for the next gen discord boat - Wamellow
wamellow.com
bot
discord
acrylic colors
+336
-182
+2
-2
app/(home)/ai/page.tsx
+2
-2
app/(home)/ai/page.tsx
···
72
72
73
73
{models && <ImageGrid images={models.slice(0, 24).map((model) => ({ id: model.title, url: model.url || "/discord.webp" }))} />}
74
74
75
-
<div className="md:text-xl text-lg lg:flex w-full mt-4">
75
+
<div className="md:text-xl text-lg lg:flex w-full mt-4 gap-4">
76
76
<span className="font-medium">
77
77
Unlock complimentary access to a variety of free image generation models directly within your Discord server. Powered by LuxuryLabs.
78
78
</span>
···
140
140
width={512}
141
141
/>
142
142
<div className="absolute bottom-0 left-0 w-full">
143
-
<div className="bg-wamellow/80 backdrop-blur-md m-2 p-2 rounded-xl">
143
+
<div className="bg-wamellow backdrop-blur-md backdrop-brightness-50 m-2 p-2 rounded-xl">
144
144
<h3 className={styles.h3}>{item.title}</h3>
145
145
</div>
146
146
</div>
+2
-3
app/(home)/bot/pronouns/list.component.tsx
+2
-3
app/(home)/bot/pronouns/list.component.tsx
···
3
3
4
4
import Ad from "@/components/ad";
5
5
import { PronounsResponse } from "@/typings";
6
-
import cn from "@/utils/cn";
7
6
8
7
export default async function List({ res, type }: { res: PronounsResponse, type: string }) {
9
8
···
15
14
</div>
16
15
17
16
<div className="flex flex-col sm:flex-row w-full gap-4">
18
-
<div className="rounded-md overflow-hidden sm:w-1/2 lg:w-3/4" >
17
+
<div className="rounded-md overflow-hidden sm:w-1/2 lg:w-3/4 dark:bg-wamellow bg-wamellow-100 p-2 divide-y divide-wamellow" >
19
18
{res.content?.map((element, i) => (
20
-
<div key={element} className={cn("flex items-center justify-between py-2 px-3", i % 2 === 0 ? "dark:bg-wamellow bg-wamellow-100" : "dark:bg-wamellow/75 bg-wamellow-100/75")}>
19
+
<div key={element} className="flex items-center justify-between py-2 px-3" >
21
20
<span>{element}</span>
22
21
<span className="italic text-sm">{(i + 1).toString().padStart(2, "0")}</span>
23
22
</div>
+130
-86
app/(home)/page.tsx
+130
-86
app/(home)/page.tsx
···
1
-
import { Code } from "@nextui-org/react";
1
+
import { Chip, Code } from "@nextui-org/react";
2
2
import { Montserrat, Patrick_Hand } from "next/font/google";
3
3
import Image from "next/image";
4
4
import Link from "next/link";
5
5
import { BsDiscord, BsYoutube } from "react-icons/bs";
6
-
import { HiArrowRight, HiBadgeCheck, HiCash, HiChevronRight, HiFingerPrint, HiFire, HiInformationCircle, HiLockOpen, HiUserAdd } from "react-icons/hi";
6
+
import { HiArrowRight, HiCash, HiChevronRight, HiFire, HiInformationCircle, HiLockOpen, HiUserAdd } from "react-icons/hi";
7
7
8
-
import Badge from "@/components/badge";
9
8
import Box from "@/components/box";
10
9
import { StatsBar } from "@/components/counter";
11
10
import DiscordChannelCategory from "@/components/discord/channel-category";
···
50
49
const intl = new Intl.NumberFormat("en", { notation: "standard" });
51
50
52
51
const styles = {
53
-
h2: cn(montserrat.className, "lg:text-5xl text-4xl bg-gradient-to-b bg-clip-text text-transparent from-neutral-200 from-40% to-neutral-400 font-bold underline decoration-violet-400"),
52
+
h2: cn(montserrat.className, "lg:text-5xl text-4xl bg-gradient-to-b bg-clip-text text-transparent from-neutral-200 from-40% to-violet-300 font-bold underline decoration-violet-400"),
54
53
h3: cn(montserrat.className, "lg:text-2xl text-xl bg-gradient-to-b bg-clip-text text-transparent from-neutral-200 from-40% to-neutral-300 font-semibold")
55
54
};
56
55
···
112
111
/>
113
112
}
114
113
115
-
<div className="md:text-xl text-lg lg:flex w-full mt-4">
114
+
<div className="md:text-xl text-lg lg:flex w-full mt-4 gap-4">
116
115
<span className="font-medium">
117
116
Experience the next-gen revolution, offering a list of features and extensive customization, providing a superior alternative to popular bots.
118
117
</span>
···
165
164
166
165
<Box className="flex flex-col md:flex-row gap-10 items-center">
167
166
<div className="md:w-1/2">
168
-
<Badge
169
-
before={<HiCash />}
170
-
text="100% free forever"
171
-
classname="mr-auto ml-0 mb-4"
172
-
/>
167
+
<Chip
168
+
className="mb-2"
169
+
color="secondary"
170
+
variant="flat"
171
+
size="sm"
172
+
startContent={<HiCash className="mx-1" />}
173
+
>
174
+
<span className="font-semibold">100% free forever</span>
175
+
</Chip>
173
176
<h3 className={styles.h3}>/leaderboard & /rank</h3>
174
177
<div className="pt-6">
175
178
Enhance your server{"’"}s engagement with our text-, voice- and invite based leaderboards, tailored to track and reward your most active members.
···
179
182
<Invite />
180
183
<ServerButton
181
184
as={Link}
182
-
className="bg-wamellow-light"
185
+
className="bg-wamellow"
183
186
startContent={<HiArrowRight />}
184
187
href="/leaderboard/828676951023550495"
185
188
>
···
204
207
205
208
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
206
209
<div className="md:w-1/2">
207
-
<Badge
208
-
before={<HiCash />}
209
-
text="100% free forever"
210
-
classname="mr-auto ml-0 mb-4"
211
-
/>
210
+
<Chip
211
+
className="mb-2"
212
+
color="secondary"
213
+
variant="flat"
214
+
size="sm"
215
+
startContent={<HiCash className="mx-1" />}
216
+
>
217
+
<span className="font-semibold">100% free forever</span>
218
+
</Chip>
212
219
<h3 className={styles.h3}>40 Voices in 5 Languages</h3>
213
220
<div className="pt-6">
214
221
With Wamellow{"'"}s Text to Speech, you{"'"}re in control of transforming text into captivating speech.
215
-
You can either generate files using <Code>/tts file</Code>, talk in voice chats with <Code>/tts voice</Code> or setup a deticated channel!
222
+
You can either generate files using <Code color="secondary">/tts file</Code>, talk in voice chats with <Code color="secondary">/tts voice</Code> or setup a deticated channel!
216
223
</div>
217
224
<div className="flex gap-2 mt-6">
218
225
<Invite />
219
226
<ServerButton
220
227
as={Link}
221
-
className="bg-wamellow-light"
228
+
className="bg-wamellow"
222
229
startContent={<BsYoutube />}
223
230
href="https://youtu.be/NS5fZ1ltovE?si=I3nViYb4sx3n3Uvo"
224
231
target="_blank"
···
253
260
254
261
<Box className="flex flex-col md:flex-row gap-10 items-center">
255
262
<div className="md:w-1/2">
256
-
<Badge
257
-
before={<HiBadgeCheck />}
258
-
text="My lawyer said that title below"
259
-
classname="mr-auto ml-0 mb-4"
260
-
/>
263
+
<Chip
264
+
className="mb-2"
265
+
color="secondary"
266
+
variant="flat"
267
+
size="sm"
268
+
startContent={<HiCash className="mx-1" />}
269
+
>
270
+
<span className="font-semibold">My lawyer said that title below</span>
271
+
</Chip>
261
272
<h3 className={styles.h3}>POGBOARD DEEZ NUTS</h3>
262
273
<div className="pt-6">
263
274
With Starboards, you have the power to elevate remarkable messages within our server.
···
268
279
<Invite />
269
280
<ServerButton
270
281
as={Link}
271
-
className="bg-wamellow-light"
282
+
className="bg-wamellow"
272
283
startContent={<HiArrowRight />}
273
284
href="/dashboard?to=starboard"
274
285
>
···
311
322
312
323
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
313
324
<div className="md:w-1/2">
314
-
<Badge
315
-
before={<HiFingerPrint />}
316
-
text="Captcha verification included"
317
-
classname="mr-auto ml-0 mb-4"
318
-
/>
325
+
<Chip
326
+
className="mb-2"
327
+
color="secondary"
328
+
variant="flat"
329
+
size="sm"
330
+
startContent={<HiCash className="mx-1" />}
331
+
>
332
+
<span className="font-semibold">w/ free image background</span>
333
+
</Chip>
319
334
<h3 className={styles.h3}>Greetings</h3>
320
335
<div className="pt-6">
321
336
Give a warm welcome to new members, introducing them to rules, topics, and ongoing events.
···
326
341
<Invite />
327
342
<ServerButton
328
343
as={Link}
329
-
className="bg-wamellow-light"
344
+
className="bg-wamellow"
330
345
startContent={<HiArrowRight />}
331
346
href="/dashboard?to=greeting"
332
347
>
···
352
367
353
368
<Box className="flex flex-col md:flex-row gap-10 items-center">
354
369
<div className="md:w-1/2">
355
-
<Badge
356
-
before={<HiFingerPrint />}
357
-
text="Of course it's free"
358
-
classname="mr-auto ml-0 mb-4"
359
-
/>
370
+
<Chip
371
+
className="mb-2"
372
+
color="secondary"
373
+
variant="flat"
374
+
size="sm"
375
+
startContent={<HiCash className="mx-1" />}
376
+
>
377
+
<span className="font-semibold">Of course it{"'"}s free</span>
378
+
</Chip>
360
379
<h3 className={styles.h3}>Captcha verification</h3>
361
380
<div className="pt-6">
362
381
Protect your server from unwanted attacks such as bot-raids with our captcha verification system.
···
366
385
<Invite />
367
386
<ServerButton
368
387
as={Link}
369
-
className="bg-wamellow-light"
388
+
className="bg-wamellow"
370
389
startContent={<HiLockOpen />}
371
390
href="/passport/1125063180801036329"
372
391
>
···
374
393
</ServerButton>
375
394
<ServerButton
376
395
as={Link}
377
-
className="bg-wamellow-light"
396
+
className="bg-wamellow"
378
397
startContent={<HiArrowRight />}
379
398
href="/dashboard?to=greeting"
380
399
>
···
397
416
398
417
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
399
418
<div className="md:w-1/2">
400
-
<Badge
401
-
before={<HiCash />}
402
-
text="100% sexy forever"
403
-
classname="mr-auto ml-0 mb-4"
404
-
/>
419
+
<Chip
420
+
className="mb-2"
421
+
color="secondary"
422
+
variant="flat"
423
+
size="sm"
424
+
startContent={<HiCash className="mx-1" />}
425
+
>
426
+
<span className="font-semibold">100% sexy forever</span>
427
+
</Chip>
405
428
<h3 className={styles.h3}>/anime command</h3>
406
429
<div className="pt-6">
407
430
Unleash the magic of anime right within your Discord server with Wamellow{"'"}s 25+ categories.
···
409
432
Whether it{"'"}s sharing the cutest characters or discovering stunning artwork, bring the joy of anime directly to your community, making your server a hub for all things anime-related.
410
433
</div>
411
434
<div className="p-4 pb-3 border dark:border-wamellow-alpha border-wamellow-100 rounded-lg my-8">
412
-
<Badge
413
-
before={<HiFire />}
414
-
text="NSFW Supported"
415
-
classname="mr-auto ml-0 mb-2"
416
-
/>
417
-
<span className="text-base">
435
+
<Chip
436
+
className="mb-2"
437
+
color="secondary"
438
+
variant="flat"
439
+
size="sm"
440
+
startContent={<HiFire className="mx-1" />}
441
+
>
442
+
<span className="font-semibold">NSFW Supported</span>
443
+
</Chip>
444
+
<div className="text-base">
418
445
Find spicy nekos, waifus, and more in nsfw marked channels.
419
-
</span>
446
+
</div>
420
447
</div>
421
448
<div className="flex gap-2 mt-6">
422
449
<Invite />
···
448
475
449
476
<Box className="flex flex-col md:flex-row gap-10 items-center">
450
477
<div className="md:w-1/2">
451
-
<Badge
452
-
before={<HiCash />}
453
-
text="100% no money loss"
454
-
classname="mr-auto ml-0 mb-4"
455
-
/>
478
+
<Chip
479
+
className="mb-2"
480
+
color="secondary"
481
+
variant="flat"
482
+
size="sm"
483
+
startContent={<HiCash className="mx-1" />}
484
+
>
485
+
<span className="font-semibold">100% no money loss</span>
486
+
</Chip>
456
487
<h3 className={styles.h3}>/image command</h3>
457
488
<div className="pt-6">
458
489
Summon the enchantment of AI-generated images to your Discord server with our versatile /image command, featuring over 40 distinct custom models.
459
490
Elevate your server to a haven for unique and dynamic AI-generated images, ensuring a delightful experience for all enthusiasts of the digital arts.
460
491
</div>
461
492
<div className="p-4 pb-3 border dark:border-wamellow-alpha border-wamellow-100 rounded-lg my-8">
462
-
<Badge
463
-
before={<HiFire />}
464
-
text="NSFW Supported"
465
-
classname="mr-auto ml-0 mb-2"
466
-
/>
467
-
<span className="text-base">
493
+
<Chip
494
+
className="mb-2"
495
+
color="secondary"
496
+
variant="flat"
497
+
size="sm"
498
+
startContent={<HiFire className="mx-1" />}
499
+
>
500
+
<span className="font-semibold">NSFW Supported</span>
501
+
</Chip>
502
+
<div className="text-base">
468
503
Generate spicy images and more in nsfw marked channels.
469
-
</span>
504
+
</div>
470
505
</div>
471
506
<div className="flex gap-2 mt-6">
472
507
<Invite />
473
508
<ServerButton
474
509
as={Link}
475
-
className="bg-wamellow-light"
510
+
className="bg-wamellow"
476
511
startContent={<HiArrowRight />}
477
512
href="/ai"
478
513
>
···
506
541
507
542
<Box className="flex flex-col md:flex-row-reverse gap-10 items-center">
508
543
<div className="md:w-1/2">
509
-
<Badge
510
-
before={<HiCash />}
511
-
text="Free for 30 tags"
512
-
classname="mr-auto ml-0 mb-4"
513
-
/>
544
+
<Chip
545
+
className="mb-2"
546
+
color="secondary"
547
+
variant="flat"
548
+
size="sm"
549
+
startContent={<HiCash className="mx-1" />}
550
+
>
551
+
<span className="font-semibold">30 tags free</span>
552
+
</Chip>
514
553
<h3 className={styles.h3}>Wamellow tags</h3>
515
554
<div className="pt-6">
516
555
Easily handle frequently asked questions, common queries, and repetitive tasks in a snap.
···
521
560
<Invite />
522
561
<ServerButton
523
562
as={Link}
524
-
className="bg-wamellow-light"
563
+
className="bg-wamellow"
525
564
startContent={<HiArrowRight />}
526
565
href="/dashboard?to=custom-commands"
527
566
>
···
579
618
580
619
<Box none className="p-5 pb-3 dark:bg-wamellow bg-wamellow-100 rounded-lg mt-4 w-full">
581
620
<div className="flex">
582
-
<Badge
583
-
before={<HiFire />}
584
-
text="Popular Slash Commands"
585
-
classname="mr-auto ml-0 mb-2"
586
-
/>
621
+
<Chip
622
+
color="secondary"
623
+
variant="flat"
624
+
size="sm"
625
+
startContent={<HiFire className="ml-1" />}
626
+
>
627
+
<span className="font-semibold">Popular Slash Commands</span>
628
+
</Chip>
587
629
<div className="ml-auto flex items-center gap-1 opacity-80">
588
630
<span className="text-xs">Since 7th December</span>
589
631
<HiInformationCircle />
590
632
</div>
591
633
</div>
592
-
{Array.isArray(commands) && commands
593
-
.sort((a, b) => b.uses - a.uses)
594
-
.map((command, i) => (
595
-
<div key={command.name} className={cn("text-base py-4 flex flex-col md:flex-row gap-4 md:items-center", i + 1 !== 4 && "border-b border-wamellow-alpha")}>
596
-
<div className="-mb-2 md:mb-0 flex items-center h-min">
597
-
<span className="dark:text-neutral-100 text-neutral-900 text-xl font-semibold md:font-medium">/{command.name}</span>
598
-
<span className="ml-auto italic text-sm md:hidden opacity-80">{intl.format(command.uses)} uses</span>
634
+
<div className="divide-y divide-wamellow">
635
+
{Array.isArray(commands) && commands
636
+
.sort((a, b) => b.uses - a.uses)
637
+
.map((command) => (
638
+
<div key={command.name} className="text-base py-4 flex flex-col md:flex-row gap-4 md:items-center">
639
+
<div className="-mb-2 md:mb-0 flex items-center h-min">
640
+
<span className="dark:text-neutral-100 text-neutral-900 text-xl font-semibold md:font-medium">/{command.name}</span>
641
+
<span className="ml-auto italic text-sm md:hidden opacity-80">{intl.format(command.uses)} uses</span>
642
+
</div>
643
+
<span>{command.description}</span>
644
+
<span className="ml-auto italic text-sm hidden md:block">{intl.format(command.uses)} uses</span>
599
645
</div>
600
-
<span>{command.description}</span>
601
-
<span className="ml-auto italic text-sm hidden md:block">{intl.format(command.uses)} uses</span>
602
-
</div>
603
-
))
604
-
.slice(0, 4)
605
-
}
646
+
))
647
+
.slice(0, 4)
648
+
}
649
+
</div>
606
650
{(!commands || !Array.isArray(commands)) &&
607
651
<div className="flex flex-col items-center my-10">
608
652
<div className="text-3xl dark:text-neutral-100 text-neutral-900 font-semibold mb-4">Something went wrong...</div>
+23
-13
app/(home)/pro/page.tsx
+23
-13
app/(home)/pro/page.tsx
···
1
+
import { Button } from "@nextui-org/react";
1
2
import { Metadata } from "next";
2
3
import { Montserrat, Patrick_Hand } from "next/font/google";
3
4
import Link from "next/link";
···
53
54
54
55
const buttons = (
55
56
<>
56
-
<Link href="/login?invite=true" className="flex text-neutral-200 bg-neutral-600 hover:bg-neutral-600/80 py-2 px-4 rounded-md duration-200 justify-center gap-2 w-1/2">
57
-
<BsDiscord className="relative top-1" />
58
-
<span className="ml-2">Get started</span>
59
-
</Link>
60
-
<button className="flex text-neutral-200 bg-violet-600 hover:bg-violet-600/80 py-2 px-4 rounded-md duration-200 justify-center gap-2 w-1/2 opacity-30 cursor-not-allowed" disabled>
61
-
<HiLightningBolt className="relative top-1" />
62
-
<span className="ml-2">Subscribe</span>
63
-
</button>
57
+
<Button
58
+
as={Link}
59
+
className="w-1/2 font-medium"
60
+
href="/login?invite=true"
61
+
startContent={<BsDiscord />}
62
+
>
63
+
Get started
64
+
</Button>
65
+
<Button
66
+
as={Link}
67
+
color="secondary"
68
+
className="w-1/2 font-medium"
69
+
href="https://lunish.nl/kofi"
70
+
startContent={<HiLightningBolt />}
71
+
>
72
+
Subscribe
73
+
</Button>
64
74
</>
65
75
);
66
76
···
98
108
/>
99
109
}
100
110
101
-
<div className="dark:bg-wamellow bg-wamellow-100 dark:text-neutral-300 text-neutral-700 mt-10 w-full p-4 rounded-xl text-xl">
111
+
<div className="dark:bg-wamellow bg-wamellow-100 dark:text-neutral-300 text-neutral-700 mt-10 w-full p-4 rounded-xl text-xl divide-y divide-wamellow">
102
112
103
-
<div className="flex items-center py-4 border-b-2 dark:border-wamellow-light border-wamellow-100-light text-2xl font-semibold">
113
+
<div className="flex items-center py-4 text-2xl font-semibold">
104
114
<span className="dark:text-neutral-100 text-neutral-900 w-2/4 block md:hidden">Features</span>
105
115
<span className="dark:text-neutral-100 text-neutral-900 w-2/4 hidden md:block">Pricing and Features</span>
106
116
···
126
136
{ title: "Statistics & Analytics", free: false, pro: true },
127
137
{ title: "Sex with me*", free: false, pro: false }
128
138
].map((item) => (
129
-
<div key={item.title} className="flex items-center py-4 border-b-2 dark:border-wamellow-light border-wamellow-100-light">
139
+
<div key={item.title} className="flex items-center py-4">
130
140
<span className="md:text-base text-sm font-medium w-2/4 md:pr-0 pr-4">{item.title}</span>
131
141
<span className="dark:text-neutral-200 text-neutral-700 font-medium w-1/4">
132
142
{displayState(item.free)}
133
143
</span>
134
144
<span className="dark:text-neutral-200 text-neutral-700 font-medium w-1/4 flex">
135
145
{displayState(item.pro)}
136
-
{item.url && <Link href={item.url} target="_blank" rel="noopener noreferrer" className="ml-auto mr-3 hover:underline italic text-sm text-neutral-500 hidden md:block relative top-0.5">Take me there {"->"}</Link>}
146
+
{item.url && <Link href={item.url} target="_blank" className="ml-auto mr-3 hover:underline italic text-sm text-neutral-500 hidden md:block relative top-0.5">Take me there {"->"}</Link>}
137
147
</span>
138
148
</div>
139
149
))}
···
148
158
</div>
149
159
150
160
<div className="w-full flex">
151
-
<Link href="/support" target="_blank" rel="noopener noreferrer" className="ml-auto mt-1 dark:text-violet-400/60 text-violet-600/60 hover:text-violet-400/80 dark:hover:text-violet-600/80 hover:underline duration-200 text-sm">Restore previous purchases</Link>
161
+
<Link href="/support" target="_blank" className="ml-auto mt-1 dark:text-violet-400/60 text-violet-600/60 hover:text-violet-400/80 dark:hover:text-violet-600/80 hover:underline duration-200 text-sm">Restore previous purchases</Link>
152
162
</div>
153
163
154
164
<div className="w-full mt-6 md:flex gap-4 items-center">
+109
app/dashboard/[guildId]/miscellaneous/page.tsx
+109
app/dashboard/[guildId]/miscellaneous/page.tsx
···
1
+
"use client";
2
+
3
+
import { useParams } from "next/navigation";
4
+
import { useEffect, useState } from "react";
5
+
import { HiViewGridAdd } from "react-icons/hi";
6
+
7
+
import { guildStore } from "@/common/guilds";
8
+
import SelectMenu from "@/components/inputs/SelectMenu";
9
+
import Switch from "@/components/inputs/Switch";
10
+
import { ScreenMessage } from "@/components/screen-message";
11
+
import { ApiV1GuildsModulesEmbedmessagelinksGetResponse, RouteErrorResponse } from "@/typings";
12
+
13
+
export default function Home() {
14
+
const guild = guildStore((g) => g);
15
+
16
+
const [error, setError] = useState<string>();
17
+
const [eml, setEml] = useState<ApiV1GuildsModulesEmbedmessagelinksGetResponse>();
18
+
19
+
const params = useParams();
20
+
21
+
useEffect(() => {
22
+
23
+
fetch(`${process.env.NEXT_PUBLIC_API}/guilds/${params.guildId}/modules/embed-message-links`, {
24
+
headers: {
25
+
authorization: localStorage.getItem("token") as string
26
+
}
27
+
})
28
+
.then(async (res) => {
29
+
const response = await res.json() as ApiV1GuildsModulesEmbedmessagelinksGetResponse;
30
+
if (!response) return;
31
+
32
+
switch (res.status) {
33
+
case 200: {
34
+
setEml(response);
35
+
break;
36
+
}
37
+
default: {
38
+
setEml(undefined);
39
+
setError((response as unknown as RouteErrorResponse).message);
40
+
break;
41
+
}
42
+
}
43
+
44
+
})
45
+
.catch(() => {
46
+
setError("Error while fetching miscellaneous data");
47
+
});
48
+
49
+
}, []);
50
+
51
+
if (error) {
52
+
return <>
53
+
<ScreenMessage
54
+
title="Something went wrong.."
55
+
description={error}
56
+
href={`/dashboard/${guild?.id}`}
57
+
button="Go back to overview"
58
+
icon={<HiViewGridAdd />}
59
+
/>
60
+
</>;
61
+
}
62
+
63
+
if (!eml) return <></>;
64
+
65
+
return (
66
+
<div>
67
+
68
+
<Switch
69
+
name="Embed message links enabled."
70
+
url={`/guilds/${guild?.id}/modules/embed-message-links`}
71
+
dataName="enabled"
72
+
defaultState={eml?.enabled || false}
73
+
disabled={false}
74
+
onSave={(s) => {
75
+
eml.enabled = s;
76
+
setEml({ ...eml });
77
+
}}
78
+
/>
79
+
80
+
<div className="lg:flex gap-3">
81
+
<div className="lg:w-1/2">
82
+
<SelectMenu
83
+
name="Author Display Style"
84
+
url={`/guilds/${guild?.id}/modules/embed-message-links`}
85
+
dataName="display"
86
+
items={[
87
+
{
88
+
name: "Message Content",
89
+
value: 0
90
+
},
91
+
{
92
+
name: "Embed Author (top)",
93
+
value: 1
94
+
},
95
+
{
96
+
name: "Embed Footer (bottom)",
97
+
value: 2
98
+
}
99
+
]}
100
+
description="Where the original message author shoud be displayed."
101
+
defaultState={eml?.display}
102
+
disabled={!eml.enabled}
103
+
/>
104
+
</div>
105
+
</div>
106
+
107
+
</div>
108
+
);
109
+
}
+12
-4
app/globals.css
+12
-4
app/globals.css
···
8
8
}
9
9
10
10
.dark:root {
11
-
--background-rgb: rgb(13, 15, 17);
12
-
--wamellow-rgb: rgb(20, 22, 24);
11
+
--background-rgb: rgb(7, 5, 12);
12
+
--wamellow-rgb: rgba(255, 255, 255, 0.16);
13
13
}
14
14
15
15
html {
16
16
min-height: 100vh;
17
17
min-height: 100svh;
18
18
scroll-behavior: smooth;
19
+
background: var(--background-rgb) !important;
20
+
}
21
+
22
+
div[id="bg"] {
23
+
background-image: linear-gradient(175deg, rgb(33, 21, 63, 0.8) 0%, var(--background-rgb) 65%);
19
24
}
20
25
21
26
@keyframes ScaleBlink {
···
38
43
scrollbar-width: none;
39
44
}
40
45
46
+
::selection {
47
+
background-color: rgba(139, 92, 246, 0.6);
48
+
}
41
49
42
50
::-webkit-scrollbar {
43
51
width: 4px;
44
-
background: rgba(0, 0, 0, 0);
52
+
background: var(--background-rgb);
45
53
}
46
54
47
55
::-webkit-scrollbar-thumb {
48
-
background: rgb(139, 92, 246, 0.7);
56
+
background: rgba(139, 92, 246, 0.6);
49
57
border-radius: 2px;
50
58
}
51
59
+2
-1
app/layout.tsx
+2
-1
app/layout.tsx
···
82
82
children: React.ReactNode
83
83
}) {
84
84
return (
85
-
<html lang="en" className="dark flex justify-center min-h-screen max-w-screen overflow-x-hidden bg-[var(--background-rgb)]">
85
+
<html lang="en" className="dark flex justify-center min-h-screen max-w-screen overflow-x-hidden">
86
86
87
87
<Script defer data-domain="wamellow.com" src="https://analytics.wamellow.com/js/script.js" />
88
88
89
89
<body className={`${outfit.className} w-full max-w-7xl`}>
90
+
<div id="bg" className="absolute top-0 right-0 w-screen h-screen -z-10" />
90
91
91
92
<div className="absolute left-0 bg-gradient-to-r from-indigo-400 to-pink-400 h-8 w-full flex items-center justify-center text-white font-medium text-sm">
92
93
<div className="hidden md:block">
+3
-5
app/leaderboard/[guildId]/page.tsx
+3
-5
app/leaderboard/[guildId]/page.tsx
···
8
8
import VoiceIcon from "@/components/icons/voice";
9
9
import ImageReduceMotion from "@/components/image-reduce-motion";
10
10
import { AddButton, HomeButton, ScreenMessage, SupportButton } from "@/components/screen-message";
11
-
import RickPic from "@/public/rick.gif";
12
11
import SadWumpusPic from "@/public/sad-wumpus.gif";
13
-
import cn from "@/utils/cn";
14
12
15
13
import { getDesign, getGuild, getPagination, getTopMembers } from "./api";
16
14
import Pagination from "./pagination.component";
···
106
104
{members.sort((a, b) => (b.activity[searchParams.type] ?? 0) - (a.activity[searchParams.type] ?? 0)).map((member, i) =>
107
105
<div
108
106
key={"leaderboard-" + searchParams.type + member.id + i}
109
-
className={cn("mb-4 rounded-xl p-3 flex items-center", design?.backgroundColor ? "dark:bg-wamellow/60 bg-wamellow-100/60" : "dark:bg-wamellow bg-wamellow-100")}
107
+
className="mb-4 rounded-xl p-3 flex items-center dark:bg-wamellow bg-wamellow-100"
110
108
>
111
109
<ImageReduceMotion url={`https://cdn.discordapp.com/avatars/${member.id}/${member.avatar}`} size={128} alt={`${member.username}'s profile picture`} className="rounded-full h-12 w-12 mr-3" />
112
110
<div>
···
115
113
{member.id === "821472922140803112" &&
116
114
<Badge>Developer</Badge>
117
115
}
118
-
{member.id === "797012765352001557" &&
116
+
{/* {member.id === "797012765352001557" &&
119
117
<Badge>
120
118
<Image alt="" className="h-6 w-32 rounded-md" height={24} src={RickPic} width={128} />
121
119
</Badge>
122
-
}
120
+
} */}
123
121
</div>
124
122
<span className="text-sm dark:text-neutral-300 text-neutral-700">@{member.username}</span>
125
123
</div>
-2
app/passport/[guildId]/verify.component.tsx
-2
app/passport/[guildId]/verify.component.tsx
···
161
161
as={Link}
162
162
href="/support"
163
163
target="_blank"
164
-
variant="faded"
165
164
className="w-1/2"
166
165
startContent={<BsDiscord />}
167
166
>
···
171
170
as={Link}
172
171
href="/privacy"
173
172
target="_blank"
174
-
variant="faded"
175
173
className="w-1/2"
176
174
startContent={<HiLockClosed />}
177
175
>
+2
-2
app/profile/layout.tsx
+2
-2
app/profile/layout.tsx
···
69
69
</Skeleton>
70
70
71
71
{!user?.id ?
72
-
<div className="flex flex-col gap-1 mt-1.5">
72
+
<div className="flex flex-col mt-2">
73
73
<Skeleton className="rounded-xl w-32 h-5 mb-2" />
74
-
<Skeleton className="rounded-xl w-40 h-3.5" />
74
+
<Skeleton className="rounded-md w-24 h-7" />
75
75
</div>
76
76
:
77
77
<div className="flex flex-col gap-1">
+1
-2
components/ad.tsx
+1
-2
components/ad.tsx
+1
-1
components/box.tsx
+1
-1
components/box.tsx
+3
-4
components/counter.tsx
+3
-4
components/counter.tsx
···
5
5
import CountUp, { type CountUpProps } from "react-countup";
6
6
import { HiInformationCircle } from "react-icons/hi";
7
7
8
-
import cn from "@/utils/cn";
9
8
import Box from "./box";
10
9
11
10
export function ClientCountUp(props: Omit<CountUpProps, "duration">) {
···
61
60
return (
62
61
<Box
63
62
none
64
-
className="grid w-full rounded-md overflow-hidden"
63
+
className="grid w-full rounded-md overflow-hidden divide-x divide-wamellow"
65
64
style={{ gridTemplateColumns: `repeat(${width > 768 ? options.items.length : 2}, minmax(0, 1fr))` }}
66
65
>
67
-
{options.items.slice(0, width > 768 ? 10 : 2).map((item, i) => (
68
-
<div className={cn("p-5", i % 2 === 0 ? "dark:bg-wamellow bg-wamellow-100" : "dark:bg-wamellow/75 bg-wamellow-100/75")} key={"counter" + item.name + item.number.toString() + item.number.toString()}>
66
+
{options.items.slice(0, width > 768 ? 10 : 2).map((item) => (
67
+
<div className="p-5 dark:bg-wamellow bg-wamellow-100" key={"counter" + item.name + item.number.toString() + item.number.toString()}>
69
68
70
69
<div className="flex">
71
70
<div className="text-sm font-medium mb-1">{item.name}</div>
+5
-4
components/embed-creator.tsx
+5
-4
components/embed-creator.tsx
···
3
3
import { HiChevronDown, HiChevronUp } from "react-icons/hi";
4
4
5
5
import { GuildEmbed, RouteErrorResponse } from "@/typings";
6
+
import cn from "@/utils/cn";
6
7
7
8
import Highlight from "./discord/markdown";
8
9
import DiscordMessage from "./discord/message";
···
38
39
const [mode, setMode] = useState<"DARK" | "LIGHT">("DARK");
39
40
40
41
const modeToggle = (
41
-
<div className={`${mode === "DARK" ? "bg-wamellow-light" : "bg-wamellow-100-light"} flex gap-1 text-neutral-400 rounded-md overflow-hidden`}>
42
+
<div className={cn(mode === "DARK" ? "bg-wamellow-light" : "bg-wamellow-100-light", "flex gap-1 text-neutral-400 rounded-md overflow-hidden")}>
42
43
<button onClick={() => setMode("DARK")} className={`py-2 px-3 rounded-md ${mode === "DARK" ? "bg-wamellow" : "hover:bg-wamellow-100-alpha"}`}>
43
44
<BiMoon className="h-5 w-5" />
44
45
</button>
···
93
94
94
95
return (
95
96
<div>
96
-
<div className={`mt-8 mb-4 border-2 dark:border-wamellow border-wamellow-100 rounded-xl md:px-4 md:pb-4 px-2 pb-2 ${(error || state === "ERRORED") && "outline outline-red-500 outline-1"}`}>
97
-
<span className="relative bottom-4 text-lg dark:text-wamellow-light text-neutral-300 font-medium px-2" style={{ backgroundColor: "var(--background-rgb)" }}>{name}</span>
97
+
<div className={cn("mt-8 mb-4 border-2 dark:border-wamellow border-wamellow-100 rounded-xl md:px-4 md:pb-4 px-2 py-2", (error || state === "ERRORED") && "outline outline-red-500 outline-1")}>
98
+
<div className="text-lg py-2 dark:text-neutral-700 text-neutral-300 font-medium px-2">{name}</div>
98
99
99
100
{collapseable &&
100
-
<div className={`md:mx-2 mx-1 ${open ? "lg:mb-0 mb-2" : "mb-2"}`}>
101
+
<div className={cn("md:mx-2 mx-1", open ? "lg:mb-0 mb-2" : "mb-2")}>
101
102
<button
102
103
className="dark:bg-wamellow hover:dark:bg-wamellow-light bg-wamellow-100 hover:bg-wamellow-100-light duration-200 cursor-pointer rounded-md dark:text-neutral-400 text-neutral-600 flex items-center h-12 px-3 w-full"
103
104
onClick={() => setOpen(!open)}
+3
-3
components/header.tsx
+3
-3
components/header.tsx
···
141
141
}
142
142
}}
143
143
className="
144
-
relative top-2 sm:right-[268px] w-full sm:w-72 dark:bg-wamellow bg-wamellow-100 rounded-xl text-base overflow-hidden shadow-md
145
-
flex flex-col py-2 sm:py-1 p-2 sm:p-0
144
+
relative top-2 sm:right-[268px] w-full sm:w-72 dark:bg-wamellow bg-wamellow-100 rounded-xl backdrop-blur-2xl backdrop-brightness-75 overflow-hidden shadow-xl
145
+
flex flex-col py-2 sm:py-1 p-2 sm:p-0 text-base
146
146
[--y-closed:-16px] [--opacity-closed:0%] sm:[--scale-closed:90%]
147
147
[--y-open:0px] [--opacity-open:100%] sm:[--scale-open:100%]
148
148
"
···
182
182
key={"headerButton-" + button.name + button.url}
183
183
as={Link}
184
184
href={button.url}
185
-
className="w-full font-medium !justify-start !text-xl !my-1 sm:!text-medium sm:!my-0"
185
+
className="w-full font-medium !justify-start !text-xl !my-1 sm:!text-medium sm:!my-0 bg-transparent"
186
186
onClick={() => setMenu(false)}
187
187
startContent={button.icon}
188
188
>
+1
-1
components/image-grid.tsx
+1
-1
components/image-grid.tsx
···
15
15
return (
16
16
<div className="w-full h-52 overflow-hidden rounded-xl">
17
17
<div className="grid grid-flow-col grid-rows-3 w-full md:gap-4 gap-3 rotate-6 relative right-8 bottom-10 md:bottom-20">
18
-
{images.map((image, i) => (
18
+
{[...images, ...images, ...images, ...images].map((image, i) => (
19
19
<Container
20
20
key={"imageGrid-" + image.id + i}
21
21
className="relative md:h-32 h-24 md:w-32 w-24 hover:scale-110 duration-200"
+1
-1
components/inputs/Dumb_TextInput.tsx
+1
-1
components/inputs/Dumb_TextInput.tsx
···
21
21
22
22
const DumbTextInput: FunctionComponent<Props> = ({ name, placeholder, value, setValue, disabled, description, max = 256, thin, type, dataName }) => {
23
23
const className = cn(
24
-
"mt-1 resize-none w-full dark:bg-wamellow bg-wamellow-100 rounded-lg flex items-center px-4 py-2 focus:outline outline-violet-400 outline-2",
24
+
"mt-1 resize-y w-full dark:bg-wamellow bg-wamellow-100 rounded-lg flex items-center px-4 py-2 focus:outline outline-violet-400 caret-violet-400 outline-2",
25
25
max > 300 ? "h-28" : (thin ? "h-10" : "h-12"),
26
26
thin && "relative bottom-1",
27
27
disabled && "cursor-not-allowed opacity-50"
+1
-1
components/inputs/MultiSelectMenu.tsx
+1
-1
components/inputs/MultiSelectMenu.tsx
···
134
134
</button>
135
135
136
136
{open &&
137
-
<div className="absolute mt-2 w-full dark:bg-wamellow bg-wamellow-100 rounded-md max-h-40 overflow-y-scroll shadow-xl z-20">
137
+
<div className="absolute mt-2 w-full dark:bg-wamellow bg-wamellow-100 backdrop-blur-md backdrop-brightness-75 rounded-lg max-h-40 overflow-y-scroll shadow-xl z-20">
138
138
<div className="dark:bg-wamellow-alpha bg-wamellow-100-alpha">
139
139
{items.map((item) => (
140
140
<button
+1
-1
components/inputs/SelectMenu.tsx
+1
-1
components/inputs/SelectMenu.tsx
···
131
131
</button>
132
132
133
133
{open &&
134
-
<div className="absolute mt-2 w-full dark:bg-wamellow bg-wamellow-100 rounded-md max-h-40 overflow-y-scroll overflow-x-hidden shadow-xl z-20">
134
+
<div className="absolute mt-2 w-full dark:bg-wamellow bg-wamellow-100 backdrop-blur-md backdrop-brightness-75 rounded-lg max-h-40 overflow-y-scroll overflow-x-hidden shadow-xl z-20">
135
135
<div className="dark:bg-wamellow-alpha bg-wamellow-100-alpha">
136
136
{items.map((item) => (
137
137
<button
+22
-7
components/modal.tsx
+22
-7
components/modal.tsx
···
8
8
import { RouteErrorResponse } from "@/typings";
9
9
import cn from "@/utils/cn";
10
10
11
-
import ErrorBanner from "./Error";
11
+
import Notice, { NoticeType } from "./notice";
12
12
13
13
interface Props<T> {
14
14
className?: string;
···
26
26
buttonName?: string
27
27
}
28
28
29
-
export default function Modal<T>({ className, variant, title, children, subChildren, onSubmit, onClose, onSuccess, show, buttonName = "Submit" }: Props<T>) {
29
+
export default function Modal<T>({
30
+
className,
31
+
variant,
32
+
title,
33
+
children,
34
+
subChildren,
35
+
onSubmit,
36
+
onClose,
37
+
onSuccess,
38
+
show,
39
+
buttonName = "Submit"
40
+
}: Props<T>) {
30
41
31
42
const [state, setState] = useState<"LOADING" | undefined>(undefined);
32
43
const [error, setError] = useState<string | undefined>(undefined);
···
43
54
animate={show ? "open" : "closed"}
44
55
exit="closed"
45
56
variants={{ closed: { opacity: 0 }, open: { opacity: 1 } }}
46
-
className="fixed top-0 left-0 h-screen w-full inset-0 bg-black/70 flex items-center justify-center z-50"
47
-
style={{ backdropFilter: "blur(8px)", WebkitBackdropFilter: "blur(8px)" }}
57
+
className="fixed top-0 left-0 h-screen w-full inset-0 bg-black/90 flex items-center justify-center z-50"
48
58
>
49
59
<motion.div
50
60
initial="closed"
···
64
74
}}
65
75
className="
66
76
md:relative fixed bottom-0 min-h-[333px] md:min-h-fit m-2
67
-
w-full md:w-[480px] bg-[var(--background-rgb)] rounded-xl shadow-md
77
+
w-full md:w-[480px] backdrop-blur-xl backdrop-brightness-10 rounded-xl shadow-md
68
78
max-sm:[--y-closed:16px] [--opacity-closed:0%] sm:[--scale-closed:90%]
69
79
max-sm:[--y-open:0px] [--opacity-open:100%] sm:[--scale-open:100%]
70
80
"
···
99
109
/>
100
110
101
111
<div className={"scrollbar-none p-0.5 pb-4 sm:max-h-[512px] max-h-[384px] overflow-y-scroll " + className}> {/* sm:max-h-[512px] max-h-[384px] overflow-y-scroll */}
102
-
{error && <ErrorBanner message={error} removeButton={true} />}
112
+
{error &&
113
+
<Notice
114
+
type={NoticeType.Error}
115
+
message={error}
116
+
/>
117
+
}
103
118
104
119
{children}
105
120
</div>
106
121
107
122
</div>
108
123
109
-
<div className="md:relative absolute bottom-0 left-0 w-full dark:bg-wamellow/40 bg-wamellow-100/40 rounded-bl-md rounded-br-md">
124
+
<div className="md:relative absolute bottom-0 left-0 w-full dark:bg-wamellow bg-wamellow-100 rounded-bl-md rounded-br-md">
110
125
<div className="flex items-center w-full gap-4 p-4">
111
126
112
127
{subChildren}
+12
-39
tailwind.config.js
+12
-39
tailwind.config.js
···
1
1
import { nextui } from "@nextui-org/react";
2
2
3
+
const wamellow = "rgba(255, 255, 255, 0.05)";
4
+
const violet = "rgb(139 92 246)";
5
+
3
6
/** @type {import('tailwindcss').Config} */
4
7
const config = {
5
8
content: [
···
10
13
theme: {
11
14
extend: {
12
15
colors: {
13
-
"wamellow": "rgb(20, 22, 24)",
16
+
"wamellow": wamellow,
14
17
"wamellow-light": "rgb(30, 32, 34)",
15
18
"wamellow-alpha": "rgba(255, 255, 255, 0.06)",
16
-
17
19
18
20
"wamellow-100": "#e2e8f0",
19
21
"wamellow-100-light": "#ced3da",
···
31
33
"wamellow-900-alpha": "rgba(0, 0, 0, 0.54)",
32
34
33
35
"blurple": "#5865f2",
34
-
"blurple-dark": "#454fbf",
35
-
36
-
"danger": "rgb(250, 100, 102, 0.8)",
37
-
"danger-dark": "rgb(250, 100, 102, 0.4)"
36
+
"blurple-dark": "#454fbf"
38
37
},
39
38
width: {
40
39
"128": "32rem",
···
42
41
},
43
42
fontSize: {
44
43
"xxs": "0.6rem"
45
-
},
46
-
animation: {
47
-
marquee: "marquee 35s linear infinite",
48
-
marquee2: "marquee2 35s linear infinite",
49
-
50
-
"marquee-reverse": "marquee-reverse 35s linear infinite",
51
-
"marquee-reverse2": "marquee-reverse2 35s linear infinite"
52
-
},
53
-
keyframes: {
54
-
marquee: {
55
-
"0%": { transform: "translateX(0%)" },
56
-
"100%": { transform: "translateX(-100%)" }
57
-
},
58
-
marquee2: {
59
-
"0%": { transform: "translateX(100%)" },
60
-
"100%": { transform: "translateX(0%)" }
61
-
},
62
-
63
-
"marquee-reverse": {
64
-
"100%": { transform: "translateX(0%)" },
65
-
"0%": { transform: "translateX(-100%)" }
66
-
},
67
-
"marquee-reverse2": {
68
-
"100%": { transform: "translateX(100%)" },
69
-
"0%": { transform: "translateX(0%)" }
70
-
}
71
44
}
72
45
}
73
46
},
···
90
63
colors: {
91
64
secondary: {
92
65
foreground: "rgb(255 255 255)",
93
-
DEFAULT: "rgb(139 92 246)",
94
-
divider: "rgb(22, 24, 26)",
95
-
focus: "rgb(139 92 246)"
66
+
DEFAULT: violet,
67
+
divider: wamellow,
68
+
focus: violet
96
69
},
97
70
default: {
98
71
foreground: "rgb(212 212 212)",
99
-
DEFAULT: "rgb(22, 24, 26)",
100
-
divider: "rgb(22, 24, 26)",
101
-
focus: "rgb(139 92 246)"
72
+
DEFAULT: wamellow,
73
+
divider: wamellow,
74
+
focus: violet
102
75
}
103
76
}
104
77
},
···
107
80
colors: {
108
81
default: {
109
82
foreground: "rgb(255 255 255)",
110
-
DEFAULT: "rgb(139 92 246)"
83
+
DEFAULT: violet
111
84
}
112
85
}
113
86
}