working on dark mode

This commit is contained in:
Gisbi
2023-08-06 16:13:45 +02:00
parent 64c417c1be
commit 93ebc09faf
10 changed files with 46 additions and 46 deletions
+8 -8
View File
@@ -47,13 +47,13 @@ export default function Login() {
return (
<CenteredForm text="Sign in to your account">
<div className="p-2 flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 rounded-2xl shadow-md border border-sky-100">
<p className="text-2xl text-black text-center font-bold">
<div className="p-2 flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 dark:bg-sky-950 rounded-2xl shadow-md border border-sky-100 dark:border-sky-800">
<p className="text-2xl text-black dark:text-white text-center font-bold">
Enter your credentials
</p>
<div>
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 dark:text-sky-300 w-fit font-semibold mb-1">
Username
{emailEnabled ? "/Email" : undefined}
</p>
@@ -63,12 +63,12 @@ export default function Login() {
placeholder="johnny"
value={form.username}
onChange={(e) => setForm({ ...form, username: e.target.value })}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 dark:border-sky-800 dark:bg-sky-800 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
<div>
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 dark:text-sky-300 w-fit font-semibold mb-1">
Password
</p>
@@ -77,7 +77,7 @@ export default function Login() {
placeholder="••••••••••••••"
value={form.password}
onChange={(e) => setForm({ ...form, password: e.target.value })}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 dark:border-sky-800 dark:bg-sky-800 border-solid border outline-none focus:border-sky-700 duration-100"
/>
{emailEnabled && (
<div className="w-fit ml-auto mt-1">
@@ -95,8 +95,8 @@ export default function Login() {
loading={submitLoader}
/>
<div className="flex items-baseline gap-1 justify-center">
<p className="w-fit text-gray-500">New here?</p>
<Link href={"/register"} className="block text-sky-700 font-bold">
<p className="w-fit text-gray-500 dark:text-sky-300">New here?</p>
<Link href={"/register"} className="block text-sky-700 dark:text-sky-500 font-bold">
Sign Up
</Link>
</div>
+2 -2
View File
@@ -36,9 +36,9 @@ export default function Index() {
<div className="flex gap-2">
<FontAwesomeIcon
icon={faHashtag}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500"
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 dark:text-sky-500 font-bold">
{activeTag?.name}
</p>
</div>