small coloring changes

This commit is contained in:
Daniel
2023-08-31 00:17:27 -04:00
parent 11539ade6c
commit fdfb3a927e
14 changed files with 38 additions and 38 deletions
+2 -2
View File
@@ -20,11 +20,11 @@ export default function Checkbox({ label, state, className, onClick }: Props) {
/> />
<FontAwesomeIcon <FontAwesomeIcon
icon={faSquareCheck} icon={faSquareCheck}
className="w-5 h-5 text-sky-500 dark:text-sky-300 peer-checked:block hidden" className="w-5 h-5 text-sky-500 dark:text-sky-500 peer-checked:block hidden"
/> />
<FontAwesomeIcon <FontAwesomeIcon
icon={faSquare} icon={faSquare}
className="w-5 h-5 text-sky-500 dark:text-sky-300 peer-checked:hidden block" className="w-5 h-5 text-sky-500 dark:text-sky-500 peer-checked:hidden block"
/> />
<span className="text-black dark:text-white rounded select-none"> <span className="text-black dark:text-white rounded select-none">
{label} {label}
@@ -99,7 +99,7 @@ export default function DeleteCollection({
</> </>
) : ( ) : (
<p className="text-black dark:text-white"> <p className="text-black dark:text-white">
Click the button below to leave the current collection: Click the button below to leave the current collection.
</p> </p>
)} )}
+3 -3
View File
@@ -57,7 +57,7 @@ export default function CollectionModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none"
} }
> >
@@ -67,7 +67,7 @@ export default function CollectionModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none"
} }
> >
@@ -76,7 +76,7 @@ export default function CollectionModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 hover:dark:text-white rounded-md duration-100 outline-none"
} }
> >
+4 -4
View File
@@ -247,7 +247,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faArrowUpRightFromSquare} icon={faArrowUpRightFromSquare}
className="w-5 h-5 text-sky-500 dark:text-sky-300" className="w-5 h-5 text-sky-500 dark:text-sky-500"
/> />
</Link> </Link>
@@ -257,7 +257,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faCloudArrowDown} icon={faCloudArrowDown}
className="w-5 h-5 cursor-pointer text-sky-500 dark:text-sky-300" className="w-5 h-5 cursor-pointer text-sky-500 dark:text-sky-500"
/> />
</div> </div>
</div> </div>
@@ -281,7 +281,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faArrowUpRightFromSquare} icon={faArrowUpRightFromSquare}
className="w-5 h-5 text-sky-500 dark:text-sky-300" className="w-5 h-5 text-sky-500 dark:text-sky-500"
/> />
</Link> </Link>
@@ -291,7 +291,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faCloudArrowDown} icon={faCloudArrowDown}
className="w-5 h-5 cursor-pointer text-sky-500 dark:text-sky-300" className="w-5 h-5 cursor-pointer text-sky-500 dark:text-sky-500"
/> />
</div> </div>
</div> </div>
+2 -2
View File
@@ -43,7 +43,7 @@ export default function LinkModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-600 duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
@@ -52,7 +52,7 @@ export default function LinkModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-600 duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
+4 -4
View File
@@ -31,7 +31,7 @@ export default function UserModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
@@ -41,7 +41,7 @@ export default function UserModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
@@ -51,7 +51,7 @@ export default function UserModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 dark:text-white duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 dark:text-white duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
@@ -62,7 +62,7 @@ export default function UserModal({
<Tab <Tab
className={({ selected }) => className={({ selected }) =>
selected selected
? "px-2 py-1 bg-sky-200 dark:bg-sky-500 duration-100 rounded-md outline-none" ? "px-2 py-1 bg-sky-200 dark:bg-sky-800 duration-100 rounded-md outline-none"
: "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none" : "px-2 py-1 hover:bg-slate-200 hover:dark:bg-neutral-700 rounded-md duration-100 outline-none"
} }
> >
+2 -2
View File
@@ -20,11 +20,11 @@ export default function RadioButton({ label, state, onClick }: Props) {
/> />
<FontAwesomeIcon <FontAwesomeIcon
icon={faCircleCheck} icon={faCircleCheck}
className="w-5 h-5 text-sky-500 dark:text-sky-300 peer-checked:block hidden" className="w-5 h-5 text-sky-500 dark:text-sky-500 peer-checked:block hidden"
/> />
<FontAwesomeIcon <FontAwesomeIcon
icon={faCircle} icon={faCircle}
className="w-5 h-5 text-sky-500 dark:text-sky-300 peer-checked:hidden block" className="w-5 h-5 text-sky-500 dark:text-sky-500 peer-checked:hidden block"
/> />
<span className="text-black dark:text-white rounded select-none"> <span className="text-black dark:text-white rounded select-none">
{label} {label}
+1 -1
View File
@@ -24,7 +24,7 @@ export default function Search() {
> >
<label <label
htmlFor="search-box" htmlFor="search-box"
className="inline-flex w-fit absolute left-2 pointer-events-none rounded-md p-1 text-sky-500 dark:text-sky-300" className="inline-flex w-fit absolute left-2 pointer-events-none rounded-md p-1 text-sky-500 dark:text-sky-500"
> >
<FontAwesomeIcon icon={faMagnifyingGlass} className="w-5 h-5" /> <FontAwesomeIcon icon={faMagnifyingGlass} className="w-5 h-5" />
</label> </label>
+9 -9
View File
@@ -58,13 +58,13 @@ export default function Sidebar({ className }: { className?: string }) {
href="/dashboard" href="/dashboard"
className={`${ className={`${
active === "/dashboard" active === "/dashboard"
? "bg-sky-200 dark:bg-sky-600" ? "bg-sky-200 dark:bg-sky-800"
: "hover:bg-slate-200 hover:dark:bg-neutral-700" : "hover:bg-slate-200 hover:dark:bg-neutral-700"
} outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`} } outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`}
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faChartSimple} icon={faChartSimple}
className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-300`} className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-500`}
/> />
<p className="text-black dark:text-white text-xs xl:text-sm font-semibold"> <p className="text-black dark:text-white text-xs xl:text-sm font-semibold">
@@ -76,13 +76,13 @@ export default function Sidebar({ className }: { className?: string }) {
href="/links" href="/links"
className={`${ className={`${
active === "/links" active === "/links"
? "bg-sky-200 dark:bg-sky-600" ? "bg-sky-200 dark:bg-sky-800"
: "hover:bg-slate-200 hover:dark:bg-neutral-700" : "hover:bg-slate-200 hover:dark:bg-neutral-700"
} outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`} } outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`}
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faLink} icon={faLink}
className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-300`} className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-500`}
/> />
<p className="text-black dark:text-white text-xs xl:text-sm font-semibold"> <p className="text-black dark:text-white text-xs xl:text-sm font-semibold">
@@ -94,13 +94,13 @@ export default function Sidebar({ className }: { className?: string }) {
href="/collections" href="/collections"
className={`${ className={`${
active === "/collections" active === "/collections"
? "bg-sky-200 dark:bg-sky-600" ? "bg-sky-200 dark:bg-sky-800"
: "hover:bg-slate-200 hover:dark:bg-neutral-700" : "hover:bg-slate-200 hover:dark:bg-neutral-700"
} outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`} } outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex justify-center flex-col items-center gap-1 w-full`}
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faFolder} icon={faFolder}
className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-300`} className={`w-8 h-8 drop-shadow text-sky-500 dark:text-sky-500`}
/> />
<p className="text-black dark:text-white text-xs xl:text-sm font-semibold"> <p className="text-black dark:text-white text-xs xl:text-sm font-semibold">
@@ -143,7 +143,7 @@ export default function Sidebar({ className }: { className?: string }) {
<div <div
className={`${ className={`${
active === `/collections/${e.id}` active === `/collections/${e.id}`
? "bg-sky-200 dark:bg-sky-700 " ? "bg-sky-200 dark:bg-sky-800"
: "hover:bg-slate-200 hover:dark:bg-neutral-700" : "hover:bg-slate-200 hover:dark:bg-neutral-700"
} duration-100 py-1 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8 capitalize`} } duration-100 py-1 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8 capitalize`}
> >
@@ -203,13 +203,13 @@ export default function Sidebar({ className }: { className?: string }) {
<div <div
className={`${ className={`${
active === `/tags/${e.id}` active === `/tags/${e.id}`
? "bg-sky-200 dark:bg-sky-700" ? "bg-sky-200 dark:bg-sky-800"
: "hover:bg-slate-200 hover:dark:bg-neutral-700" : "hover:bg-slate-200 hover:dark:bg-neutral-700"
} duration-100 py-1 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`} } duration-100 py-1 px-2 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
> >
<FontAwesomeIcon <FontAwesomeIcon
icon={faHashtag} icon={faHashtag}
className="w-4 h-4 text-sky-500 dark:text-sky-300 mt-1" className="w-4 h-4 text-sky-500 dark:text-sky-500 mt-1"
/> />
<p className="text-black dark:text-white truncate w-full pr-7"> <p className="text-black dark:text-white truncate w-full pr-7">
+2 -2
View File
@@ -37,7 +37,7 @@ export default function Collections() {
<div className="flex gap-2"> <div className="flex gap-2">
<FontAwesomeIcon <FontAwesomeIcon
icon={faFolder} icon={faFolder}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300 drop-shadow" className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-500 drop-shadow"
/> />
<p className="sm:text-4xl text-3xl capitalize text-black dark:text-white"> <p className="sm:text-4xl text-3xl capitalize text-black dark:text-white">
All Collections All Collections
@@ -125,7 +125,7 @@ export default function Collections() {
</p> </p>
<FontAwesomeIcon <FontAwesomeIcon
icon={faPlus} icon={faPlus}
className="w-8 h-8 text-sky-500 dark:text-sky-300 group-hover:w-12 group-hover:h-12 group-hover:-mt-10 duration-100" className="w-8 h-8 text-sky-500 dark:text-sky-500 group-hover:w-12 group-hover:h-12 group-hover:-mt-10 duration-100"
/> />
</div> </div>
</div> </div>
+5 -5
View File
@@ -52,7 +52,7 @@ export default function Dashboard() {
<div className="flex gap-2"> <div className="flex gap-2">
<FontAwesomeIcon <FontAwesomeIcon
icon={faChartSimple} icon={faChartSimple}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300 drop-shadow" className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-500 drop-shadow"
/> />
<p className="sm:text-4xl text-3xl text-black dark:text-white"> <p className="sm:text-4xl text-3xl text-black dark:text-white">
Dashboard Dashboard
@@ -62,7 +62,7 @@ export default function Dashboard() {
<div className="flex flex-col md:flex-row md:items-center gap-5"> <div className="flex flex-col md:flex-row md:items-center gap-5">
<div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800"> <div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800">
<p className="font-bold text-6xl text-sky-500 dark:text-sky-300"> <p className="font-bold text-6xl text-sky-500 dark:text-sky-500">
{numberOfLinks} {numberOfLinks}
</p> </p>
<p className="text-black dark:text-white text-xl"> <p className="text-black dark:text-white text-xl">
@@ -71,7 +71,7 @@ export default function Dashboard() {
</div> </div>
<div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800"> <div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800">
<p className="font-bold text-6xl text-sky-500 dark:text-sky-300"> <p className="font-bold text-6xl text-sky-500 dark:text-sky-500">
{collections.length} {collections.length}
</p> </p>
<p className="text-black dark:text-white text-xl"> <p className="text-black dark:text-white text-xl">
@@ -80,7 +80,7 @@ export default function Dashboard() {
</div> </div>
<div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800"> <div className="flex flex-col justify-center items-center gap-2 md:w-full rounded-2xl p-10 border border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-800">
<p className="font-bold text-6xl text-sky-500 dark:text-sky-300"> <p className="font-bold text-6xl text-sky-500 dark:text-sky-500">
{tags.length} {tags.length}
</p> </p>
<p className="text-black dark:text-white text-xl"> <p className="text-black dark:text-white text-xl">
@@ -93,7 +93,7 @@ export default function Dashboard() {
<div className="flex gap-2 items-center"> <div className="flex gap-2 items-center">
<FontAwesomeIcon <FontAwesomeIcon
icon={faThumbTack} icon={faThumbTack}
className="w-5 h-5 text-sky-500 dark:text-sky-300 drop-shadow" className="w-5 h-5 text-sky-500 dark:text-sky-500 drop-shadow"
/> />
<p className="text-2xl text-black dark:text-white">Pinned Links</p> <p className="text-2xl text-black dark:text-white">Pinned Links</p>
</div> </div>
+1 -1
View File
@@ -24,7 +24,7 @@ export default function Links() {
<div className="flex gap-2"> <div className="flex gap-2">
<FontAwesomeIcon <FontAwesomeIcon
icon={faLink} icon={faLink}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300 drop-shadow" className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-500 drop-shadow"
/> />
<p className="sm:text-4xl text-3xl capitalize text-black dark:text-white"> <p className="sm:text-4xl text-3xl capitalize text-black dark:text-white">
All Links All Links
+1 -1
View File
@@ -40,7 +40,7 @@ export default function Links() {
<div className="flex gap-2"> <div className="flex gap-2">
<FontAwesomeIcon <FontAwesomeIcon
icon={faSearch} icon={faSearch}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300 drop-shadow" className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-500 drop-shadow"
/> />
<p className="sm:text-4xl text-3xl capitalize text-black dark:text-white"> <p className="sm:text-4xl text-3xl capitalize text-black dark:text-white">
Search Results Search Results
+1 -1
View File
@@ -36,7 +36,7 @@ export default function Index() {
<div className="flex gap-2"> <div className="flex gap-2">
<FontAwesomeIcon <FontAwesomeIcon
icon={faHashtag} icon={faHashtag}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-300" className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 dark:text-sky-500"
/> />
<p className="sm:text-4xl text-3xl capitalize text-black dark:text-white"> <p className="sm:text-4xl text-3xl capitalize text-black dark:text-white">
{activeTag?.name} {activeTag?.name}