Radiquum/AniX
1
0
Fork 0
mirror of https://github.com/Radiquum/AniX.git synced 2025-04-30 18:09:40 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add viewing of all collections of users, releases and favorite collections

Browse source
This commit is contained in:
Kentai Radiquum 2024-08-13 17:14:32 +05:00
parent c1204473ec
commit 3de552f271
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
6 changed files with 248 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/components/CollectionLink/CollectionLink.tsx
View file

@ -13,18 +13,18 @@ export const CollectionLink = (props: any) => {
}}
>
<div className="absolute flex flex-wrap items-start justify-start gap-0.5 sm:gap-1 left-2 top-2">
{props.is_favorite && (
<div className="flex items-center justify-center bg-pink-500 rounded-sm">
<span className="w-3 px-4 py-2.5 text-white sm:px-4 sm:py-3 xl:px-6 xl:py-4 iconify mdi--heart"></span>
</div>
)}
<Chip icon_name="material-symbols--favorite" name_2={props.favorites_count} />
<Chip icon_name="material-symbols--comment" name_2={props.comment_count} />
{props.is_private && (
<div className="flex items-center justify-center bg-yellow-400 rounded-sm">
<span className="w-3 px-4 py-2.5 text-white sm:px-4 sm:py-3 xl:px-6 xl:py-4 iconify mdi--lock"></span>
</div>
)}
<Chip icon_name="material-symbols--favorite" name_2={props.favorites_count} />
<Chip icon_name="material-symbols--comment" name_2={props.comment_count} />
{props.is_favorite && (
<div className="flex items-center justify-center bg-pink-500 rounded-sm">
<span className="w-3 px-4 py-2.5 text-white sm:px-4 sm:py-3 xl:px-6 xl:py-4 iconify mdi--heart"></span>
</div>
)}
</div>
<p className="absolute text-xs text-white xl:text-base lg:text-lg left-2 bottom-2 right-2">
{props.title}

33
app/components/CollectionsSection/CollectionsSection.tsx Normal file
View file

@ -0,0 +1,33 @@
import { CollectionLink } from "../CollectionLink/CollectionLink";
import { AddCollectionLink } from "../AddCollectionLink/AddCollectionLink";
export const CollectionsSection = (props: {
sectionTitle?: string;
content: any;
isMyCollections?: boolean;
}) => {
return (
<section>
{props.sectionTitle && (
<div className="flex justify-between px-4 py-2 border-b-2 border-black dark:border-white">
<h1 className="font-bold text-md sm:text-xl md:text-lg xl:text-xl">
{props.sectionTitle}
</h1>
</div>
)}
<div className="m-4">
<div className="grid justify-center sm:grid-cols-[repeat(auto-fit,minmax(400px,1fr))] grid-cols-[100%] gap-2">
{props.isMyCollections && <AddCollectionLink />}
{props.content.map((collection) => {
return (
<div key={collection.id} className="w-full h-full aspect-video">
<CollectionLink {...collection} />
</div>
);
})}
{props.content.length == 1 && !props.isMyCollections && <div></div>}
</div>
</div>
</section>
);
};