UI improvements

This commit is contained in:
daniel31x13
2023-10-09 08:35:33 -04:00
parent 417252d65e
commit 48eb253cac
7 changed files with 38 additions and 22 deletions
+9 -1
View File
@@ -8,6 +8,7 @@ import ProfilePhoto from "./ProfilePhoto";
import { faCalendarDays } from "@fortawesome/free-regular-svg-icons";
import useModalStore from "@/store/modals";
import usePermissions from "@/hooks/usePermissions";
import { useTheme } from "next-themes";
type Props = {
collection: CollectionIncludingMembersAndLinkCount;
@@ -17,6 +18,8 @@ type Props = {
export default function CollectionCard({ collection, className }: Props) {
const { setModal } = useModalStore();
const { theme } = useTheme();
const formattedDate = new Date(collection.createdAt as string).toLocaleString(
"en-US",
{
@@ -32,7 +35,12 @@ export default function CollectionCard({ collection, className }: Props) {
return (
<div
className={`border border-solid border-sky-100 dark:border-neutral-700 bg-gradient-to-tr from-sky-100 dark:from-gray-800 from-10% via-gray-100 via-20% to-white dark:to-neutral-800 to-100% self-stretch min-h-[12rem] rounded-2xl shadow duration-100 hover:shadow-none hover:opacity-80 group relative ${className}`}
style={{
backgroundImage: `linear-gradient(45deg, ${collection.color}30 10%, ${
theme === "dark" ? "#262626" : "#f3f4f6"
} 50%, ${theme === "dark" ? "#262626" : "#f9fafb"} 100%)`,
}}
className={`border border-solid border-sky-100 dark:border-neutral-700 self-stretch min-h-[12rem] rounded-2xl shadow duration-100 hover:shadow-none hover:opacity-80 group relative ${className}`}
>
<div
onClick={() => setExpandDropdown(!expandDropdown)}
@@ -310,7 +310,7 @@ export default function TeamManagement({
<span
className={`text-black dark:text-white peer-checked:bg-sky-200 dark:peer-checked:bg-sky-600 text-sm ${
permissions === true
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-75"
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100"
: ""
} rounded p-1 select-none`}
>
@@ -355,7 +355,7 @@ export default function TeamManagement({
<span
className={`text-black dark:text-white peer-checked:bg-sky-200 dark:peer-checked:bg-sky-600 text-sm ${
permissions === true
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-75"
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100"
: ""
} rounded p-1 select-none`}
>
@@ -400,7 +400,7 @@ export default function TeamManagement({
<span
className={`text-black dark:text-white peer-checked:bg-sky-200 dark:peer-checked:bg-sky-600 text-sm ${
permissions === true
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-75"
? "hover:bg-slate-200 hover:dark:bg-neutral-700 duration-100"
: ""
} rounded p-1 select-none`}
>
+1 -1
View File
@@ -29,7 +29,7 @@ type Props = {
};
export default function LinkDetails({ link, isOwnerOrMod }: Props) {
const { theme, setTheme } = useTheme();
const { theme } = useTheme();
const [imageError, setImageError] = useState<boolean>(false);
const formattedDate = new Date(link.createdAt as string).toLocaleString(
+1 -1
View File
@@ -43,7 +43,7 @@ export default function ProfilePhoto({
src={src}
height={112}
width={112}
className={`h-10 w-10 shadow rounded-full aspect-square border border-slate-200 dark:border-neutral-700 ${className}`}
className={`h-10 w-10 bg-sky-600 dark:bg-sky-600 shadow rounded-full aspect-square border border-slate-200 dark:border-neutral-700 ${className}`}
/>
);
}