shpaq/sct-overseerr
1
0
Fork 0
mirror of https://github.com/sct/overseerr.git synced 2025-09-17 17:24:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(frontend): invalid dom-nesting title card fix (#482)

Browse Source 
fix #476
This commit is contained in:
Alex Zoitos
2020-12-23 21:37:11 -05:00
committed by GitHub
parent 17518dbe7f
commit f2ebba7b1d
1 changed files with 145 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/TitleCard/index.tsx
View File

@@ -159,16 +159,17 @@ const TitleCard: React.FC<TitleCardProps> = ({
leaveFrom="opacity-100" leaveFrom="opacity-100"
leaveTo="opacity-0" leaveTo="opacity-0"
> >
<div>
<Link href={mediaType === 'movie' ? `/movie/${id}` : `/tv/${id}`}> <Link href={mediaType === 'movie' ? `/movie/${id}` : `/tv/${id}`}>
<a <a
className="absolute w-full text-left top-0 right-0 left-0 bottom-0 rounded-lg overflow-hidden cursor-pointer" className="absolute w-full h-full text-left top-0 right-0 left-0 bottom-0 rounded-lg overflow-hidden cursor-pointer"
style={{ style={{
background: background:
'linear-gradient(180deg, rgba(45, 55, 72, 0.4) 0%, rgba(45, 55, 72, 0.9) 100%)', 'linear-gradient(180deg, rgba(45, 55, 72, 0.4) 0%, rgba(45, 55, 72, 0.9) 100%)',
}} }}
> >
<div className="absolute bottom-0 w-full left-0 right-0"> <div className="flex items-end h-full w-full">
<div className="px-2 text-white"> <div className="px-2 pb-11 text-white">
{year && <div className="text-sm">{year}</div>} {year && <div className="text-sm">{year}</div>}
<h1 className="text-xl leading-tight whitespace-normal"> <h1 className="text-xl leading-tight whitespace-normal">
@@ -186,11 +187,13 @@ const TitleCard: React.FC<TitleCardProps> = ({
{summary} {summary}
</div> </div>
</div> </div>
<div className="flex justify-between left-0 bottom-0 right-0 top-0 px-2 py-2"> </div>
</a>
</Link>
<div className="absolute flex justify-between left-0 bottom-0 right-0 px-2 py-2">
<Link <Link
href={ href={mediaType === 'movie' ? `/movie/${id}` : `/tv/${id}`}
mediaType === 'movie' ? `/movie/${id}` : `/tv/${id}`
}
> >
<a className="cursor-pointer flex w-full h-7 text-center text-white bg-indigo-500 rounded-sm hover:bg-indigo-400 focus:border-indigo-700 focus:ring-indigo active:bg-indigo-700 transition ease-in-out duration-150"> <a className="cursor-pointer flex w-full h-7 text-center text-white bg-indigo-500 rounded-sm hover:bg-indigo-400 focus:border-indigo-700 focus:ring-indigo active:bg-indigo-700 transition ease-in-out duration-150">
<svg <svg
@@ -215,8 +218,7 @@ const TitleCard: React.FC<TitleCardProps> = ({
</svg> </svg>
</a> </a>
</Link> </Link>
{(!currentStatus || {(!currentStatus || currentStatus === MediaStatus.UNKNOWN) && (
currentStatus === MediaStatus.UNKNOWN) && (
<button <button
onClick={(e) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
@@ -306,8 +308,6 @@ const TitleCard: React.FC<TitleCardProps> = ({
)} )}
</div> </div>
</div> </div>
</a>
</Link>
</Transition> </Transition>
</div> </div>
</div> </div>