frontend: add load more button on index page. add title trimming for long release titles.

This commit is contained in:
Kentai Radiquum 2024-04-20 14:39:03 +05:00
parent 37d4b181f5
commit 2615c47f0c
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
4 changed files with 74 additions and 24 deletions

View file

@ -0,0 +1,14 @@
import { ReleaseCard } from "@/app/components/ReleaseCard/ReleaseCard";
export const CardList = (props) => {
return props.data.map((item) => {
return (
<ReleaseCard key={item.id}
id={item.id}
title={item.title_ru}
poster={item.image}
description={item.description}
/>
);
});
};

View file

@ -45,7 +45,7 @@ export const NavigationRail = () => {
<div>share</div>
</a> */}
<span className="max"></span>
<button className="circle transparent end-align" onClick={() => themeStore.changeTheme(themeStore.theme == "dark" ? "light" : "dark")}>
<button className="circle transparent" onClick={() => themeStore.changeTheme(themeStore.theme == "dark" ? "light" : "dark")}>
<i>palette</i>
</button>
</nav>

View file

@ -8,8 +8,8 @@ export const ReleaseCard = (props) => {
<article className="no-padding round fill" style={{"aspectRatio": "9/16"}}>
<img className="responsive large top-round" src={props.poster} />
<div className="padding">
<h6>{props.title}</h6>
<p>{props.description}</p>
<h6>{`${props.title.substring(0, 36)}${[...props.title].length > 36 ? "..." : ""}`}</h6>
<p>{`${props.description}${[...props.description].length > 160 ? "..." : ""}`}</p>
</div>
</article>
</Link>