refactor: set release poster to center on release page on mobile

BREAKING: disable all image rendering
This commit is contained in:
Kentai Radiquum 2025-03-25 20:39:25 +05:00
parent b79c07f4c2
commit d2b38dcbe2
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
3 changed files with 36 additions and 13 deletions

View file

@ -2,6 +2,7 @@ import { Card, Button } from "flowbite-react";
import { useState } from "react";
import Image from "next/image";
import { ReleaseInfoStreaming } from "./ReleaseInfo.LicensedPlatforms";
import { Poster } from "../ReleasePoster/Poster";
export const ReleaseInfoBasics = (props: {
release_id: number;
@ -14,14 +15,11 @@ export const ReleaseInfoBasics = (props: {
return (
<Card className="h-full row-span-2">
<div className="flex flex-col w-full h-full gap-4 lg:flex-row">
<Image
className="w-[285px] max-h-[385px] object-cover border border-gray-200 rounded-lg shadow-md dark:border-gray-700"
src={props.image}
alt=""
width={285}
height={385}
/>
<div className="flex flex-col w-full h-full gap-4 lg:grid lg:grid-cols-[1fr_2fr] items-center lg:items-start justify-center lg:justify-start">
<div className="relative flex items-center justify-center w-full overflow-hidden rounded-lg">
<Poster image={props.image} className="z-10 sm:scale-95 lg:scale-100" />
<Poster image={props.image} className="absolute top-0 left-0 w-full scale-125 opacity-75 blur-xl brightness-75" />
</div>
<div className="flex flex-col max-w-2xl gap-2 text-sm md:text-base">
<div className="flex flex-col gap-1">
<p className="text-xl font-bold text-black md:text-2xl dark:text-white">