swapped some gray colors with neutral

This commit is contained in:
daniel31x13 2023-11-25 05:39:56 -05:00
parent 3c9d171f4d
commit d53dd93bb7
32 changed files with 81 additions and 105 deletions

View File

@ -59,7 +59,7 @@ export default function CollectionCard({ collection, className }: Props) {
<FontAwesomeIcon <FontAwesomeIcon
icon={faEllipsis} icon={faEllipsis}
id={"expand-dropdown" + collection.id} id={"expand-dropdown" + collection.id}
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
<Link <Link
@ -95,16 +95,16 @@ export default function CollectionCard({ collection, className }: Props) {
<FontAwesomeIcon <FontAwesomeIcon
icon={faGlobe} icon={faGlobe}
title="This collection is being shared publicly." title="This collection is being shared publicly."
className="w-4 h-4 drop-shadow text-gray-500 dark:text-gray-300" className="w-4 h-4 drop-shadow text-neutral"
/> />
) : undefined} ) : undefined}
<FontAwesomeIcon <FontAwesomeIcon
icon={faLink} icon={faLink}
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
{collection._count && collection._count.links} {collection._count && collection._count.links}
</div> </div>
<div className="flex items-center justify-end gap-1 text-gray-500 dark:text-gray-300"> <div className="flex items-center justify-end gap-1 text-neutral">
<FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" /> <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
<p className="font-bold text-xs">{formattedDate}</p> <p className="font-bold text-xs">{formattedDate}</p>
</div> </div>

View File

@ -14,9 +14,7 @@ export default function dashboardItem({ name, value, icon }: Props) {
<FontAwesomeIcon icon={icon} className="w-8 h-8 text-primary" /> <FontAwesomeIcon icon={icon} className="w-8 h-8 text-primary" />
</div> </div>
<div className="flex flex-col justify-center"> <div className="flex flex-col justify-center">
<p className="text-gray-500 dark:text-gray-400 text-sm tracking-wider"> <p className="text-neutral text-sm tracking-wider">{name}</p>
{name}
</p>
<p className="font-thin text-6xl text-primary mt-2">{value}</p> <p className="font-thin text-6xl text-primary mt-2">{value}</p>
</div> </div>
</div> </div>

View File

@ -185,9 +185,7 @@ export default function LinkCard({ link, count, className }: Props) {
<div className="flex justify-between gap-5 w-full h-full z-0"> <div className="flex justify-between gap-5 w-full h-full z-0">
<div className="flex flex-col justify-between w-full"> <div className="flex flex-col justify-between w-full">
<div className="flex items-baseline gap-1"> <div className="flex items-baseline gap-1">
<p className="text-sm text-gray-500 dark:text-gray-300"> <p className="text-sm text-neutral">{count + 1}</p>
{count + 1}
</p>
<p className="text-lg truncate capitalize w-full pr-8"> <p className="text-lg truncate capitalize w-full pr-8">
{unescapeString(link.name || link.description)} {unescapeString(link.name || link.description)}
</p> </p>
@ -233,12 +231,12 @@ export default function LinkCard({ link, count, className }: Props) {
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
}} }}
className="flex items-center gap-1 max-w-full w-fit text-gray-500 dark:text-gray-300 hover:opacity-70 duration-100" className="flex items-center gap-1 max-w-full w-fit text-neutral hover:opacity-70 duration-100"
> >
<FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" /> <FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" />
<p className="truncate w-full">{shortendURL}</p> <p className="truncate w-full">{shortendURL}</p>
</Link> </Link>
<div className="flex items-center gap-1 text-gray-500 dark:text-gray-300"> <div className="flex items-center gap-1 text-neutral">
<FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" /> <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
<p>{formattedDate}</p> <p>{formattedDate}</p>
</div> </div>

View File

@ -74,7 +74,7 @@ export default function LinkPreview({ link, className, settings }: Props) {
<div className="flex justify-between gap-5 w-full h-full z-0"> <div className="flex justify-between gap-5 w-full h-full z-0">
<div className="flex flex-col justify-between w-full"> <div className="flex flex-col justify-between w-full">
<div className="flex items-baseline gap-1"> <div className="flex items-baseline gap-1">
<p className="text-sm text-gray-500 dark:text-gray-300">{1}</p> <p className="text-sm text-neutral">{1}</p>
<p className="text-lg truncate capitalize w-full pr-8"> <p className="text-lg truncate capitalize w-full pr-8">
{unescapeString(link.name as string)} {unescapeString(link.name as string)}
</p> </p>
@ -92,12 +92,12 @@ export default function LinkPreview({ link, className, settings }: Props) {
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
}} }}
className="flex items-center gap-1 max-w-full w-fit text-gray-500 dark:text-gray-300 hover:opacity-70 duration-100" className="flex items-center gap-1 max-w-full w-fit text-neutral hover:opacity-70 duration-100"
> >
<FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" /> <FontAwesomeIcon icon={faLink} className="mt-1 w-4 h-4" />
<p className="truncate w-full">{shortendURL}</p> <p className="truncate w-full">{shortendURL}</p>
</A> </A>
<div className="flex items-center gap-1 text-gray-500 dark:text-gray-300"> <div className="flex items-center gap-1 text-neutral">
<FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" /> <FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
<p>{formattedDate}</p> <p>{formattedDate}</p>
</div> </div>

View File

@ -71,10 +71,7 @@ export default function LinkSidebar({ className, onClick }: Props) {
}} }}
className={`hover:opacity-60 duration-100 py-2 px-2 cursor-pointer flex items-center gap-4 w-full rounded-md h-8`} className={`hover:opacity-60 duration-100 py-2 px-2 cursor-pointer flex items-center gap-4 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <FontAwesomeIcon icon={faPen} className="w-6 h-6 text-neutral" />
icon={faPen}
className="w-6 h-6 text-gray-500 dark:text-gray-300"
/>
<p className="truncate w-full lg:hidden">Edit</p> <p className="truncate w-full lg:hidden">Edit</p>
</div> </div>
@ -97,7 +94,7 @@ export default function LinkSidebar({ className, onClick }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faBoxesStacked} icon={faBoxesStacked}
className="w-6 h-6 text-gray-500 dark:text-gray-300" className="w-6 h-6 text-neutral"
/> />
<p className="truncate w-full lg:hidden">Preserved Formats</p> <p className="truncate w-full lg:hidden">Preserved Formats</p>
@ -120,7 +117,7 @@ export default function LinkSidebar({ className, onClick }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faTrashCan} icon={faTrashCan}
className="w-6 h-6 text-gray-500 dark:text-gray-300" className="w-6 h-6 text-neutral"
/> />
<p className="truncate w-full lg:hidden">Delete</p> <p className="truncate w-full lg:hidden">Delete</p>

View File

@ -112,7 +112,7 @@ export default function TeamManagement({
} }
/> />
<p className="text-gray-500 dark:text-gray-300 text-sm"> <p className="text-neutral text-sm">
This will let <b>Anyone</b> to view this collection. This will let <b>Anyone</b> to view this collection.
</p> </p>
</> </>
@ -181,7 +181,7 @@ export default function TeamManagement({
{collection?.members[0]?.user && ( {collection?.members[0]?.user && (
<> <>
<p className="text-center text-gray-500 dark:text-gray-300 text-xs sm:text-sm"> <p className="text-center text-neutral text-xs sm:text-sm">
(All Members have <b>Read</b> access to this collection.) (All Members have <b>Read</b> access to this collection.)
</p> </p>
<div className="flex flex-col gap-3 rounded-md"> <div className="flex flex-col gap-3 rounded-md">
@ -196,7 +196,7 @@ export default function TeamManagement({
{permissions === true && ( {permissions === true && (
<FontAwesomeIcon <FontAwesomeIcon
icon={faClose} icon={faClose}
className="absolute right-2 top-2 text-gray-500 dark:text-gray-300 h-4 hover:text-red-500 dark:hover:text-red-500 duration-100 cursor-pointer" className="absolute right-2 top-2 text-neutral h-4 hover:text-red-500 dark:hover:text-red-500 duration-100 cursor-pointer"
title="Remove Member" title="Remove Member"
onClick={() => { onClick={() => {
const updatedMembers = collection.members.filter( const updatedMembers = collection.members.filter(
@ -218,9 +218,7 @@ export default function TeamManagement({
/> />
<div> <div>
<p className="text-sm font-bold">{e.user.name}</p> <p className="text-sm font-bold">{e.user.name}</p>
<p className="text-gray-500 dark:text-gray-300"> <p className="text-neutral">@{e.user.username}</p>
@{e.user.username}
</p>
</div> </div>
</div> </div>
<div className="flex sm:block items-center justify-between gap-5 min-w-[10rem]"> <div className="flex sm:block items-center justify-between gap-5 min-w-[10rem]">
@ -233,7 +231,7 @@ export default function TeamManagement({
Permissions Permissions
</p> </p>
{permissions === true && ( {permissions === true && (
<p className="text-xs text-gray-500 dark:text-gray-300 mb-2"> <p className="text-xs text-neutral mb-2">
(Click to toggle.) (Click to toggle.)
</p> </p>
)} )}
@ -243,7 +241,7 @@ export default function TeamManagement({
!e.canCreate && !e.canCreate &&
!e.canUpdate && !e.canUpdate &&
!e.canDelete ? ( !e.canDelete ? (
<p className="text-sm text-gray-500 dark:text-gray-300"> <p className="text-sm text-neutral">
Has no permissions. Has no permissions.
</p> </p>
) : ( ) : (
@ -409,9 +407,7 @@ export default function TeamManagement({
className="w-3 h-3 text-yellow-500" className="w-3 h-3 text-yellow-500"
/> />
</div> </div>
<p className="text-gray-500 dark:text-gray-300"> <p className="text-neutral">@{collectionOwner.username}</p>
@{collectionOwner.username}
</p>
</div> </div>
</div> </div>

View File

@ -52,9 +52,7 @@ export default function ViewTeam({ collection }: Props) {
Admin Admin
</div> </div>
</div> </div>
<p className="text-gray-500 dark:text-gray-300"> <p className="text-neutral">@{collectionOwner.username}</p>
@{collectionOwner.username}
</p>
</div> </div>
</div> </div>
</div> </div>
@ -77,9 +75,7 @@ export default function ViewTeam({ collection }: Props) {
/> />
<div> <div>
<p className="text-sm font-bold">{e.user.name}</p> <p className="text-sm font-bold">{e.user.name}</p>
<p className="text-gray-500 dark:text-gray-300"> <p className="text-neutral">@{e.user.username}</p>
@{e.user.username}
</p>
</div> </div>
</div> </div>
</div> </div>

View File

@ -138,7 +138,7 @@ export default function AddOrEditLink({
<div className="flex flex-col gap-3 sm:w-[35rem] w-80"> <div className="flex flex-col gap-3 sm:w-[35rem] w-80">
{method === "UPDATE" ? ( {method === "UPDATE" ? (
<div <div
className="text-gray-500 dark:text-gray-300 break-all w-full flex gap-2" className="text-neutral break-all w-full flex gap-2"
title={link.url} title={link.url}
> >
<FontAwesomeIcon icon={faLink} className="w-6 h-6" /> <FontAwesomeIcon icon={faLink} className="w-6 h-6" />

View File

@ -107,7 +107,7 @@ export default function PreservedFormats() {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faCloudArrowDown} icon={faCloudArrowDown}
className="w-5 h-5 cursor-pointer text-gray-500 dark:text-gray-300" className="w-5 h-5 cursor-pointer text-neutral"
/> />
</div> </div>
@ -118,7 +118,7 @@ export default function PreservedFormats() {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faArrowUpRightFromSquare} icon={faArrowUpRightFromSquare}
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</Link> </Link>
</div> </div>
@ -142,7 +142,7 @@ export default function PreservedFormats() {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faCloudArrowDown} icon={faCloudArrowDown}
className="w-5 h-5 cursor-pointer text-gray-500 dark:text-gray-300" className="w-5 h-5 cursor-pointer text-neutral"
/> />
</div> </div>
@ -153,7 +153,7 @@ export default function PreservedFormats() {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faArrowUpRightFromSquare} icon={faArrowUpRightFromSquare}
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</Link> </Link>
</div> </div>
@ -183,7 +183,7 @@ export default function PreservedFormats() {
"" ""
)}`} )}`}
target="_blank" target="_blank"
className={`text-gray-500 dark:text-gray-300 duration-100 hover:opacity-60 flex gap-2 w-fit items-center text-sm ${ className={`text-neutral duration-100 hover:opacity-60 flex gap-2 w-fit items-center text-sm ${
link?.pdfPath && link?.pdfPath &&
link?.screenshotPath && link?.screenshotPath &&
link?.pdfPath !== "pending" && link?.pdfPath !== "pending" &&

View File

@ -23,7 +23,7 @@ export default function Modal({ toggleModal, className, children }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faChevronLeft} icon={faChevronLeft}
className="w-4 h-4 text-gray-500 dark:text-gray-300" className="w-4 h-4 text-neutral"
/> />
</div> </div>
{children} {children}

View File

@ -53,7 +53,7 @@ export default function Navbar() {
<div className="flex justify-between gap-2 items-center px-5 py-2 border-solid border-b-neutral-content dark:border-b-neutral-700 border-b h-16"> <div className="flex justify-between gap-2 items-center px-5 py-2 border-solid border-b-neutral-content dark:border-b-neutral-700 border-b h-16">
<div <div
onClick={toggleSidebar} onClick={toggleSidebar}
className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-[0.687rem] text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700" className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-[0.687rem] text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
> >
<FontAwesomeIcon icon={faBars} className="w-5 h-5" /> <FontAwesomeIcon icon={faBars} className="w-5 h-5" />
</div> </div>

View File

@ -64,7 +64,7 @@ export default function LinkCard({ link, count }: Props) {
))} ))}
</div> </div>
</div> </div>
<div className="flex gap-1 items-center flex-wrap text-sm text-gray-500 dark:text-gray-300"> <div className="flex gap-1 items-center flex-wrap text-sm text-neutral">
<p>{formattedDate}</p> <p>{formattedDate}</p>
<p>·</p> <p>·</p>
<Link <Link
@ -80,7 +80,7 @@ export default function LinkCard({ link, count }: Props) {
{unescapeString(link.description)}{" "} {unescapeString(link.description)}{" "}
<Link <Link
href={`/public/links/${link.id}`} href={`/public/links/${link.id}`}
className="flex gap-1 items-center flex-wrap text-sm text-gray-500 dark:text-gray-300 hover:opacity-50 duration-100 min-w-fit float-right mt-1 ml-2" className="flex gap-1 items-center flex-wrap text-sm text-neutral hover:opacity-50 duration-100 min-w-fit float-right mt-1 ml-2"
> >
<p>Read</p> <p>Read</p>
<FontAwesomeIcon <FontAwesomeIcon

View File

@ -125,7 +125,7 @@ export default function Sidebar({ className }: { className?: string }) {
onClick={() => { onClick={() => {
setCollectionDisclosure(!collectionDisclosure); setCollectionDisclosure(!collectionDisclosure);
}} }}
className="flex items-center justify-between text-sm w-full text-left mb-2 pl-2 font-bold text-gray-500 dark:text-gray-300 mt-5" className="flex items-center justify-between text-sm w-full text-left mb-2 pl-2 font-bold text-neutral mt-5"
> >
<p>Collections</p> <p>Collections</p>
@ -169,10 +169,10 @@ export default function Sidebar({ className }: { className?: string }) {
<FontAwesomeIcon <FontAwesomeIcon
icon={faGlobe} icon={faGlobe}
title="This collection is being shared publicly." title="This collection is being shared publicly."
className="w-4 h-4 drop-shadow text-gray-500 dark:text-gray-300" className="w-4 h-4 drop-shadow text-neutral"
/> />
) : undefined} ) : undefined}
<div className="drop-shadow text-gray-500 dark:text-gray-300 text-xs"> <div className="drop-shadow text-neutral text-xs">
{e._count?.links} {e._count?.links}
</div> </div>
</div> </div>
@ -183,7 +183,7 @@ export default function Sidebar({ className }: { className?: string }) {
<div <div
className={`duration-100 py-1 px-2 flex items-center gap-2 w-full rounded-md h-8 capitalize`} className={`duration-100 py-1 px-2 flex items-center gap-2 w-full rounded-md h-8 capitalize`}
> >
<p className="text-gray-500 dark:text-gray-300 text-xs font-semibold truncate w-full pr-7"> <p className="text-neutral text-xs font-semibold truncate w-full pr-7">
You Have No Collections... You Have No Collections...
</p> </p>
</div> </div>
@ -196,7 +196,7 @@ export default function Sidebar({ className }: { className?: string }) {
onClick={() => { onClick={() => {
setTagDisclosure(!tagDisclosure); setTagDisclosure(!tagDisclosure);
}} }}
className="flex items-center justify-between text-sm w-full text-left mb-2 pl-2 font-bold text-gray-500 dark:text-gray-300 mt-5" className="flex items-center justify-between text-sm w-full text-left mb-2 pl-2 font-bold text-neutral mt-5"
> >
<p>Tags</p> <p>Tags</p>
<FontAwesomeIcon <FontAwesomeIcon
@ -232,7 +232,7 @@ export default function Sidebar({ className }: { className?: string }) {
/> />
<p className="truncate w-full pr-7">{e.name}</p> <p className="truncate w-full pr-7">{e.name}</p>
<div className="drop-shadow text-gray-500 dark:text-gray-300 text-xs"> <div className="drop-shadow text-neutral text-xs">
{e._count?.links} {e._count?.links}
</div> </div>
</div> </div>
@ -243,7 +243,7 @@ export default function Sidebar({ className }: { className?: string }) {
<div <div
className={`duration-100 py-1 px-2 flex items-center gap-2 w-full rounded-md h-8 capitalize`} className={`duration-100 py-1 px-2 flex items-center gap-2 w-full rounded-md h-8 capitalize`}
> >
<p className="text-gray-500 dark:text-gray-300 text-xs font-semibold truncate w-full pr-7"> <p className="text-neutral text-xs font-semibold truncate w-full pr-7">
You Have No Tags... You Have No Tags...
</p> </p>
</div> </div>

View File

@ -86,7 +86,7 @@ export default function LinkLayout({ children }: Props) {
<div className="flex gap-3 mb-5 duration-100 items-center justify-between"> <div className="flex gap-3 mb-5 duration-100 items-center justify-between">
{/* <div {/* <div
onClick={toggleSidebar} onClick={toggleSidebar}
className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-2 text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700" className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
> >
<FontAwesomeIcon icon={faBars} className="w-5 h-5" /> <FontAwesomeIcon icon={faBars} className="w-5 h-5" />
</div> */} </div> */}
@ -103,7 +103,7 @@ export default function LinkLayout({ children }: Props) {
router.push(`/dashboard`); router.push(`/dashboard`);
} }
}} }}
className="inline-flex gap-1 hover:opacity-60 items-center select-none cursor-pointer p-2 lg:p-0 lg:px-1 lg:my-2 text-gray-500 dark:text-gray-300 rounded-md duration-100" className="inline-flex gap-1 hover:opacity-60 items-center select-none cursor-pointer p-2 lg:p-0 lg:px-1 lg:my-2 text-neutral rounded-md duration-100"
> >
<FontAwesomeIcon icon={faChevronLeft} className="w-4 h-4" /> <FontAwesomeIcon icon={faChevronLeft} className="w-4 h-4" />
Back{" "} Back{" "}
@ -138,7 +138,7 @@ export default function LinkLayout({ children }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faPen} icon={faPen}
className="w-6 h-6 text-gray-500 dark:text-gray-300" className="w-6 h-6 text-neutral"
/> />
</div> </div>
) : undefined} ) : undefined}
@ -159,7 +159,7 @@ export default function LinkLayout({ children }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faBoxesStacked} icon={faBoxesStacked}
className="w-6 h-6 text-gray-500 dark:text-gray-300" className="w-6 h-6 text-neutral"
/> />
</div> </div>
@ -179,7 +179,7 @@ export default function LinkLayout({ children }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faTrashCan} icon={faTrashCan}
className="w-6 h-6 text-gray-500 dark:text-gray-300" className="w-6 h-6 text-neutral"
/> />
</div> </div>
) : undefined} ) : undefined}

View File

@ -53,14 +53,14 @@ export default function SettingsLayout({ children }: Props) {
<div className="gap-2 inline-flex mr-3"> <div className="gap-2 inline-flex mr-3">
<div <div
onClick={toggleSidebar} onClick={toggleSidebar}
className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-2 text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700" className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
> >
<FontAwesomeIcon icon={faBars} className="w-5 h-5" /> <FontAwesomeIcon icon={faBars} className="w-5 h-5" />
</div> </div>
<Link <Link
href="/dashboard" href="/dashboard"
className="inline-flex w-fit gap-1 items-center select-none cursor-pointer p-2 text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700" className="inline-flex w-fit gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
> >
<FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" /> <FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" />
</Link> </Link>

View File

@ -60,7 +60,7 @@ export default function ChooseUsername() {
/> />
</div> </div>
<div> <div>
<p className="text-md text-gray-500 dark:text-gray-400 mt-1"> <p className="text-md text-neutral mt-1">
Feel free to reach out to us at{" "} Feel free to reach out to us at{" "}
<a <a
className="font-semibold underline" className="font-semibold underline"
@ -81,7 +81,7 @@ export default function ChooseUsername() {
<div <div
onClick={() => signOut()} onClick={() => signOut()}
className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold " className="w-fit mx-auto cursor-pointer text-neutral font-semibold "
> >
Sign Out Sign Out
</div> </div>

View File

@ -132,7 +132,7 @@ export default function Index() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -154,7 +154,7 @@ export default function Index() {
icon={faEllipsis} icon={faEllipsis}
id="expand-dropdown" id="expand-dropdown"
title="More" title="More"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
{expandDropdown ? ( {expandDropdown ? (

View File

@ -56,7 +56,7 @@ export default function Collections() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faEllipsis} icon={faEllipsis}
id="expand-dropdown" id="expand-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -95,7 +95,7 @@ export default function Collections() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>

View File

@ -186,7 +186,7 @@ export default function Dashboard() {
<p className="text-center text-2xl"> <p className="text-center text-2xl">
View Your Recently Added Links Here! View Your Recently Added Links Here!
</p> </p>
<p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2"> <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
This section will view your latest added Links across every This section will view your latest added Links across every
Collections you have access to. Collections you have access to.
</p> </p>
@ -323,7 +323,7 @@ export default function Dashboard() {
<p className="text-center text-2xl"> <p className="text-center text-2xl">
Pin Your Favorite Links Here! Pin Your Favorite Links Here!
</p> </p>
<p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2"> <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
You can Pin your favorite Links by clicking on the three dots on You can Pin your favorite Links by clicking on the three dots on
each Link and clicking{" "} each Link and clicking{" "}
<span className="font-semibold">Pin to Dashboard</span>. <span className="font-semibold">Pin to Dashboard</span>.

View File

@ -56,7 +56,7 @@ export default function Forgot() {
account. Make sure to change your password in the profile settings account. Make sure to change your password in the profile settings
afterwards. afterwards.
</p> </p>
<p className="text-sm text-gray-500 dark:text-gray-400"> <p className="text-sm text-neutral">
You wont get logged in if you haven&apos;t created an account yet. You wont get logged in if you haven&apos;t created an account yet.
</p> </p>
</div> </div>

View File

@ -185,7 +185,7 @@ export default function Index() {
/> />
)} )}
<div className="flex gap-2 text-sm text-gray-500 dark:text-gray-300"> <div className="flex gap-2 text-sm text-neutral">
<p className=" min-w-fit"> <p className=" min-w-fit">
{link?.createdAt {link?.createdAt
? new Date(link?.createdAt).toLocaleString("en-US", { ? new Date(link?.createdAt).toLocaleString("en-US", {

View File

@ -42,7 +42,7 @@ export default function Links() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>

View File

@ -42,7 +42,7 @@ export default function PinnedLinks() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -69,7 +69,7 @@ export default function PinnedLinks() {
<p className="text-center text-2xl"> <p className="text-center text-2xl">
Pin Your Favorite Links Here! Pin Your Favorite Links Here!
</p> </p>
<p className="text-center mx-auto max-w-96 w-fit text-gray-500 dark:text-gray-300 text-sm mt-2"> <p className="text-center mx-auto max-w-96 w-fit text-neutral text-sm mt-2">
You can Pin your favorite Links by clicking on the three dots on You can Pin your favorite Links by clicking on the three dots on
each Link and clicking{" "} each Link and clicking{" "}
<span className="font-semibold">Pin to Dashboard</span>. <span className="font-semibold">Pin to Dashboard</span>.

View File

@ -97,10 +97,7 @@ export default function Login() {
/> />
{emailEnabled && ( {emailEnabled && (
<div className="w-fit ml-auto mt-1"> <div className="w-fit ml-auto mt-1">
<Link <Link href={"/forgot"} className="text-neutral font-semibold">
href={"/forgot"}
className="text-gray-500 dark:text-gray-400 font-semibold"
>
Forgot Password? Forgot Password?
</Link> </Link>
</div> </div>
@ -125,9 +122,7 @@ export default function Login() {
{process.env.NEXT_PUBLIC_DISABLE_REGISTRATION === {process.env.NEXT_PUBLIC_DISABLE_REGISTRATION ===
"true" ? undefined : ( "true" ? undefined : (
<div className="flex items-baseline gap-1 justify-center"> <div className="flex items-baseline gap-1 justify-center">
<p className="w-fit text-gray-500 dark:text-gray-400"> <p className="w-fit text-neutral">New here?</p>
New here?
</p>
<Link href={"/register"} className="block font-semibold"> <Link href={"/register"} className="block font-semibold">
Sign Up Sign Up
</Link> </Link>

View File

@ -184,7 +184,7 @@ export default function PublicCollections() {
</div> </div>
) : null} ) : null}
<p className="ml-2 mt-1 text-gray-500 dark:text-gray-300"> <p className="ml-2 mt-1 text-neutral">
By {collectionOwner.name} By {collectionOwner.name}
{collection.members.length > 0 {collection.members.length > 0
? ` and ${collection.members.length} others` ? ` and ${collection.members.length} others`
@ -215,7 +215,7 @@ export default function PublicCollections() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faFilter} icon={faFilter}
id="filter-dropdown" id="filter-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -237,7 +237,7 @@ export default function PublicCollections() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>

View File

@ -185,7 +185,7 @@ export default function Index() {
/> />
)} )}
<div className="flex gap-2 text-sm text-gray-500 dark:text-gray-300"> <div className="flex gap-2 text-sm text-neutral">
<p className=" min-w-fit"> <p className=" min-w-fit">
{link?.createdAt {link?.createdAt
? new Date(link?.createdAt).toLocaleString("en-US", { ? new Date(link?.createdAt).toLocaleString("en-US", {

View File

@ -190,7 +190,7 @@ export default function Register() {
{process.env.NEXT_PUBLIC_STRIPE ? ( {process.env.NEXT_PUBLIC_STRIPE ? (
<div> <div>
<p className="text-xs text-gray-500 dark:text-gray-400"> <p className="text-xs text-neutral">
By signing up, you agree to our{" "} By signing up, you agree to our{" "}
<Link <Link
href="https://linkwarden.app/tos" href="https://linkwarden.app/tos"
@ -207,7 +207,7 @@ export default function Register() {
</Link> </Link>
. .
</p> </p>
<p className="text-xs text-gray-500 dark:text-gray-400"> <p className="text-xs text-neutral">
Need help?{" "} Need help?{" "}
<Link <Link
href="mailto:support@linkwarden.app" href="mailto:support@linkwarden.app"
@ -227,9 +227,7 @@ export default function Register() {
<p className="text-center w-full font-bold">Sign Up</p> <p className="text-center w-full font-bold">Sign Up</p>
</button> </button>
<div className="flex items-baseline gap-1 justify-center"> <div className="flex items-baseline gap-1 justify-center">
<p className="w-fit text-gray-500 dark:text-gray-400"> <p className="w-fit text-neutral">Already have an account?</p>
Already have an account?
</p>
<Link href={"/login"} className="block font-bold"> <Link href={"/login"} className="block font-bold">
Login Login
</Link> </Link>

View File

@ -63,7 +63,7 @@ export default function Search() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faFilter} icon={faFilter}
id="filter-dropdown" id="filter-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -85,7 +85,7 @@ export default function Search() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>

View File

@ -178,7 +178,7 @@ export default function Account() {
<p className="mb-2">Email</p> <p className="mb-2">Email</p>
{user.email !== account.email && {user.email !== account.email &&
process.env.NEXT_PUBLIC_STRIPE === "true" ? ( process.env.NEXT_PUBLIC_STRIPE === "true" ? (
<p className="text-gray-500 dark:text-gray-400 mb-2 text-sm"> <p className="text-neutral mb-2 text-sm">
Updating this field will change your billing email as well Updating this field will change your billing email as well
</p> </p>
) : undefined} ) : undefined}
@ -327,14 +327,14 @@ export default function Account() {
onClick={() => setUser({ ...user, isPrivate: !user.isPrivate })} onClick={() => setUser({ ...user, isPrivate: !user.isPrivate })}
/> />
<p className="text-gray-500 dark:text-gray-300 text-sm"> <p className="text-neutral text-sm">
This will limit who can find and add you to new Collections. This will limit who can find and add you to new Collections.
</p> </p>
{user.isPrivate && ( {user.isPrivate && (
<div className="pl-5"> <div className="pl-5">
<p className="mt-2">Whitelisted Users</p> <p className="mt-2">Whitelisted Users</p>
<p className="text-gray-500 dark:text-gray-300 text-sm mb-3"> <p className="text-neutral text-sm mb-3">
Please provide the Username of the users you wish to grant Please provide the Username of the users you wish to grant
visibility to your profile. Separated by comma. visibility to your profile. Separated by comma.
</p> </p>

View File

@ -57,7 +57,7 @@ export default function Password() {
<div className="p-4 mx-auto relative flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content"> <div className="p-4 mx-auto relative flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<Link <Link
href="/settings/account" href="/settings/account"
className="absolute top-4 left-4 gap-1 items-center select-none cursor-pointer p-2 text-gray-500 dark:text-gray-300 rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700" className="absolute top-4 left-4 gap-1 items-center select-none cursor-pointer p-2 text-neutral rounded-md duration-100 hover:bg-slate-200 dark:hover:bg-neutral-700"
> >
<FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" /> <FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" />
</Link> </Link>

View File

@ -77,9 +77,7 @@ export default function Subscribe() {
<div className="flex flex-col gap-2 justify-center items-center"> <div className="flex flex-col gap-2 justify-center items-center">
<p className="text-3xl"> <p className="text-3xl">
${plan === Plan.monthly ? "4" : "3"} ${plan === Plan.monthly ? "4" : "3"}
<span className="text-base text-gray-500 dark:text-gray-400"> <span className="text-base text-neutral">/mo</span>
/mo
</span>
</p> </p>
<p className="font-semibold"> <p className="font-semibold">
Billed {plan === Plan.monthly ? "Monthly" : "Yearly"} Billed {plan === Plan.monthly ? "Monthly" : "Yearly"}
@ -108,7 +106,7 @@ export default function Subscribe() {
<div <div
onClick={() => signOut()} onClick={() => signOut()}
className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold " className="w-fit mx-auto cursor-pointer text-neutral font-semibold "
> >
Sign Out Sign Out
</div> </div>

View File

@ -127,7 +127,7 @@ export default function Index() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faCheck} icon={faCheck}
id="expand-dropdown" id="expand-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
<div <div
@ -138,7 +138,7 @@ export default function Index() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faXmark} icon={faXmark}
id="expand-dropdown" id="expand-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
</form> </form>
@ -157,7 +157,7 @@ export default function Index() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faEllipsis} icon={faEllipsis}
id="expand-dropdown" id="expand-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>
@ -202,7 +202,7 @@ export default function Index() {
<FontAwesomeIcon <FontAwesomeIcon
icon={faSort} icon={faSort}
id="sort-dropdown" id="sort-dropdown"
className="w-5 h-5 text-gray-500 dark:text-gray-300" className="w-5 h-5 text-neutral"
/> />
</div> </div>