fix: text overflow on release and collection link on mobile

This commit is contained in:
Kentai Radiquum 2024-08-23 00:43:18 +05:00
parent 32ff8bce0c
commit 5971b9c5ae
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
3 changed files with 26 additions and 11 deletions

View file

@ -32,12 +32,14 @@ export const CollectionLink = (props: any) => {
</div>
)}
</div>
<div className="absolute bottom-0 left-0 px-2 py-2 lg:translate-y-[100%] group-hover:lg:translate-y-0 transition-transform">
<p className="text-sm font-bold text-white transition-transform lg:-translate-y-[calc(100%_+_1rem)] group-hover:lg:translate-y-0 xl:text-base lg:text-lg">
{props.title}
</p>
<p className="text-xs text-white xl:text-base lg:text-lg right-2">
{props.description.substring(0, 300)}
<div className="absolute bottom-0 left-0 p-2 lg:translate-y-[100%] group-hover:lg:translate-y-0 transition-transform">
<div className="transition-transform lg:-translate-y-[calc(100%_+_1rem)] group-hover:lg:translate-y-0">
<p className="text-sm font-bold text-white md:text-base lg:text-lg xl:text-xl">
{props.title}
</p>
</div>
<p className="text-xs font-light text-white md:text-sm lg:text-base xl:text-lg">
{`${props.description.slice(0, 125)}${props.description.length > 125 ? "..." : ""}`}
</p>
</div>
</div>

View file

@ -93,19 +93,19 @@ export const ReleaseLink169 = (props: any) => {
</div>
)}
</div>
<div className="absolute bottom-0 left-0 px-2 py-2 lg:translate-y-[100%] group-hover:lg:translate-y-0 transition-transform">
<div className="absolute bottom-0 left-0 p-2 lg:translate-y-[100%] group-hover:lg:translate-y-0 transition-transform">
<div className="transition-transform lg:-translate-y-[calc(100%_+_1rem)] group-hover:lg:translate-y-0">
{props.genres && (
<p className="text-sm font-light text-white xl:text-base lg:text-lg">
<p className="text-xs font-light text-white md:text-sm lg:text-base xl:text-lg">
{props.genres}
</p>
)}
<p className="text-sm font-bold text-white xl:text-base lg:text-lg">
<p className="text-sm font-bold text-white md:text-base lg:text-lg xl:text-xl">
{props.title_ru}
</p>
</div>
<p className="text-xs text-white xl:text-base lg:text-lg right-2">
{props.description}
<p className="text-xs font-light text-white md:text-sm lg:text-base xl:text-lg">
{`${props.description.slice(0, 125)}${props.description.length > 125 ? "..." : ""}`}
</p>
</div>
</div>

13
public/changelog/3.1.1.md Normal file
View file

@ -0,0 +1,13 @@
# 3.1.1
## Добавлено
- Список жанров на карточке релиза
## Изменено
- Размер шрифта на карточках релиза и коллекции для разных разрешений
## Исправлено
- Наложение названия и описания на информацию релиза в карточке для мобильных устройств