mirrors/jellyseerr
1
0
Fork 0
mirror of https://github.com/fallenbagel/jellyseerr.git synced 2026-01-01 04:08:45 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): when PersonCard has no profilePath, correctly position name/role content

Browse Source
This commit is contained in:
sct
2021-02-03 07:56:26 +00:00
parent f54df214af
commit 3ffd5ab0ee
1 changed files with 19 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/PersonCard/index.tsx
View File

@@ -38,23 +38,21 @@ const PersonCard: React.FC<PersonCardProps> = ({
className={`relative ${
canExpand ? 'w-full' : 'w-36 sm:w-36 md:w-44'
} rounded-lg text-white shadow-lg transition ease-in-out duration-150 cursor-pointer transform-gpu ${
isHovered ? 'bg-gray-500 scale-105' : 'bg-gray-600 scale-100'
isHovered ? 'bg-gray-600 scale-105' : 'bg-gray-700 scale-100'
}`}
>
<div style={{ paddingBottom: '150%' }}>
<div className="absolute inset-0 flex flex-col items-center w-full h-full p-2">
{profilePath && (
<div className="relative flex justify-center w-full mt-2 mb-4 h-1/2">
{profilePath ? (
<img
src={`https://image.tmdb.org/t/p/w600_and_h900_bestv2${profilePath}`}
className="object-cover w-3/4 h-full bg-center bg-cover rounded-full"
alt=""
/>
</div>
)}
{!profilePath && (
) : (
<svg
className="mb-6 w-28 h-28 md:w-32 md:h-32"
className="h-full"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
@@ -66,6 +64,7 @@ const PersonCard: React.FC<PersonCardProps> = ({
/>
</svg>
)}
</div>
<div className="w-full text-center truncate">{name}</div>
{subName && (
<div
@@ -80,7 +79,7 @@ const PersonCard: React.FC<PersonCardProps> = ({
{subName}
</div>
)}
<div className="absolute bottom-0 left-0 right-0 h-12 rounded-b-lg bg-gradient-to-t from-gray-600" />
<div className="absolute bottom-0 left-0 right-0 h-12 rounded-b-lg bg-gradient-to-t from-gray-700" />
</div>
</div>
</div>