improved coloring

This commit is contained in:
Daniel 2023-08-22 18:34:46 -04:00
parent acc974ecfe
commit e47aef8123
19 changed files with 33 additions and 33 deletions

View File

@ -76,11 +76,11 @@ export default function CollectionCard({ collection, className }: Props) {
<div className="text-black dark:text-white font-bold text-sm flex justify-end gap-1 items-center">
<FontAwesomeIcon
icon={faLink}
className="w-5 h-5 text-black dark:text-white"
className="w-5 h-5 text-gray-500 dark:text-gray-300"
/>
{collection._count && collection._count.links}
</div>
<div className="flex items-center justify-end gap-1 text-gray-600 dark:text-white">
<div className="flex items-center justify-end gap-1 text-gray-500 dark:text-gray-300">
<FontAwesomeIcon icon={faCalendarDays} className="w-4 h-4" />
<p className="font-bold text-xs">{formattedDate}</p>
</div>

View File

@ -104,7 +104,7 @@ export default function CollectionInfo({
<div className="w-full">
<p className="text-sm text-black dark:text-white mb-2">Description</p>
<textarea
className="w-full h-[11.4rem] resize-none border rounded-md duration-100 bg-white dark:bg-neutral-950 p-2 outline-none border-sky-100 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600"
className="w-full h-[11.4rem] resize-none border rounded-md duration-100 bg-gray-50 dark:bg-neutral-950 p-2 outline-none border-sky-100 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600"
placeholder="The purpose of this Collection..."
value={collection.description}
onChange={(e) =>

View File

@ -51,7 +51,7 @@ export default function DeleteCollection({
<p className="text-red-500 font-bold text-center">Warning!</p>
<div className="max-h-[20rem] overflow-y-auto">
<div className="text-gray-500 dark:text-white">
<div className="text-black dark:text-white">
<p>
Please note that deleting the collection will permanently remove
all its contents, including the following:
@ -98,7 +98,7 @@ export default function DeleteCollection({
</div>
</>
) : (
<p className="text-gray-500 dark:text-white">
<p className="text-black dark:text-white">
Click the button below to leave the current collection:
</p>
)}

View File

@ -128,7 +128,7 @@ export default function TeamManagement({
}
/>
<p className="text-gray-500 dark:text-white text-sm">
<p className="text-gray-500 dark:text-gray-300 text-sm">
This will let <b>Anyone</b> to view this collection.
</p>
</>
@ -204,7 +204,7 @@ export default function TeamManagement({
{collection?.members[0]?.user && (
<>
<p className="text-center text-gray-500 dark:text-white text-xs sm:text-sm">
<p className="text-center text-gray-500 dark:text-gray-300 text-xs sm:text-sm">
(All Members have <b>Read</b> access to this collection.)
</p>
<div className="flex flex-col gap-3 rounded-md">
@ -219,7 +219,7 @@ export default function TeamManagement({
{permissions === true && (
<FontAwesomeIcon
icon={faClose}
className="absolute right-2 top-2 text-gray-500 dark:text-white h-4 hover:text-red-500 duration-100 cursor-pointer"
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"
title="Remove Member"
onClick={() => {
const updatedMembers = collection.members.filter(
@ -248,7 +248,7 @@ export default function TeamManagement({
</p>
</div>
</div>
<div className="flex sm:block items-center gap-5 min-w-[10rem]">
<div className="flex sm:block items-center justify-between gap-5 min-w-[10rem]">
<div>
<p
className={`font-bold text-sm text-black dark:text-white ${
@ -258,7 +258,7 @@ export default function TeamManagement({
Permissions
</p>
{permissions === true && (
<p className="text-xs text-gray-500 dark:text-white mb-2">
<p className="text-xs text-gray-500 dark:text-gray-300 mb-2">
(Click to toggle.)
</p>
)}
@ -268,7 +268,7 @@ export default function TeamManagement({
!e.canCreate &&
!e.canUpdate &&
!e.canDelete ? (
<p className="text-sm text-gray-500 dark:text-white">
<p className="text-sm text-gray-500 dark:text-gray-300">
Has no permissions.
</p>
) : (

View File

@ -228,7 +228,7 @@ export default function AddOrEditLink({
? "Will be auto generated if nothing is provided."
: ""
}
className="resize-none w-full rounded-md p-2 border-sky-100 dark:border-neutral-700 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-sky-100 bg-gray-50 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600 border-solid border outline-none duration-100 dark:bg-neutral-950"
/>
</div>
</div>

View File

@ -235,7 +235,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
<FontAwesomeIcon icon={faFileImage} className="w-6 h-6" />
</div>
<p className="text-gray-500 dark:text-white">Screenshot</p>
<p className="text-black dark:text-white">Screenshot</p>
</div>
<div className="flex text-black dark:text-white gap-1">
@ -269,7 +269,7 @@ export default function LinkDetails({ link, isOwnerOrMod }: Props) {
<FontAwesomeIcon icon={faFilePdf} className="w-6 h-6" />
</div>
<p className="text-gray-500 dark:text-white">PDF</p>
<p className="text-black dark:text-white">PDF</p>
</div>
<div className="flex text-black dark:text-white gap-1">

View File

@ -144,7 +144,7 @@ export default function PrivacySettings({
visibility to your profile. Separated by comma.
</p>
<textarea
className="w-full resize-none border rounded-md duration-100 bg-white dark:bg-neutral-950 p-2 outline-none border-sky-100 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600"
className="w-full resize-none border rounded-md duration-100 bg-gray-50 dark:bg-neutral-950 p-2 outline-none border-sky-100 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600"
placeholder="Your profile is hidden from everyone right now..."
value={whitelistedUsersTextbox}
onChange={(e) => {

View File

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

View File

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

View File

@ -44,7 +44,7 @@ export default function Search() {
router.push("/search/" + encodeURIComponent(searchQuery))
}
autoFocus={searchBox}
className="border border-sky-100 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600 rounded-md pl-10 py-2 pr-2 w-44 sm:w-60 dark:hover:border-neutral-600 md:focus:w-80 hover:border-sky-300 duration-100 outline-none dark:bg-neutral-950"
className="border border-sky-100 bg-gray-50 dark:border-neutral-700 focus:border-sky-300 dark:focus:border-sky-600 rounded-md pl-10 py-2 pr-2 w-44 sm:w-60 dark:hover:border-neutral-600 md:focus:w-80 hover:border-sky-300 duration-100 outline-none dark:bg-neutral-950"
/>
</div>
);

View File

@ -114,7 +114,7 @@ export default function Sidebar({ className }: { className?: string }) {
onClick={() => {
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-white mt-5"
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"
>
<p>Collections</p>
@ -164,7 +164,7 @@ export default function Sidebar({ className }: { className?: string }) {
<div
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-white text-xs font-semibold truncate w-full pr-7">
<p className="text-gray-500 dark:text-gray-300 text-xs font-semibold truncate w-full pr-7">
You Have No Collections...
</p>
</div>
@ -177,7 +177,7 @@ export default function Sidebar({ className }: { className?: string }) {
onClick={() => {
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-white mt-5"
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"
>
<p>Tags</p>
<FontAwesomeIcon
@ -223,7 +223,7 @@ export default function Sidebar({ className }: { className?: string }) {
<div
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-white text-xs font-semibold truncate w-full pr-7">
<p className="text-gray-500 dark:text-gray-300 text-xs font-semibold truncate w-full pr-7">
You Have No Tags...
</p>
</div>

View File

@ -27,7 +27,7 @@ export default function TextInput({
value={value}
onChange={onChange}
onKeyDown={onKeyDown}
className={`w-full rounded-md p-2 border-sky-100 dark:border-neutral-700 dark:bg-neutral-950 border-solid border outline-none focus:border-sky-700 focus:dark:border-sky-600 duration-100 ${className}`}
className={`w-full rounded-md p-2 border-sky-100 dark:border-neutral-700 bg-gray-50 dark:bg-neutral-950 border-solid border outline-none focus:border-sky-300 focus:dark:border-sky-600 duration-100 ${className}`}
/>
);
}

View File

@ -125,7 +125,7 @@ const fileNotFoundTemplate = `<!DOCTYPE html>
<h2>It is possible that the file you're looking for either doesn't exist or hasn't been created yet.</h2>
<h3>Some possible reasons are:</h3>
<ul>
<li>You are trying to access a file too early, before it has been fully archived. In this case, refreshing the page might resolve the issue.</li>
<li>You are trying to access a file too early, before it has been fully archived. If that's the case, refreshing the page might resolve the issue.</li>
<li>The file doesn't exist either because it encountered an error while being archived, or it simply doesn't exist.</li>
</ul>
</body>

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@ -192,7 +192,7 @@
/* react-select */
@layer components {
.react-select-container .react-select__control {
@apply dark:bg-neutral-950 dark:border-neutral-700 dark:hover:border-neutral-500;
@apply dark:bg-neutral-950 bg-gray-50 dark:border-neutral-700 dark:hover:border-neutral-500;
}
.react-select-container {