changed classNames

This commit is contained in:
daniel31x13
2023-11-26 05:17:08 -05:00
parent 0a398d1fd9
commit b51b08b0f4
42 changed files with 107 additions and 119 deletions
+2 -9
View File
@@ -1,4 +1,4 @@
import React, { useEffect, useState } from "react";
import React from "react";
import "@/styles/globals.css";
import { SessionProvider } from "next-auth/react";
import type { AppProps } from "next/app";
@@ -6,7 +6,6 @@ import Head from "next/head";
import AuthRedirect from "@/layouts/AuthRedirect";
import { Toaster } from "react-hot-toast";
import { Session } from "next-auth";
import useLocalSettingsStore from "@/store/localSettings";
export default function App({
Component,
@@ -14,12 +13,6 @@ export default function App({
}: AppProps<{
session: Session;
}>) {
const { setSettings } = useLocalSettingsStore();
useEffect(() => {
setSettings();
}, []);
return (
<SessionProvider
session={pageProps.session}
@@ -54,7 +47,7 @@ export default function App({
reverseOrder={false}
toastOptions={{
className:
"border border-neutral-content dark:bg-neutral-900 dark:text-white",
"border border-sky-100 dark:border-neutral-700 dark:bg-neutral-900 dark:text-white",
}}
/>
<Component {...pageProps} />
+2 -2
View File
@@ -41,7 +41,7 @@ export default function ChooseUsername() {
return (
<CenteredForm>
<form onSubmit={submitUsername}>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p className="text-3xl text-center font-extralight">
Choose a Username
</p>
@@ -55,7 +55,7 @@ export default function ChooseUsername() {
autoFocus
placeholder="john"
value={inputedUsername}
className="bg-white"
className="bg-base-100"
onChange={(e) => setInputedUsername(e.target.value)}
/>
</div>
+2 -2
View File
@@ -127,7 +127,7 @@ export default function Index() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-black hover:dark:bg-white hover:bg-opacity-10 hover:dark:bg-opacity-10 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
@@ -148,7 +148,7 @@ export default function Index() {
<div
onClick={() => setExpandDropdown(!expandDropdown)}
id="expand-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-black hover:dark:bg-white hover:bg-opacity-10 hover:dark:bg-opacity-10 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faEllipsis}
+2 -2
View File
@@ -51,7 +51,7 @@ export default function Collections() {
<div
onClick={() => setExpandDropdown(!expandDropdown)}
id="expand-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faEllipsis}
@@ -90,7 +90,7 @@ export default function Collections() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
+1 -1
View File
@@ -5,7 +5,7 @@ import React from "react";
export default function EmailConfirmaion() {
return (
<CenteredForm>
<div className="p-4 max-w-[30rem] min-w-80 w-full rounded-2xl shadow-md mx-auto border border-neutral-content bg-slate-50 dark:bg-neutral-800">
<div className="p-4 max-w-[30rem] min-w-80 w-full rounded-2xl shadow-md mx-auto border border-neutral-content bg-base-200">
<p className="text-center text-2xl sm:text-3xl font-extralight mb-2 ">
Please check your Email
</p>
+3 -3
View File
@@ -120,7 +120,7 @@ export default function Dashboard() {
</div>
<div>
<div className="flex justify-evenly flex-col md:flex-row md:items-center gap-2 md:w-full h-full rounded-2xl p-8 border border-neutral-content bg-base-200 dark:bg-neutral-800">
<div className="flex justify-evenly flex-col md:flex-row md:items-center gap-2 md:w-full h-full rounded-2xl p-8 border border-neutral-content bg-base-200">
<DashboardItem
name={numberOfLinks === 1 ? "Link" : "Links"}
value={numberOfLinks}
@@ -242,7 +242,7 @@ export default function Dashboard() {
<label
htmlFor="import-linkwarden-file"
title="JSON File"
className="flex items-center gap-2 py-1 px-2 hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 cursor-pointer"
className="flex items-center gap-2 py-1 px-2 hover:bg-base-100 duration-100 cursor-pointer"
>
Linkwarden File...
<input
@@ -259,7 +259,7 @@ export default function Dashboard() {
<label
htmlFor="import-html-file"
title="HTML File"
className="flex items-center gap-2 py-1 px-2 hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 cursor-pointer"
className="flex items-center gap-2 py-1 px-2 hover:bg-base-100 duration-100 cursor-pointer"
>
Bookmarks HTML file...
<input
+2 -2
View File
@@ -43,7 +43,7 @@ export default function Forgot() {
return (
<CenteredForm>
<form onSubmit={sendConfirmation}>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p className="text-3xl text-center font-extralight">
Password Recovery
</p>
@@ -68,7 +68,7 @@ export default function Forgot() {
type="email"
placeholder="johnny@example.com"
value={form.email}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, email: e.target.value })}
/>
</div>
+1 -1
View File
@@ -165,7 +165,7 @@ export default function Index() {
height={42}
alt=""
id={"favicon-" + link.id}
className="select-none mt-2 w-10 rounded-md shadow border-[3px] border-white dark:border-neutral-900 bg-white dark:bg-neutral-900 aspect-square"
className="select-none mt-2 w-10 rounded-md shadow border-[3px] border-base-100 bg-base-100 aspect-square"
draggable="false"
onLoad={(e) => {
try {
+1 -1
View File
@@ -37,7 +37,7 @@ export default function Links() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
+1 -1
View File
@@ -37,7 +37,7 @@ export default function PinnedLinks() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
+3 -3
View File
@@ -63,7 +63,7 @@ export default function Login() {
return (
<CenteredForm text="Sign in to your account">
<form onSubmit={loginUser}>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p className="text-3xl text-center font-extralight">
Enter your credentials
</p>
@@ -80,7 +80,7 @@ export default function Login() {
autoFocus={true}
placeholder="johnny"
value={form.username}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, username: e.target.value })}
/>
</div>
@@ -92,7 +92,7 @@ export default function Login() {
type="password"
placeholder="••••••••••••••"
value={form.password}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, password: e.target.value })}
/>
{emailEnabled && (
+4 -4
View File
@@ -197,7 +197,7 @@ export default function PublicCollections() {
<p className="mt-5">{collection.description}</p>
<hr className="mt-5 border-1 border-neutral-500" />
<hr className="mt-5 border-1 border-neutral" />
<div className="flex mb-5 mt-10 flex-col gap-5">
<div className="flex justify-between">
@@ -210,7 +210,7 @@ export default function PublicCollections() {
<div
onClick={() => setFilterDropdown(!filterDropdown)}
id="filter-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-neutral-500 hover:bg-opacity-40 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faFilter}
@@ -232,7 +232,7 @@ export default function PublicCollections() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-neutral-500 hover:bg-opacity-40 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
@@ -271,7 +271,7 @@ export default function PublicCollections() {
})}
</div>
{/* <p className="text-center text-gray-500">
{/* <p className="text-center text-neutral">
List created with <span className="text-black">Linkwarden.</span>
</p> */}
</div>
+1 -1
View File
@@ -165,7 +165,7 @@ export default function Index() {
height={42}
alt=""
id={"favicon-" + link.id}
className="select-none mt-2 w-10 rounded-md shadow border-[3px] border-white dark:border-neutral-900 bg-white dark:bg-neutral-900 aspect-square"
className="select-none mt-2 w-10 rounded-md shadow border-[3px] border-base-100 bg-base-100 aspect-square"
draggable="false"
onLoad={(e) => {
try {
+7 -7
View File
@@ -104,7 +104,7 @@ export default function Register() {
}
>
{process.env.NEXT_PUBLIC_DISABLE_REGISTRATION === "true" ? (
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p>
Registration is disabled for this instance, please contact the admin
in case of any issues.
@@ -112,7 +112,7 @@ export default function Register() {
</div>
) : (
<form onSubmit={registerUser}>
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full mx-auto bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full mx-auto bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p className="text-3xl text-center font-extralight">
Enter your details
</p>
@@ -126,7 +126,7 @@ export default function Register() {
autoFocus={true}
placeholder="Johnny"
value={form.name}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, name: e.target.value })}
/>
</div>
@@ -138,7 +138,7 @@ export default function Register() {
<TextInput
placeholder="john"
value={form.username}
className="bg-white"
className="bg-base-100"
onChange={(e) =>
setForm({ ...form, username: e.target.value })
}
@@ -154,7 +154,7 @@ export default function Register() {
type="email"
placeholder="johnny@example.com"
value={form.email}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, email: e.target.value })}
/>
</div>
@@ -167,7 +167,7 @@ export default function Register() {
type="password"
placeholder="••••••••••••••"
value={form.password}
className="bg-white"
className="bg-base-100"
onChange={(e) => setForm({ ...form, password: e.target.value })}
/>
</div>
@@ -181,7 +181,7 @@ export default function Register() {
type="password"
placeholder="••••••••••••••"
value={form.passwordConfirmation}
className="bg-white"
className="bg-base-100"
onChange={(e) =>
setForm({ ...form, passwordConfirmation: e.target.value })
}
+2 -2
View File
@@ -58,7 +58,7 @@ export default function Search() {
<div
onClick={() => setFilterDropdown(!filterDropdown)}
id="filter-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faFilter}
@@ -80,7 +80,7 @@ export default function Search() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}
+7 -7
View File
@@ -206,13 +206,13 @@ export default function Account() {
image: "",
})
}
className="absolute top-1 left-1 w-5 h-5 flex items-center justify-center border p-1 border-slate-200 rounded-full bg-white dark:bg-neutral-800 text-center select-none cursor-pointer duration-100 hover:text-red-500"
className="absolute top-1 left-1 w-5 h-5 flex items-center justify-center border p-1 border-slate-200 rounded-full bg-base-200 text-center select-none cursor-pointer duration-100 hover:text-red-500"
>
<FontAwesomeIcon icon={faClose} className="w-3 h-3" />
</div>
)}
<div className="absolute -bottom-3 left-0 right-0 mx-auto w-fit text-center">
<label className="border border-slate-200 rounded-md bg-white dark:bg-neutral-800 px-2 text-center select-none cursor-pointer duration-100 hover:border-sky-300 hover:dark:border-sky-600">
<label className="border border-slate-200 rounded-md bg-base-200 px-2 text-center select-none cursor-pointer duration-100 hover:border-primary">
Browse...
<input
type="file"
@@ -247,7 +247,7 @@ export default function Account() {
>
<div
id="import-dropdown"
className="border border-slate-200 rounded-md bg-white dark:bg-neutral-800 px-2 text-center select-none cursor-pointer duration-100 hover:border-sky-300 hover:dark:border-sky-600"
className="border border-slate-200 rounded-md bg-base-200 px-2 text-center select-none cursor-pointer duration-100 hover:border-primary"
>
Import From
</div>
@@ -264,7 +264,7 @@ export default function Account() {
<label
htmlFor="import-linkwarden-file"
title="JSON File"
className="flex items-center gap-2 py-1 px-2 hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 cursor-pointer"
className="flex items-center gap-2 py-1 px-2 hover:bg-neutral-content duration-100 cursor-pointer"
>
Linkwarden File...
<input
@@ -281,7 +281,7 @@ export default function Account() {
<label
htmlFor="import-html-file"
title="HTML File"
className="flex items-center gap-2 py-1 px-2 hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 cursor-pointer"
className="flex items-center gap-2 py-1 px-2 hover:bg-neutral-content duration-100 cursor-pointer"
>
Bookmarks HTML file...
<input
@@ -304,7 +304,7 @@ export default function Account() {
<div>
<p className="mb-2">Download your data instantly.</p>
<Link className="w-fit" href="/api/v1/migration">
<div className="border w-fit border-slate-200 rounded-md bg-white dark:bg-neutral-800 px-2 text-center select-none cursor-pointer duration-100 hover:border-sky-300 hover:dark:border-sky-600">
<div className="border w-fit border-slate-200 rounded-md bg-base-200 px-2 text-center select-none cursor-pointer duration-100 hover:border-primary">
Export Data
</div>
</Link>
@@ -339,7 +339,7 @@ export default function Account() {
visibility to your profile. Separated by comma.
</p>
<textarea
className="w-full resize-none border rounded-md duration-100 bg-gray-50 dark:bg-neutral-950 p-2 outline-none border-neutral-content focus:border-sky-300 dark:focus:border-sky-600"
className="w-full resize-none border rounded-md duration-100 bg-base-200 p-2 outline-none border-neutral-content focus:border-sky-300 dark:focus:border-sky-600"
placeholder="Your profile is hidden from everyone right now..."
value={whitelistedUsersTextbox}
onChange={(e) => setWhiteListedUsersTextbox(e.target.value)}
+9 -5
View File
@@ -54,12 +54,15 @@ export default function Password() {
return (
<CenteredForm>
<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-base-200 rounded-2xl shadow-md border border-neutral-content">
<Link
href="/settings/account"
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"
className="absolute top-4 left-4 btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon icon={faChevronLeft} className="w-5 h-5" />
<FontAwesomeIcon
icon={faChevronLeft}
className="w-5 h-5 text-neutral"
/>
</Link>
<div className="flex items-center gap-2 w-full rounded-md h-8">
<p className="text-red-500 dark:text-red-500 truncate w-full text-3xl text-center">
@@ -86,6 +89,7 @@ export default function Password() {
value={password}
onChange={(e) => setPassword(e.target.value)}
placeholder="••••••••••••••"
className="bg-base-100"
type="password"
/>
</div>
@@ -102,7 +106,7 @@ export default function Password() {
<label className="w-full flex min-[430px]:items-center items-start gap-2 mb-3 min-[430px]:flex-row flex-col">
<p className="text-sm">Reason for cancellation:</p>
<select
className="rounded-md p-1 border-neutral-content bg-gray-50 focus:border-sky-300 dark:focus:border-sky-600 border-solid border outline-none duration-100 dark:bg-neutral-950"
className="rounded-md p-1 outline-none"
value={feedback}
onChange={(e) => setFeedback(e.target.value)}
>
@@ -127,7 +131,7 @@ export default function Password() {
value={comment}
onChange={(e) => setComment(e.target.value)}
placeholder="e.g. I needed a feature that..."
className="resize-none w-full rounded-md p-2 border-neutral-content bg-gray-50 focus:border-sky-300 dark:focus:border-sky-600 border-solid border outline-none duration-100 dark:bg-neutral-950"
className="resize-none w-full rounded-md p-2 border-neutral-content bg-base-100 focus:border-sky-300 dark:focus:border-sky-600 border-solid border outline-none duration-100"
/>
</div>
</fieldset>
+1 -1
View File
@@ -30,7 +30,7 @@ export default function Subscribe() {
process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14
}-day free trial, cancel anytime!`}
>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-slate-50 dark:bg-neutral-800 rounded-2xl shadow-md border border-neutral-content">
<div className="p-4 mx-auto flex flex-col gap-3 justify-between max-w-[30rem] min-w-80 w-full bg-base-200 rounded-2xl shadow-md border border-neutral-content">
<p className="sm:text-3xl text-2xl text-center font-extralight">
Subscribe to Linkwarden!
</p>
+5 -5
View File
@@ -115,14 +115,14 @@ export default function Index() {
<input
type="text"
autoFocus
className="sm:text-4xl text-3xl capitalize bg-transparent h-10 w-3/4 outline-none border-b border-b-neutral-content dark:border-b-neutral-700"
className="sm:text-4xl text-3xl capitalize bg-transparent h-10 w-3/4 outline-none border-b border-b-neutral-content"
value={newTagName}
onChange={(e) => setNewTagName(e.target.value)}
/>
<div
onClick={() => submit()}
id="expand-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faCheck}
@@ -133,7 +133,7 @@ export default function Index() {
<div
onClick={() => cancelUpdateTag()}
id="expand-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faXmark}
@@ -152,7 +152,7 @@ export default function Index() {
<div
onClick={() => setExpandDropdown(!expandDropdown)}
id="expand-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faEllipsis}
@@ -197,7 +197,7 @@ export default function Index() {
<div
onClick={() => setSortDropdown(!sortDropdown)}
id="sort-dropdown"
className="inline-flex rounded-md cursor-pointer hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100 p-1"
className="btn btn-ghost btn-square btn-sm"
>
<FontAwesomeIcon
icon={faSort}