xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

update setting sidebar icons

This commit is contained in:
Yee Jia Wei 2023-12-17 17:18:31 +08:00
parent e2cf627ccd
commit dc6c17f8c4
1 changed files with 31 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
components/SettingsSidebar.tsx
View File

@ -1,15 +1,8 @@
import useCollectionStore from "@/store/collections"; import useCollectionStore from "@/store/collections";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
faUser,
faPalette,
faBoxArchive,
faKey,
faLock,
} from "@fortawesome/free-solid-svg-icons";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { import {
faCircleQuestion, faCircleQuestion,
faCreditCard, faCreditCard,
@ -48,7 +41,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon icon={faUser} className="w-7 h-7 text-primary" /> <i
className="bi-person text-primary text-2xl"
></i>
<p className="truncate w-full pr-7">Account</p> <p className="truncate w-full pr-7">Account</p>
</div> </div>
@ -62,10 +57,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faPalette} className="bi-palette text-primary text-2xl"
className="w-7 h-7 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Appearance</p> <p className="truncate w-full pr-7">Appearance</p>
</div> </div>
@ -79,11 +73,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faBoxArchive} className="bi-archive text-primary text-2xl"
className="w-7 h-7 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Archive</p> <p className="truncate w-full pr-7">Archive</p>
</div> </div>
</Link> </Link>
@ -96,8 +88,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon icon={faKey} className="w-7 h-7 text-primary" /> <i
className="bi-key text-primary text-2xl"
></i>
<p className="truncate w-full pr-7">API Keys</p> <p className="truncate w-full pr-7">API Keys</p>
</div> </div>
</Link> </Link>
@ -110,8 +103,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon icon={faLock} className="w-7 h-7 text-primary" /> <i
className="bi-lock text-primary text-2xl"
></i>
<p className="truncate w-full pr-7">Password</p> <p className="truncate w-full pr-7">Password</p>
</div> </div>
</Link> </Link>
@ -125,11 +119,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
: "hover:bg-neutral/20" : "hover:bg-neutral/20"
} duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-5 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faCreditCard} className="bi-credit-card text-primary text-xl"
className="w-7 h-7 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Billing</p> <p className="truncate w-full pr-7">Billing</p>
</div> </div>
</Link> </Link>
@ -148,10 +140,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
<div <div
className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faCircleQuestion as any} className="bi-question-circle text-primary text-xl"
className="w-6 h-6 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Help</p> <p className="truncate w-full pr-7">Help</p>
</div> </div>
@ -161,11 +152,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
<div <div
className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faGithub as any} className="bi-github text-primary text-xl"
className="w-6 h-6 text-primary" ></i>
/>
<p className="truncate w-full pr-7">GitHub</p> <p className="truncate w-full pr-7">GitHub</p>
</div> </div>
</Link> </Link>
@ -174,11 +163,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
<div <div
className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faXTwitter as any} className="bi-twitter-x text-primary text-xl"
className="w-6 h-6 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Twitter</p> <p className="truncate w-full pr-7">Twitter</p>
</div> </div>
</Link> </Link>
@ -187,11 +174,9 @@ export default function SettingsSidebar({ className }: { className?: string }) {
<div <div
className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} className={`hover:bg-neutral/20 duration-100 py-2 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <i
icon={faMastodon as any} className="bi-mastodon text-primary text-xl"
className="w-6 h-6 text-primary" ></i>
/>
<p className="truncate w-full pr-7">Mastodon</p> <p className="truncate w-full pr-7">Mastodon</p>
</div> </div>
</Link> </Link>