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

@@ -40,11 +40,11 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
return (
<div className="relative z-40 mt-6 mb-12 lg:flex lg:items-end lg:justify-between lg:space-x-5">
<div className="flex items-end space-x-5 justify-items-end">
<div className="flex items-end justify-items-end space-x-5">
<div className="flex-shrink-0">
<div className="relative">
<img
className="w-24 h-24 bg-gray-600 rounded-full ring-1 ring-gray-700"
className="h-24 w-24 rounded-full bg-gray-600 ring-1 ring-gray-700"
src={user.avatar}
alt=""
/>
@@ -55,18 +55,18 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
</div>
</div>
<div className="pt-1.5">
<h1 className="flex flex-col mb-1 sm:items-center sm:flex-row">
<h1 className="mb-1 flex flex-col sm:flex-row sm:items-center">
<Link
href={
user.id === loggedInUser?.id ? '/profile' : `/users/${user.id}`
}
>
<a className="text-lg font-bold text-transparent sm:text-2xl bg-clip-text bg-gradient-to-br from-indigo-400 to-purple-400 hover:to-purple-200">
<a className="bg-gradient-to-br from-indigo-400 to-purple-400 bg-clip-text text-lg font-bold text-transparent hover:to-purple-200 sm:text-2xl">
{user.displayName}
</a>
</Link>
{user.email && user.displayName.toLowerCase() !== user.email && (
<span className="text-sm text-gray-400 sm:text-lg sm:ml-2">
<span className="text-sm text-gray-400 sm:ml-2 sm:text-lg">
({user.email})
</span>
)}
@@ -80,7 +80,7 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
</p>
</div>
</div>
<div className="flex flex-col-reverse mt-6 space-y-4 space-y-reverse justify-stretch lg:flex-row lg:justify-end lg:space-x-reverse lg:space-y-0 lg:space-x-3">
<div className="justify-stretch mt-6 flex flex-col-reverse space-y-4 space-y-reverse lg:flex-row lg:justify-end lg:space-y-0 lg:space-x-3 lg:space-x-reverse">
{(loggedInUser?.id === user.id ||
(user.id !== 1 && hasPermission(Permission.MANAGE_USERS))) &&
!isSettingsPage ? (

View File

@@ -160,7 +160,7 @@ const UserGeneralSettings: React.FC = () => {
{intl.formatMessage(messages.accounttype)}
</label>
<div className="mb-1 text-sm font-medium leading-5 text-gray-400 sm:mt-2">
<div className="flex items-center max-w-lg">
<div className="flex max-w-lg items-center">
{user?.userType === UserType.PLEX ? (
<Badge badgeType="warning">
{intl.formatMessage(messages.plexuser)}
@@ -178,7 +178,7 @@ const UserGeneralSettings: React.FC = () => {
{intl.formatMessage(messages.role)}
</label>
<div className="mb-1 text-sm font-medium leading-5 text-gray-400 sm:mt-2">
<div className="flex items-center max-w-lg">
<div className="flex max-w-lg items-center">
{user?.id === 1
? intl.formatMessage(messages.owner)
: hasPermission(Permission.ADMIN)
@@ -284,7 +284,7 @@ const UserGeneralSettings: React.FC = () => {
</label>
<div className="form-input">
<div className="flex flex-col">
<div className="flex items-center mb-4">
<div className="mb-4 flex items-center">
<input
type="checkbox"
checked={movieQuotaEnabled}
@@ -324,7 +324,7 @@ const UserGeneralSettings: React.FC = () => {
</label>
<div className="form-input">
<div className="flex flex-col">
<div className="flex items-center mb-4">
<div className="mb-4 flex items-center">
<input
type="checkbox"
checked={tvQuotaEnabled}
@@ -360,7 +360,7 @@ const UserGeneralSettings: React.FC = () => {
)}
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -148,7 +148,7 @@ const UserNotificationsDiscord: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -146,7 +146,7 @@ const UserEmailSettings: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -153,7 +153,7 @@ const UserPushbulletSettings: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -210,7 +210,7 @@ const UserPushoverSettings: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -184,7 +184,7 @@ const UserTelegramSettings: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -98,7 +98,7 @@ const UserWebPushSettings: React.FC = () => {
/>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -35,7 +35,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: intl.formatMessage(messages.email),
content: (
<span className="flex items-center">
<MailIcon className="h-4 mr-2" />
<MailIcon className="mr-2 h-4" />
{intl.formatMessage(messages.email)}
</span>
),
@@ -47,7 +47,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: intl.formatMessage(messages.webpush),
content: (
<span className="flex items-center">
<CloudIcon className="h-4 mr-2" />
<CloudIcon className="mr-2 h-4" />
{intl.formatMessage(messages.webpush)}
</span>
),
@@ -59,7 +59,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: 'Discord',
content: (
<span className="flex items-center">
<DiscordLogo className="h-4 mr-2" />
<DiscordLogo className="mr-2 h-4" />
Discord
</span>
),
@@ -70,7 +70,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: 'Pushbullet',
content: (
<span className="flex items-center">
<PushbulletLogo className="h-4 mr-2" />
<PushbulletLogo className="mr-2 h-4" />
Pushbullet
</span>
),
@@ -81,7 +81,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: 'Pushover',
content: (
<span className="flex items-center">
<PushoverLogo className="h-4 mr-2" />
<PushoverLogo className="mr-2 h-4" />
Pushover
</span>
),
@@ -92,7 +92,7 @@ const UserNotificationSettings: React.FC = ({ children }) => {
text: 'Telegram',
content: (
<span className="flex items-center">
<TelegramLogo className="h-4 mr-2" />
<TelegramLogo className="mr-2 h-4" />
Telegram
</span>
),

View File

@@ -162,7 +162,7 @@ const UserPasswordChange: React.FC = () => {
/>
)}
{data.hasPassword && user?.id === currentUser?.id && (
<div className="pb-6 form-row">
<div className="form-row pb-6">
<label htmlFor="currentPassword" className="text-label">
{intl.formatMessage(messages.currentpassword)}
</label>
@@ -222,7 +222,7 @@ const UserPasswordChange: React.FC = () => {
</div>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -115,7 +115,7 @@ const UserPermissions: React.FC = () => {
</div>
<div className="actions">
<div className="flex justify-end">
<span className="inline-flex ml-3 rounded-md shadow-sm">
<span className="ml-3 inline-flex rounded-md shadow-sm">
<Button
buttonType="primary"
type="submit"

View File

@@ -101,7 +101,7 @@ const UserProfile: React.FC = () => {
<>
<PageTitle title={user.displayName} />
{Object.keys(availableTitles).length > 0 && (
<div className="absolute left-0 right-0 z-0 -top-16 h-96">
<div className="absolute left-0 right-0 -top-16 z-0 h-96">
<ImageFader
key={user.id}
isDarker
@@ -123,9 +123,9 @@ const UserProfile: React.FC = () => {
{ type: 'and' }
)) && (
<div className="relative z-40">
<dl className="grid grid-cols-1 gap-5 mt-5 lg:grid-cols-3">
<div className="px-4 py-5 overflow-hidden bg-gray-800 bg-opacity-50 rounded-lg shadow ring-1 ring-gray-700 sm:p-6">
<dt className="text-sm font-bold text-gray-300 truncate">
<dl className="mt-5 grid grid-cols-1 gap-5 lg:grid-cols-3">
<div className="overflow-hidden rounded-lg bg-gray-800 bg-opacity-50 px-4 py-5 shadow ring-1 ring-gray-700 sm:p-6">
<dt className="truncate text-sm font-bold text-gray-300">
{intl.formatMessage(messages.totalrequests)}
</dt>
<dd className="mt-1 text-3xl font-semibold text-white">
@@ -133,14 +133,14 @@ const UserProfile: React.FC = () => {
</dd>
</div>
<div
className={`px-4 py-5 overflow-hidden bg-gray-800 bg-opacity-50 rounded-lg shadow ring-1 ${
className={`overflow-hidden rounded-lg bg-gray-800 bg-opacity-50 px-4 py-5 shadow ring-1 ${
quota.movie.restricted
? 'ring-red-500 from-red-900 to-transparent bg-gradient-to-t'
? 'bg-gradient-to-t from-red-900 to-transparent ring-red-500'
: 'ring-gray-700'
} sm:p-6`}
>
<dt
className={`text-sm font-bold truncate ${
className={`truncate text-sm font-bold ${
quota.movie.restricted ? 'text-red-500' : 'text-gray-300'
}`}
>
@@ -152,7 +152,7 @@ const UserProfile: React.FC = () => {
: intl.formatMessage(messages.movierequests)}
</dt>
<dd
className={`flex mt-1 text-sm items-center ${
className={`mt-1 flex items-center text-sm ${
quota.movie.restricted ? 'text-red-500' : 'text-white'
}`}
>
@@ -165,7 +165,7 @@ const UserProfile: React.FC = () => {
100
)}
useHeatLevel
className="w-8 h-8 mr-2"
className="mr-2 h-8 w-8"
/>
<div>
{intl.formatMessage(messages.requestsperdays, {
@@ -188,14 +188,14 @@ const UserProfile: React.FC = () => {
</dd>
</div>
<div
className={`px-4 py-5 overflow-hidden bg-gray-800 bg-opacity-50 rounded-lg shadow ring-1 ${
className={`overflow-hidden rounded-lg bg-gray-800 bg-opacity-50 px-4 py-5 shadow ring-1 ${
quota.tv.restricted
? 'ring-red-500 from-red-900 to-transparent bg-gradient-to-t'
? 'bg-gradient-to-t from-red-900 to-transparent ring-red-500'
: 'ring-gray-700'
} sm:p-6`}
>
<dt
className={`text-sm font-bold truncate ${
className={`truncate text-sm font-bold ${
quota.tv.restricted ? 'text-red-500' : 'text-gray-300'
}`}
>
@@ -207,7 +207,7 @@ const UserProfile: React.FC = () => {
: intl.formatMessage(messages.seriesrequest)}
</dt>
<dd
className={`flex items-center mt-1 text-sm ${
className={`mt-1 flex items-center text-sm ${
quota.tv.restricted ? 'text-red-500' : 'text-white'
}`}
>
@@ -220,7 +220,7 @@ const UserProfile: React.FC = () => {
100
)}
useHeatLevel
className="w-8 h-8 mr-2"
className="mr-2 h-8 w-8"
/>
<div>
{intl.formatMessage(messages.requestsperdays, {