Fixed linter failing due to Tailwind class ordering

No ref
This commit is contained in:
Sanne de Vries 2023-05-30 15:58:26 +02:00
parent 30e2924b5e
commit 5df2403b61
2 changed files with 3 additions and 3 deletions

View File

@ -16,7 +16,7 @@ export const FormPage: React.FC = () => {
const description = options.description;
const logo = options.logo;
return <div className='bg-grey-200 flex h-[52vmax] min-h-[320px] flex-col items-center justify-center p-6 md:p-8'>
return <div className='flex h-[52vmax] min-h-[320px] flex-col items-center justify-center bg-grey-200 p-6 md:p-8'>
{logo && <img alt={title} src={logo} width='100' />}
{title && <h1 className="text-center text-lg font-bold sm:text-xl md:text-2xl lg:text-3xl">{title}</h1>}
{description && <p className='mb-5 text-center'>{description}</p>}
@ -60,7 +60,7 @@ const Form: React.FC = () => {
<>
<form className='relative flex w-full max-w-[440px]' onSubmit={submit}>
<input className={'flex-1 py-[1rem] pl-3 border rounded-[.5rem] hover:border-grey-400 transition focus-visible:border-grey-500 focus-visible:outline-none ' + borderStyle} data-testid="input" disabled={loading} placeholder='jamie@example.com' type="text" value={email} onChange={e => setEmail(e.target.value)}/>
<button className='bg-accent absolute inset-y-0 right-[.3rem] my-auto h-[3rem] rounded-[.3rem] px-3 py-2 text-white' data-testid="button" disabled={loading} type='submit'>Subscribe</button>
<button className='absolute inset-y-0 right-[.3rem] my-auto h-[3rem] rounded-[.3rem] bg-accent px-3 py-2 text-white' data-testid="button" disabled={loading} type='submit'>Subscribe</button>
</form>
{error && <p className='pt-0.5 text-red-500' data-testid="error-message">{error}</p>}
</>

View File

@ -14,7 +14,7 @@ export const SuccessPage: React.FC<SuccessPageProps> = ({email}) => {
<h1 className="text-xl font-bold">Now check your email!</h1>
</div>;
}
return <div className='bg-grey-200 flex h-[52vmax] min-h-[320px] flex-col items-center justify-center p-6 md:p-8' data-testid="success-page">
return <div className='flex h-[52vmax] min-h-[320px] flex-col items-center justify-center bg-grey-200 p-6 md:p-8' data-testid="success-page">
<h1 className='text-center text-lg font-bold sm:text-xl md:text-2xl lg:text-3xl'>Now check your email!</h1>
<p className='mb-5 text-center'>An email has been send to {email}.</p>
</div>;