xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

improved contrast ratio

This commit is contained in:
Daniel 2023-07-22 17:49:09 -04:00
parent 43364b571a
commit 8eff4d23a7
34 changed files with 138 additions and 138 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/Checkbox.tsx
View File

@ -12,7 +12,7 @@ type Props = {
export default function Checkbox({ label, state, className, onClick }: Props) {
return (
<label
className={`cursor-pointer flex items-center gap-2 text-sky-500 ${className}`}
className={`cursor-pointer flex items-center gap-2 text-sky-700 ${className}`}
>
<input
type="checkbox"
@ -22,11 +22,11 @@ export default function Checkbox({ label, state, className, onClick }: Props) {
/>
<FontAwesomeIcon
icon={faSquareCheck}
className="w-5 h-5 text-sky-500 peer-checked:block hidden"
className="w-5 h-5 text-sky-700 peer-checked:block hidden"
/>
<FontAwesomeIcon
icon={faSquare}
className="w-5 h-5 text-sky-500 peer-checked:hidden block"
className="w-5 h-5 text-sky-700 peer-checked:hidden block"
/>
<span className="text-sky-900 rounded select-none">{label}</span>
</label>

10
components/CollectionCard.tsx
View File

@ -49,11 +49,11 @@ export default function CollectionCard({ collection, className }: Props) {
href={`/collections/${collection.id}`}
className="flex flex-col gap-2 justify-between min-h-[12rem] h-full select-none p-5"
>
<p className="text-2xl font-bold capitalize text-sky-500 break-words line-clamp-3 w-4/5">
<p className="text-2xl font-bold capitalize text-sky-700 break-words line-clamp-3 w-4/5">
{collection.name}
</p>
<div className="flex justify-between items-center">
<div className="text-sky-400 flex items-center w-full">
<div className="flex items-center w-full">
{collection.members
.sort((a, b) => (a.userId as number) - (b.userId as number))
.map((e, i) => {
@ -67,14 +67,14 @@ export default function CollectionCard({ collection, className }: Props) {
})
.slice(0, 4)}
{collection.members.length - 4 > 0 ? (
<div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-500 border-sky-100 -mr-3">
<div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-700 border-sky-100 -mr-3">
+{collection.members.length - 4}
</div>
) : null}
</div>
<div className="text-right w-40">
<div className="text-sky-500 font-bold text-sm flex justify-end gap-1 items-center">
<FontAwesomeIcon icon={faLink} className="w-5 h-5 text-sky-600" />
<div className="text-sky-700 font-bold text-sm flex justify-end gap-1 items-center">
<FontAwesomeIcon icon={faLink} className="w-5 h-5 text-sky-500" />
{collection._count && collection._count.links}
</div>
<div className="flex items-center justify-end gap-1 text-gray-600">

4
components/LinkCard.tsx
View File

@ -142,8 +142,8 @@ export default function LinkCard({ link, count, className }: Props) {
<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 items-baseline gap-1">
<p className="text-sm text-sky-400 font-bold">{count + 1}.</p>
<p className="text-lg text-sky-500 font-bold truncate capitalize w-full pr-8">
<p className="text-sm text-sky-500 font-bold">{count + 1}.</p>
<p className="text-lg text-sky-700 font-bold truncate capitalize w-full pr-8">
{link.name}
</p>
</div>

12
components/Modal/Collection/CollectionInfo.tsx
View File

@ -60,7 +60,7 @@ export default function CollectionInfo({
<div className="flex flex-col gap-3 sm:w-[35rem] w-80">
<div className="flex flex-col sm:flex-row gap-3">
<div className="w-full">
<p className="text-sm text-sky-500 mb-2">
<p className="text-sm text-sky-700 mb-2">
Name
<RequiredBadge />
</p>
@ -72,11 +72,11 @@ export default function CollectionInfo({
}
type="text"
placeholder="e.g. Example Collection"
className="w-full rounded-md p-3 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-3 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
<div className="color-picker flex justify-between">
<div className="flex flex-col justify-between items-center w-32">
<p className="text-sm w-full text-sky-500 mb-2">Icon Color</p>
<p className="text-sm w-full text-sky-700 mb-2">Icon Color</p>
<div style={{ color: collection.color }}>
<FontAwesomeIcon
icon={faFolder}
@ -84,7 +84,7 @@ export default function CollectionInfo({
/>
</div>
<div
className="py-1 px-2 rounded-md text-xs font-semibold cursor-pointer text-sky-500 hover:bg-slate-200 duration-100"
className="py-1 px-2 rounded-md text-xs font-semibold cursor-pointer text-sky-700 hover:bg-slate-200 duration-100"
onClick={() =>
setCollection({ ...collection, color: "#0ea5e9" })
}
@ -101,9 +101,9 @@ export default function CollectionInfo({
</div>
<div className="w-full">
<p className="text-sm text-sky-500 mb-2">Description</p>
<p className="text-sm text-sky-700 mb-2">Description</p>
<textarea
className="w-full h-[11.4rem] resize-none border rounded-md duration-100 bg-white p-3 outline-none border-sky-100 focus:border-sky-500"
className="w-full h-[11.4rem] resize-none border rounded-md duration-100 bg-white p-3 outline-none border-sky-100 focus:border-sky-700"
placeholder="The purpose of this Collection..."
value={collection.description}
onChange={(e) =>

4
components/Modal/Collection/DeleteCollection.tsx
View File

@ -83,7 +83,7 @@ export default function DeleteCollection({
<div className="flex flex-col gap-3">
<p className="text-sky-900 select-none text-center">
To confirm, type &quot;
<span className="font-bold text-sky-500">{collection.name}</span>
<span className="font-bold text-sky-700">{collection.name}</span>
&quot; in the box below:
</p>
@ -93,7 +93,7 @@ export default function DeleteCollection({
onChange={(e) => setInputField(e.target.value)}
type="text"
placeholder={`Type "${collection.name}" Here.`}
className="w-72 sm:w-96 rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-72 sm:w-96 rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
</>

24
components/Modal/Collection/TeamManagement.tsx
View File

@ -117,7 +117,7 @@ export default function TeamManagement({
<div className="flex flex-col gap-3 sm:w-[35rem] w-80">
{permissions === true && (
<>
<p className="text-sm text-sky-500">Make Public</p>
<p className="text-sm text-sky-700">Make Public</p>
<Checkbox
label="Make this a public collection."
@ -135,7 +135,7 @@ export default function TeamManagement({
{collection.isPublic ? (
<div>
<p className="text-sm text-sky-500 mb-2">
<p className="text-sm text-sky-700 mb-2">
Public Link (Click to copy)
</p>
<div
@ -148,7 +148,7 @@ export default function TeamManagement({
console.log(err);
}
}}
className="w-full hide-scrollbar overflow-x-auto whitespace-nowrap rounded-md p-3 border-sky-100 border-solid border outline-none hover:border-sky-500 duration-100 cursor-text"
className="w-full hide-scrollbar overflow-x-auto whitespace-nowrap rounded-md p-3 border-sky-100 border-solid border outline-none hover:border-sky-700 duration-100 cursor-text"
>
{publicCollectionURL}
</div>
@ -159,7 +159,7 @@ export default function TeamManagement({
{permissions === true && (
<>
<p className="text-sm text-sky-500">Member Management</p>
<p className="text-sm text-sky-700">Member Management</p>
<div className="flex items-center gap-2">
<input
@ -181,7 +181,7 @@ export default function TeamManagement({
}
type="text"
placeholder="Username (without the '@')"
className="w-full rounded-md p-3 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-3 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
<div
@ -193,7 +193,7 @@ export default function TeamManagement({
setMemberState
)
}
className="flex items-center justify-center bg-sky-500 hover:bg-sky-400 duration-100 text-white w-12 h-12 p-3 rounded-md cursor-pointer"
className="flex items-center justify-center bg-sky-700 hover:bg-sky-600 duration-100 text-white w-12 h-12 p-3 rounded-md cursor-pointer"
>
<FontAwesomeIcon icon={faUserPlus} className="w-5 h-5" />
</div>
@ -239,7 +239,7 @@ export default function TeamManagement({
className="border-[3px]"
/>
<div>
<p className="text-sm font-bold text-sky-500">
<p className="text-sm font-bold text-sky-700">
{e.user.name}
</p>
<p className="text-sky-900">@{e.user.username}</p>
@ -248,7 +248,7 @@ export default function TeamManagement({
<div className="flex sm:block items-center gap-5 min-w-[10rem]">
<div>
<p
className={`font-bold text-sm text-sky-500 ${
className={`font-bold text-sm text-sky-700 ${
permissions === true ? "" : "mb-2"
}`}
>
@ -305,7 +305,7 @@ export default function TeamManagement({
}}
/>
<span
className={`text-sky-900 peer-checked:bg-sky-500 text-sm ${
className={`text-sky-900 peer-checked:bg-sky-700 text-sm ${
permissions === true
? "hover:bg-slate-200 duration-75"
: ""
@ -350,7 +350,7 @@ export default function TeamManagement({
}}
/>
<span
className={`text-sky-900 peer-checked:bg-sky-500 text-sm ${
className={`text-sky-900 peer-checked:bg-sky-700 text-sm ${
permissions === true
? "hover:bg-slate-200 duration-75"
: ""
@ -395,7 +395,7 @@ export default function TeamManagement({
}}
/>
<span
className={`text-sky-900 peer-checked:bg-sky-500 text-sm ${
className={`text-sky-900 peer-checked:bg-sky-700 text-sm ${
permissions === true
? "hover:bg-slate-200 duration-75"
: ""
@ -425,7 +425,7 @@ export default function TeamManagement({
/>
<div>
<div className="flex items-center gap-1">
<p className="text-sm font-bold text-sky-500">
<p className="text-sm font-bold text-sky-700">
{collectionOwner.name}
</p>
<FontAwesomeIcon

4
components/Modal/Collection/index.tsx
View File

@ -46,9 +46,9 @@ export default function CollectionModal({
<div className={className}>
<Tab.Group defaultIndex={defaultIndex}>
{method === "CREATE" && (
<p className="text-xl text-sky-500 text-center">New Collection</p>
<p className="text-xl text-sky-700 text-center">New Collection</p>
)}
<Tab.List className="flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-600">
<Tab.List className="flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-700">
{method === "UPDATE" && (
<>
{isOwner && (

16
components/Modal/Link/AddOrEditLink.tsx
View File

@ -125,7 +125,7 @@ export default function AddOrEditLink({
<div className="grid sm:grid-cols-2 gap-3">
<div>
<p className="text-sm text-sky-500 mb-2">
<p className="text-sm text-sky-700 mb-2">
Name
<RequiredBadge />
</p>
@ -134,13 +134,13 @@ export default function AddOrEditLink({
onChange={(e) => setLink({ ...link, name: e.target.value })}
type="text"
placeholder="e.g. Example Link"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
{method === "CREATE" ? (
<div>
<p className="text-sm text-sky-500 mb-2">
<p className="text-sm text-sky-700 mb-2">
URL
<RequiredBadge />
</p>
@ -149,13 +149,13 @@ export default function AddOrEditLink({
onChange={(e) => setLink({ ...link, url: e.target.value })}
type="text"
placeholder="e.g. http://example.com/"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
) : null}
<div>
<p className="text-sm text-sky-500 mb-2">Collection</p>
<p className="text-sm text-sky-700 mb-2">Collection</p>
<CollectionSelection
onChange={setCollection}
// defaultValue={{
@ -174,7 +174,7 @@ export default function AddOrEditLink({
</div>
<div className={method === "UPDATE" ? "sm:col-span-2" : ""}>
<p className="text-sm text-sky-500 mb-2">Tags</p>
<p className="text-sm text-sky-700 mb-2">Tags</p>
<TagSelection
onChange={setTags}
defaultValue={link.tags.map((e) => {
@ -183,7 +183,7 @@ export default function AddOrEditLink({
/>
</div>
<div className="sm:col-span-2">
<p className="text-sm text-sky-500 mb-2">Description</p>
<p className="text-sm text-sky-700 mb-2">Description</p>
<textarea
value={link.description}
onChange={(e) => setLink({ ...link, description: e.target.value })}
@ -192,7 +192,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 border-solid border outline-none focus:border-sky-500 duration-100"
className="resize-none w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
</div>

14
components/Modal/Link/LinkDetails.tsx
View File

@ -151,7 +151,7 @@ export default function LinkDetails({ link }: Props) {
/>
)}
<div className="flex flex-col gap- justify-end drop-shadow">
<p className="text-2xl text-sky-500 capitalize break-words hyphens-auto">
<p className="text-2xl text-sky-700 capitalize break-words hyphens-auto">
{link.name}
</p>
<Link
@ -223,12 +223,12 @@ export default function LinkDetails({ link }: Props) {
<p className="text-gray-500">Screenshot</p>
</div>
<div className="flex text-sky-600 gap-1">
<div className="flex text-sky-500 gap-1">
<Link
href={`/api/archives/${link.collectionId}/${link.id}.png`}
target="_blank"
rel="noreferrer"
className="cursor-pointer hover:bg-sky-100 duration-100 p-2 rounded-md"
className="cursor-pointer hover:bg-slate-200 duration-100 p-2 rounded-md"
>
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
@ -238,7 +238,7 @@ export default function LinkDetails({ link }: Props) {
<div
onClick={() => handleDownload("png")}
className="cursor-pointer hover:bg-sky-100 duration-100 p-2 rounded-md"
className="cursor-pointer hover:bg-slate-200 duration-100 p-2 rounded-md"
>
<FontAwesomeIcon
icon={faCloudArrowDown}
@ -257,12 +257,12 @@ export default function LinkDetails({ link }: Props) {
<p className="text-gray-500">PDF</p>
</div>
<div className="flex text-sky-600 gap-1">
<div className="flex text-sky-500 gap-1">
<Link
href={`/api/archives/${link.collectionId}/${link.id}.pdf`}
target="_blank"
rel="noreferrer"
className="cursor-pointer hover:bg-sky-100 duration-100 p-2 rounded-md"
className="cursor-pointer hover:bg-slate-200 duration-100 p-2 rounded-md"
>
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
@ -272,7 +272,7 @@ export default function LinkDetails({ link }: Props) {
<div
onClick={() => handleDownload("pdf")}
className="cursor-pointer hover:bg-sky-100 duration-100 p-2 rounded-md"
className="cursor-pointer hover:bg-slate-200 duration-100 p-2 rounded-md"
>
<FontAwesomeIcon
icon={faCloudArrowDown}

4
components/Modal/Link/index.tsx
View File

@ -33,10 +33,10 @@ export default function LinkModal({
<div className={className}>
<Tab.Group defaultIndex={defaultIndex}>
{method === "CREATE" && (
<p className="text-xl text-sky-500 text-center">New Link</p>
<p className="text-xl text-sky-700 text-center">New Link</p>
)}
<Tab.List
className={`flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-600 ${
className={`flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-700 ${
isOwnerOrMod ? "" : "pb-8"
}`}
>

8
components/Modal/User/ChangePassword.tsx
View File

@ -81,23 +81,23 @@ export default function ChangePassword({
return (
<div className="mx-auto sm:w-[35rem] w-80">
<div className="max-w-[25rem] w-full mx-auto flex flex-col gap-3 justify-between">
<p className="text-sm text-sky-500">New Password</p>
<p className="text-sm text-sky-700">New Password</p>
<input
value={newPassword}
onChange={(e) => setNewPassword1(e.target.value)}
type="password"
placeholder="••••••••••••••"
className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
<p className="text-sm text-sky-500">Confirm New Password</p>
<p className="text-sm text-sky-700">Confirm New Password</p>
<input
value={newPassword2}
onChange={(e) => setNewPassword2(e.target.value)}
type="password"
placeholder="••••••••••••••"
className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-3 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
<SubmitButton

6
components/Modal/User/PrivacySettings.tsx
View File

@ -83,7 +83,7 @@ export default function PrivacySettings({
return (
<div className="flex flex-col gap-3 justify-between sm:w-[35rem] w-80">
<div>
<p className="text-sm text-sky-500 mb-2">Profile Visibility</p>
<p className="text-sm text-sky-700 mb-2">Profile Visibility</p>
<Checkbox
label="Make profile private"
@ -98,13 +98,13 @@ export default function PrivacySettings({
{user.isPrivate && (
<div>
<p className="text-sm text-sky-500 my-2">Whitelisted Users</p>
<p className="text-sm text-sky-700 my-2">Whitelisted Users</p>
<p className="text-gray-500 text-sm mb-3">
Please provide the Username of the users you wish to grant
visibility to your profile. Separated by comma.
</p>
<textarea
className="w-full resize-none border rounded-md duration-100 bg-white p-2 outline-none border-sky-100 focus:border-sky-500"
className="w-full resize-none border rounded-md duration-100 bg-white p-2 outline-none border-sky-100 focus:border-sky-700"
placeholder="Your profile is hidden from everyone right now..."
value={whitelistedUsersTextbox}
onChange={(e) => {

20
components/Modal/User/ProfileSettings.tsx
View File

@ -102,7 +102,7 @@ export default function ProfileSettings({
<div className="flex flex-col gap-3 justify-between sm:w-[35rem] w-80">
<div className="grid sm:grid-cols-2 gap-3 auto-rows-auto">
<div className="sm:row-span-2 sm:justify-self-center mx-auto mb-3">
<p className="text-sm text-sky-500 mb-2 text-center">Profile Photo</p>
<p className="text-sm text-sky-700 mb-2 text-center">Profile Photo</p>
<div className="w-28 h-28 flex items-center justify-center rounded-full relative">
<ProfilePhoto
src={user.profilePic}
@ -127,7 +127,7 @@ export default function ProfileSettings({
<label
htmlFor="upload-photo"
title="PNG or JPG (Max: 3MB)"
className="border border-slate-200 rounded-md bg-white px-2 text-center select-none cursor-pointer text-sky-900 duration-100 hover:border-sky-500"
className="border border-slate-200 rounded-md bg-white px-2 text-center select-none cursor-pointer text-sky-900 duration-100 hover:border-sky-700"
>
Browse...
<input
@ -145,33 +145,33 @@ export default function ProfileSettings({
<div className="flex flex-col gap-3">
<div>
<p className="text-sm text-sky-500 mb-2">Display Name</p>
<p className="text-sm text-sky-700 mb-2">Display Name</p>
<input
type="text"
value={user.name}
onChange={(e) => setUser({ ...user, name: e.target.value })}
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
<div>
<p className="text-sm text-sky-500 mb-2">Username</p>
<p className="text-sm text-sky-700 mb-2">Username</p>
<input
type="text"
value={user.username || ""}
onChange={(e) => setUser({ ...user, username: e.target.value })}
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
{emailEnabled ? (
<div>
<p className="text-sm text-sky-500 mb-2">Email</p>
<p className="text-sm text-sky-700 mb-2">Email</p>
<input
type="text"
value={user.email || ""}
onChange={(e) => setUser({ ...user, email: e.target.value })}
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
) : undefined}
@ -186,10 +186,10 @@ export default function ProfileSettings({
{/* <hr /> TODO: Export functionality
<p className="text-sky-600">Data Settings</p>
<p className="text-sky-700">Data Settings</p>
<div className="w-fit">
<div className="border border-sky-100 rounded-md bg-white px-2 py-1 text-center select-none cursor-pointer text-sky-900 duration-100 hover:border-sky-500">
<div className="border border-sky-100 rounded-md bg-white px-2 py-1 text-center select-none cursor-pointer text-sky-900 duration-100 hover:border-sky-700">
Export Data
</div>
</div> */}

2
components/Modal/User/index.tsx
View File

@ -27,7 +27,7 @@ export default function UserModal({
return (
<div className={className}>
<Tab.Group defaultIndex={defaultIndex}>
<Tab.List className="flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-600">
<Tab.List className="flex justify-center flex-col max-w-[15rem] sm:max-w-[30rem] mx-auto sm:flex-row gap-2 sm:gap-3 mb-5 text-sky-700">
<Tab
className={({ selected }) =>
selected

6
components/Navbar.tsx
View File

@ -36,7 +36,7 @@ export default function Navbar() {
<div className="flex justify-between gap-2 items-center px-5 py-2 border-solid border-b-sky-100 border-b h-16">
<div
onClick={toggleSidebar}
className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-[0.687rem] text-gray-500 rounded-md duration-100 hover:bg-slate-200"
className="inline-flex lg:hidden gap-1 items-center select-none cursor-pointer p-[0.687rem] text-sky-700 rounded-md duration-100 hover:bg-slate-200"
>
<FontAwesomeIcon icon={faBars} className="w-5 h-5" />
</div>
@ -50,7 +50,7 @@ export default function Navbar() {
method: "CREATE",
});
}}
className="inline-flex gap-1 relative sm:w-[7.2rem] items-center font-semibold select-none cursor-pointer p-[0.687rem] sm:p-2 sm:px-3 rounded-md sm:rounded-full hover:bg-sky-100 text-sky-500 sm:text-white sm:bg-sky-500 sm:hover:bg-sky-400 duration-100 group"
className="inline-flex gap-1 relative sm:w-[7.2rem] items-center font-semibold select-none cursor-pointer p-[0.687rem] sm:p-2 sm:px-3 rounded-md sm:rounded-full hover:bg-sky-100 text-sky-700 sm:text-white sm:bg-sky-700 sm:hover:bg-sky-600 duration-100 group"
>
<FontAwesomeIcon
icon={faPlus}
@ -73,7 +73,7 @@ export default function Navbar() {
/>
<p
id="profile-dropdown"
className="font-bold text-sky-500 leading-3 hidden sm:block select-none truncate max-w-[8rem] py-1"
className="font-bold text-sky-700 leading-3 hidden sm:block select-none truncate max-w-[8rem] py-1"
>
{account.name}
</p>

4
components/NoLinksFound.tsx
View File

@ -8,7 +8,7 @@ export default function NoLinksFound() {
return (
<div className="border border-solid border-sky-100 w-full p-10 rounded-2xl">
<p className="text-center text-3xl text-sky-500">
<p className="text-center text-3xl text-sky-700">
You haven&apos;t created any Links Here
</p>
<br />
@ -22,7 +22,7 @@ export default function NoLinksFound() {
method: "CREATE",
});
}}
className="inline-flex gap-1 relative w-[7.2rem] items-center font-semibold select-none cursor-pointer p-2 px-3 rounded-full text-white bg-sky-500 hover:bg-sky-400 duration-100 group"
className="inline-flex gap-1 relative w-[7.2rem] items-center font-semibold select-none cursor-pointer p-2 px-3 rounded-full text-white bg-sky-700 hover:bg-sky-600 duration-100 group"
>
<FontAwesomeIcon
icon={faPlus}

6
components/PublicPage/LinkCard.tsx
View File

@ -58,8 +58,8 @@ export default function LinkCard({ link, count }: Props) {
<div className="flex justify-between items-center gap-5 w-full h-full z-0">
<div className="flex flex-col justify-between">
<div className="flex items-baseline gap-1">
<p className="text-sm text-sky-400 font-bold">{count + 1}.</p>
<p className="text-lg text-sky-500 font-bold">{link.name}</p>
<p className="text-sm text-sky-500 font-bold">{count + 1}.</p>
<p className="text-lg text-sky-700 font-bold">{link.name}</p>
</div>
<p className="text-gray-500 text-sm font-medium">
@ -79,7 +79,7 @@ export default function LinkCard({ link, count }: Props) {
</div>
<div className="flex gap-2 items-center flex-wrap mt-2">
<p className="text-gray-500">{formattedDate}</p>
<div className="text-sky-400 font-bold flex items-center gap-1">
<div className="text-sky-500 font-bold flex items-center gap-1">
<p>{url ? url.host : link.url}</p>
</div>
</div>

4
components/RadioButton.tsx
View File

@ -20,11 +20,11 @@ export default function RadioButton({ label, state, onClick }: Props) {
/>
<FontAwesomeIcon
icon={faCircleCheck}
className="w-5 h-5 text-sky-500 peer-checked:block hidden"
className="w-5 h-5 text-sky-700 peer-checked:block hidden"
/>
<FontAwesomeIcon
icon={faCircle}
className="w-5 h-5 text-sky-500 peer-checked:hidden block"
className="w-5 h-5 text-sky-700 peer-checked:hidden block"
/>
<span className="text-sky-900 rounded select-none">{label}</span>
</label>

2
components/RequiredBadge.tsx
View File

@ -1,6 +1,6 @@
export default function RequiredBadge() {
return (
<span title="Required Field" className="text-sky-500 cursor-help">
<span title="Required Field" className="text-sky-700 cursor-help">
{" "}
*
</span>

4
components/Search.tsx
View File

@ -24,7 +24,7 @@ export default function Search() {
>
<label
htmlFor="search-box"
className="inline-flex w-fit absolute left-2 pointer-events-none rounded-md p-1 text-sky-500 group-hover:text-sky-600"
className="inline-flex w-fit absolute left-2 pointer-events-none rounded-md p-1 text-sky-500 group-hover:text-sky-700"
>
<FontAwesomeIcon icon={faMagnifyingGlass} className="w-5 h-5" />
</label>
@ -44,7 +44,7 @@ export default function Search() {
router.push("/search/" + encodeURIComponent(searchQuery))
}
autoFocus={searchBox}
className="border border-sky-100 rounded-md pl-10 py-2 pr-2 w-44 sm:w-60 focus:border-sky-500 md:focus:w-80 hover:border-sky-500 duration-100 outline-none"
className="border border-sky-100 rounded-md pl-10 py-2 pr-2 w-44 sm:w-60 focus:border-sky-700 md:focus:w-80 hover:border-sky-700 duration-100 outline-none"
/>
</div>
);

10
components/Sidebar.tsx
View File

@ -66,7 +66,7 @@ export default function Sidebar({ className }: { className?: string }) {
icon={faChartSimple}
className={`w-8 h-8 drop-shadow text-sky-500`}
/>
<p className="text-sky-500 text-xs font-semibold">Dashboard</p>
<p className="text-sky-700 text-xs font-semibold">Dashboard</p>
</Link>
<Link
@ -81,7 +81,7 @@ export default function Sidebar({ className }: { className?: string }) {
icon={faLink}
className={`w-8 h-8 drop-shadow text-sky-500`}
/>
<p className="text-sky-500 text-xs font-semibold">
<p className="text-sky-700 text-xs font-semibold">
<span className="hidden xl:inline-block">All</span> Links
</p>
</Link>
@ -96,7 +96,7 @@ export default function Sidebar({ className }: { className?: string }) {
icon={faFolder}
className={`w-8 h-8 drop-shadow text-sky-500`}
/>
<p className="text-sky-500 text-xs font-semibold">
<p className="text-sky-700 text-xs font-semibold">
<span className="hidden xl:inline-block">All</span> Collections
</p>
</Link>
@ -146,7 +146,7 @@ export default function Sidebar({ className }: { className?: string }) {
style={{ color: e.color }}
/>
<p className="text-sky-500 truncate w-full pr-7">
<p className="text-sky-700 truncate w-full pr-7">
{e.name}
</p>
</div>
@ -205,7 +205,7 @@ export default function Sidebar({ className }: { className?: string }) {
className="w-4 h-4 text-sky-500 mt-1"
/>
<p className="text-sky-500 truncate w-full pr-7">
<p className="text-sky-700 truncate w-full pr-7">
{e.name}
</p>
</div>

4
components/SubmitButton.tsx
View File

@ -20,8 +20,8 @@ export default function SubmitButton({
<div
className={`text-white flex items-center gap-2 py-2 px-5 rounded-md text-lg tracking-wide select-none font-semibold duration-100 w-fit ${
loading
? "bg-sky-400 cursor-auto"
: "bg-sky-500 hover:bg-sky-400 cursor-pointer"
? "bg-sky-600 cursor-auto"
: "bg-sky-700 hover:bg-sky-600 cursor-pointer"
} ${className}`}
onClick={() => {
if (!loading) onClick();

6
pages/choose-username.tsx
View File

@ -50,12 +50,12 @@ export default function Subscribe() {
className="h-12 w-fit mx-auto mt-10"
/>
<div className="p-2 mt-10 mx-auto flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 rounded-md border border-sky-100">
<p className="text-xl text-sky-500 w-fit font-bold">
<p className="text-xl text-sky-700 w-fit font-bold">
Choose a Username (Last step)
</p>
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Username
</p>
@ -64,7 +64,7 @@ export default function Subscribe() {
placeholder="john"
value={inputedUsername}
onChange={(e) => setInputedUsername(e.target.value)}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
<div>

10
pages/collections/[id].tsx
View File

@ -60,7 +60,7 @@ export default function Index() {
style={{ color: activeCollection?.color }}
className="sm:w-8 sm:h-8 w-6 h-6 mt-3 drop-shadow"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold w-full py-1 break-words hyphens-auto">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold w-full py-1 break-words hyphens-auto">
{activeCollection?.name}
</p>
</div>
@ -69,7 +69,7 @@ export default function Index() {
{activeCollection ? (
<div
className={`text-sky-400 min-w-[15rem] ${
className={`min-w-[15rem] ${
activeCollection.members[0] && "mr-3"
}`}
>
@ -87,7 +87,7 @@ export default function Index() {
className="flex justify-center sm:justify-end items-center w-fit mx-auto sm:mr-0 sm:ml-auto group cursor-pointer"
>
<div
className={`bg-sky-500 p-2 leading-3 select-none group-hover:bg-sky-400 duration-100 text-white rounded-full text-xs ${
className={`bg-sky-700 p-2 leading-3 select-none group-hover:bg-sky-600 duration-100 text-white rounded-full text-xs ${
activeCollection.members[0] && "mr-1"
}`}
>
@ -107,7 +107,7 @@ export default function Index() {
.slice(0, 4)}
{activeCollection?.members.length &&
activeCollection.members.length - 4 > 0 ? (
<div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-500 border-sky-100 -mr-3">
<div className="h-10 w-10 text-white flex items-center justify-center rounded-full border-[3px] bg-sky-700 border-sky-100 -mr-3">
+{activeCollection?.members?.length - 4}
</div>
) : null}
@ -116,7 +116,7 @@ export default function Index() {
) : null}
</div>
<div className="text-gray-500 flex justify-between items-end gap-5">
<div className="text-gray-600 flex justify-between items-end gap-5">
<p>{activeCollection?.description}</p>
<div className="flex items-center gap-2">
<div className="relative">

2
pages/collections/index.tsx
View File

@ -39,7 +39,7 @@ export default function Collections() {
icon={faFolder}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 drop-shadow"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
All Collections
</p>
</div>

22
pages/dashboard.tsx
View File

@ -85,7 +85,7 @@ export default function Dashboard() {
icon={faChartSimple}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 drop-shadow"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
Dashboard
</p>
</div>
@ -95,14 +95,14 @@ export default function Dashboard() {
<div className="flex flex-col md:flex-row md:items-center justify-evenly gap-2 mb-10">
<div className="flex items-baseline gap-2">
<p className="font-bold text-6xl text-sky-500">{numberOfLinks}</p>
<p className="font-bold text-6xl text-sky-700">{numberOfLinks}</p>
<p className="text-sky-900 text-xl">
{numberOfLinks === 1 ? "Link" : "Links"}
</p>
</div>
<div className="flex items-baseline gap-2">
<p className="font-bold text-6xl text-sky-500">
<p className="font-bold text-6xl text-sky-700">
{collections.length}
</p>
<p className="text-sky-900 text-xl">
@ -111,7 +111,7 @@ export default function Dashboard() {
</div>
<div className="flex items-baseline gap-2">
<p className="font-bold text-6xl text-sky-500">{tags.length}</p>
<p className="font-bold text-6xl text-sky-700">{tags.length}</p>
<p className="text-sky-900 text-xl">
{tags.length === 1 ? "Tag" : "Tags"}
</p>
@ -131,9 +131,9 @@ export default function Dashboard() {
}}
className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
>
<p className="text-sky-600 text-xl">Pinned Links</p>
<p className="text-sky-700 text-xl">Pinned Links</p>
<div className="text-sky-600 flex items-center gap-2">
<div className="text-sky-700 flex items-center gap-2">
{linkPinDisclosure ? "Hide" : "Show"}
<FontAwesomeIcon
icon={faChevronDown}
@ -164,7 +164,7 @@ export default function Dashboard() {
</Disclosure>
) : (
<div className="border border-solid border-sky-100 w-full mx-auto md:w-2/3 p-10 rounded-2xl">
<p className="text-center text-2xl text-sky-500">
<p className="text-center text-2xl text-sky-700">
No Pinned Links
</p>
<p className="text-center text-sky-900 text-sm">
@ -182,9 +182,9 @@ export default function Dashboard() {
}}
className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
>
<p className="text-sky-600 text-xl">Pinned Collections</p>
<p className="text-sky-700 text-xl">Pinned Collections</p>
<div className="text-sky-600 flex items-center gap-2">
<div className="text-sky-700 flex items-center gap-2">
{collectionPinDisclosure ? "Hide" : "Show"}
<FontAwesomeIcon
icon={faChevronDown}
@ -219,9 +219,9 @@ export default function Dashboard() {
}}
className="flex justify-between gap-2 items-baseline shadow active:shadow-inner duration-100 py-2 px-4 rounded-full"
>
<p className="text-sky-600 text-xl">Pinned Tags</p>
<p className="text-sky-700 text-xl">Pinned Tags</p>
<div className="text-sky-600 flex items-center gap-2">
<div className="text-sky-700 flex items-center gap-2">
{tagPinDisclosure ? "Hide" : "Show"}
<FontAwesomeIcon
icon={faChevronDown}

8
pages/forgot.tsx
View File

@ -47,7 +47,7 @@ export default function Forgot() {
className="h-12 w-fit mx-auto mt-10"
/>
<div className="p-2 mt-10 mx-auto flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 rounded-md border border-sky-100">
<p className="text-xl text-sky-500 w-fit font-bold">Fogot Password?</p>
<p className="text-xl text-sky-700 w-fit font-bold">Fogot Password?</p>
<p className="text-md text-gray-500 mt-1">
Enter your Email so we can send you a link to recover your account.
</p>
@ -55,14 +55,14 @@ export default function Forgot() {
Make sure to change your password in the profile settings afterwards.
</p>
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">Email</p>
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">Email</p>
<input
type="text"
placeholder="johnny@example.com"
value={form.email}
onChange={(e) => setForm({ ...form, email: e.target.value })}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
@ -73,7 +73,7 @@ export default function Forgot() {
loading={submitLoader}
/>
<div className="flex items-baseline gap-1 justify-center">
<Link href={"/login"} className="block text-sky-500 font-bold">
<Link href={"/login"} className="block text-sky-700 font-bold">
Go back
</Link>
</div>

2
pages/links.tsx
View File

@ -26,7 +26,7 @@ export default function Links() {
icon={faLink}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 drop-shadow"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
All Links
</p>
</div>

14
pages/login.tsx
View File

@ -53,15 +53,15 @@ export default function Login() {
alt="Linkwarden"
className="h-12 w-fit mx-auto mt-10"
/>
<p className="text-xl font-semibold text-sky-500 px-2 text-center">
<p className="text-xl font-semibold text-sky-700 px-2 text-center">
Sign in to your account
</p>
<div className="p-2 my-10 mx-auto flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 rounded-md border border-sky-100">
<p className="text-xl text-sky-500 w-fit font-bold">
<p className="text-xl text-sky-700 w-fit font-bold">
Enter your credentials
</p>
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Username
{emailEnabled ? "/Email" : undefined}
</p>
@ -71,12 +71,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-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Password
</p>
@ -85,7 +85,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-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
{emailEnabled && (
<div className="w-fit ml-auto mt-1">
@ -104,7 +104,7 @@ export default function Login() {
/>
<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-500 font-bold">
<Link href={"/register"} className="block text-sky-700 font-bold">
Sign Up
</Link>
</div>

4
pages/public/collections/[id].tsx
View File

@ -45,7 +45,7 @@ export default function PublicCollections() {
<div
className={`text-center bg-gradient-to-tr from-sky-100 from-10% via-gray-100 via-20% rounded-3xl shadow-lg p-5`}
>
<p className="text-5xl text-sky-500 font-bold mb-5 capitalize">
<p className="text-5xl text-sky-700 font-bold mb-5 capitalize">
{data.name}
</p>
@ -64,7 +64,7 @@ export default function PublicCollections() {
</div>
{/* <p className="text-center font-bold text-gray-500">
List created with <span className="text-sky-500">Linkwarden.</span>
List created with <span className="text-sky-700">Linkwarden.</span>
</p> */}
</div>
) : (

26
pages/register.tsx
View File

@ -97,7 +97,7 @@ export default function Register() {
alt="Linkwarden"
className="h-12 w-fit mx-auto mt-10"
/>
<p className="text-center px-2 text-xl font-semibold text-sky-500">
<p className="text-center px-2 text-xl font-semibold text-sky-700">
{process.env.NEXT_PUBLIC_STRIPE_IS_ACTIVE
? `Start using our premium services with a ${
process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14
@ -105,11 +105,11 @@ export default function Register() {
: "Create a new account"}
</p>
<div className="p-2 mx-auto my-10 flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 rounded-md border border-sky-100">
<p className="text-xl text-sky-500 w-fit font-bold">
<p className="text-xl text-sky-700 w-fit font-bold">
Enter your details
</p>
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Display Name
</p>
@ -118,13 +118,13 @@ export default function Register() {
placeholder="Johnny"
value={form.name}
onChange={(e) => setForm({ ...form, name: e.target.value })}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
{emailEnabled ? undefined : (
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Username
</p>
@ -133,14 +133,14 @@ export default function Register() {
placeholder="john"
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-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
)}
{emailEnabled ? (
<div>
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Email
</p>
@ -149,14 +149,14 @@ export default function Register() {
placeholder="johnny@example.com"
value={form.email}
onChange={(e) => setForm({ ...form, email: e.target.value })}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
) : undefined}
<div className="flex item-center gap-2">
<div className="w-full">
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Password
</p>
@ -165,12 +165,12 @@ export default function Register() {
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-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
<div className="w-full">
<p className="text-sm text-sky-500 w-fit font-semibold mb-1">
<p className="text-sm text-sky-700 w-fit font-semibold mb-1">
Confirm Password
</p>
@ -181,7 +181,7 @@ export default function Register() {
onChange={(e) =>
setForm({ ...form, passwordConfirmation: e.target.value })
}
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-500 duration-100"
className="w-full rounded-md p-2 mx-auto border-sky-100 border-solid border outline-none focus:border-sky-700 duration-100"
/>
</div>
</div>
@ -193,7 +193,7 @@ export default function Register() {
/>
<div className="flex items-baseline gap-1 justify-center">
<p className="w-fit text-gray-500">Already have an account?</p>
<Link href={"/login"} className="block text-sky-500 font-bold">
<Link href={"/login"} className="block text-sky-700 font-bold">
Login
</Link>
</div>

4
pages/search/[query].tsx
View File

@ -42,7 +42,7 @@ export default function Links() {
icon={faSearch}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500 drop-shadow"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
Search Results
</p>
</div>
@ -101,7 +101,7 @@ export default function Links() {
) : (
<p className="text-sky-900">
Nothing found.{" "}
<span className="text-sky-500 font-bold text-xl" title="Shruggie">
<span className="text-sky-700 font-bold text-xl" title="Shruggie">
¯\_(ツ)_/¯
</span>
</p>

2
pages/subscribe.tsx
View File

@ -33,7 +33,7 @@ export default function Subscribe() {
alt="Linkwarden"
className="h-12 w-fit mx-auto mt-10"
/>
<p className="text-xl font-semibold text-sky-500 text-center px-2">
<p className="text-xl font-semibold text-sky-700 text-center px-2">
{process.env.NEXT_PUBLIC_TRIAL_PERIOD_DAYS || 14} days free trial, then
${process.env.NEXT_PUBLIC_PRICING}/month afterwards
</p>

2
pages/tags/[id].tsx
View File

@ -38,7 +38,7 @@ export default function Index() {
icon={faHashtag}
className="sm:w-8 sm:h-8 w-6 h-6 mt-2 text-sky-500"
/>
<p className="sm:text-4xl text-3xl capitalize text-sky-500 font-bold">
<p className="sm:text-4xl text-3xl capitalize text-sky-700 font-bold">
{activeTag?.name}
</p>
</div>