style: add new tailwind prettier plugin (#2465)

This commit is contained in:
Ryan Cohen
2022-01-25 21:09:41 +09:00
committed by GitHub
parent 5b2a8f682b
commit 822ae9eec7
104 changed files with 737 additions and 734 deletions

View File

@@ -88,7 +88,7 @@ const TitleCard: React.FC<TitleCardProps> = ({
onCancel={closeModal}
/>
<div
className={`transition duration-300 transform-gpu outline-none cursor-default relative bg-gray-800 bg-cover rounded-xl ring-1 overflow-hidden ${
className={`relative transform-gpu cursor-default overflow-hidden rounded-xl bg-gray-800 bg-cover outline-none ring-1 transition duration-300 ${
showDetail
? 'scale-105 shadow-lg ring-gray-500'
: 'scale-100 shadow ring-gray-700'
@@ -111,9 +111,9 @@ const TitleCard: React.FC<TitleCardProps> = ({
role="link"
tabIndex={0}
>
<div className="absolute inset-0 w-full h-full overflow-hidden">
<div className="absolute inset-0 h-full w-full overflow-hidden">
<CachedImage
className="absolute inset-0 w-full h-full"
className="absolute inset-0 h-full w-full"
alt=""
src={
image
@@ -125,34 +125,34 @@ const TitleCard: React.FC<TitleCardProps> = ({
/>
<div className="absolute left-0 right-0 flex items-center justify-between p-2">
<div
className={`rounded-full z-40 pointer-events-none shadow ${
className={`pointer-events-none z-40 rounded-full shadow ${
mediaType === 'movie' ? 'bg-blue-500' : 'bg-purple-600'
}`}
>
<div className="flex items-center h-4 px-2 py-2 text-xs font-medium tracking-wider text-center text-white uppercase sm:h-5">
<div className="flex h-4 items-center px-2 py-2 text-center text-xs font-medium uppercase tracking-wider text-white sm:h-5">
{mediaType === 'movie'
? intl.formatMessage(globalMessages.movie)
: intl.formatMessage(globalMessages.tvshow)}
</div>
</div>
<div className="z-40 pointer-events-none">
<div className="pointer-events-none z-40">
{(currentStatus === MediaStatus.AVAILABLE ||
currentStatus === MediaStatus.PARTIALLY_AVAILABLE) && (
<div className="flex items-center justify-center w-4 h-4 text-white bg-green-400 rounded-full shadow sm:w-5 sm:h-5">
<CheckIcon className="w-3 h-3 sm:w-4 sm:h-4" />
<div className="flex h-4 w-4 items-center justify-center rounded-full bg-green-400 text-white shadow sm:h-5 sm:w-5">
<CheckIcon className="h-3 w-3 sm:h-4 sm:w-4" />
</div>
)}
{currentStatus === MediaStatus.PENDING && (
<div className="flex items-center justify-center w-4 h-4 text-white bg-yellow-500 rounded-full shadow sm:w-5 sm:h-5">
<BellIcon className="w-3 h-3 sm:w-4 sm:h-4" />
<div className="flex h-4 w-4 items-center justify-center rounded-full bg-yellow-500 text-white shadow sm:h-5 sm:w-5">
<BellIcon className="h-3 w-3 sm:h-4 sm:w-4" />
</div>
)}
{currentStatus === MediaStatus.PROCESSING && (
<div className="flex items-center justify-center w-4 h-4 text-white bg-indigo-500 rounded-full shadow sm:w-5 sm:h-5">
<div className="flex h-4 w-4 items-center justify-center rounded-full bg-indigo-500 text-white shadow sm:h-5 sm:w-5">
{inProgress ? (
<Spinner className="w-3 h-3" />
<Spinner className="h-3 w-3" />
) : (
<ClockIcon className="w-3 h-3 sm:w-4 sm:h-4" />
<ClockIcon className="h-3 w-3 sm:h-4 sm:w-4" />
)}
</div>
)}
@@ -167,8 +167,8 @@ const TitleCard: React.FC<TitleCardProps> = ({
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="absolute inset-0 z-40 flex items-center justify-center text-white bg-gray-800 bg-opacity-75 rounded-xl">
<Spinner className="w-10 h-10" />
<div className="absolute inset-0 z-40 flex items-center justify-center rounded-xl bg-gray-800 bg-opacity-75 text-white">
<Spinner className="h-10 w-10" />
</div>
</Transition>
@@ -184,13 +184,13 @@ const TitleCard: React.FC<TitleCardProps> = ({
<div className="absolute inset-0 overflow-hidden rounded-xl">
<Link href={mediaType === 'movie' ? `/movie/${id}` : `/tv/${id}`}>
<a
className="absolute inset-0 w-full h-full overflow-hidden text-left cursor-pointer"
className="absolute inset-0 h-full w-full cursor-pointer overflow-hidden text-left"
style={{
background:
'linear-gradient(180deg, rgba(45, 55, 72, 0.4) 0%, rgba(45, 55, 72, 0.9) 100%)',
}}
>
<div className="flex items-end w-full h-full">
<div className="flex h-full w-full items-end">
<div
className={`px-2 text-white ${
!showRequestButton ||
@@ -204,7 +204,7 @@ const TitleCard: React.FC<TitleCardProps> = ({
)}
<h1
className="text-xl font-bold leading-tight whitespace-normal"
className="whitespace-normal text-xl font-bold leading-tight"
style={{
WebkitLineClamp: 3,
display: '-webkit-box',
@@ -216,7 +216,7 @@ const TitleCard: React.FC<TitleCardProps> = ({
{title}
</h1>
<div
className="text-xs whitespace-normal"
className="whitespace-normal text-xs"
style={{
WebkitLineClamp:
!showRequestButton ||
@@ -247,7 +247,7 @@ const TitleCard: React.FC<TitleCardProps> = ({
e.preventDefault();
setShowRequestModal(true);
}}
className="w-full h-7"
className="h-7 w-full"
>
<DownloadIcon />
<span>{intl.formatMessage(globalMessages.request)}</span>