Use prettier to order tailwind classes

This commit is contained in:
Luke Vella 2022-04-16 10:25:29 +01:00
parent c5c2816c3d
commit eee23c1bb5
52 changed files with 268 additions and 262 deletions

View file

@ -8,40 +8,40 @@ import Support from "./icons/support.svg";
const StandardLayout: React.FunctionComponent = ({ children, ...rest }) => {
return (
<div className="relative min-h-full lg:flex bg-gray-50" {...rest}>
<div className="bg-gray-100 border-b lg:border-b-0 px-4 py-2 lg:py-6 lg:px-4 lg:border-r lg:grow">
<div className="flex lg:float-right items-center lg:items-start lg:w-40 lg:flex-col">
<div className="grow lg:grow-0 lg:mb-8">
<div className="relative min-h-full bg-gray-50 lg:flex" {...rest}>
<div className="border-b bg-gray-100 px-4 py-2 lg:grow lg:border-b-0 lg:border-r lg:py-6 lg:px-4">
<div className="flex items-center lg:float-right lg:w-40 lg:flex-col lg:items-start">
<div className="grow lg:mb-8 lg:grow-0">
<Link href="/">
<a>
<Logo className="text-slate-500 transition-colors w-24 lg:w-28 hover:text-indigo-500 active:text-indigo-600" />
<Logo className="w-24 text-slate-500 transition-colors hover:text-indigo-500 active:text-indigo-600 lg:w-28" />
</a>
</Link>
</div>
<div className="flex shrink-0 lg:block lg:w-full text-sm lg:text-base items-center lg:pb-4 lg:mb-4">
<div className="flex shrink-0 items-center text-sm lg:mb-4 lg:block lg:w-full lg:pb-4 lg:text-base">
<Link passHref={true} href="/new">
<a className="flex items-center whitespace-nowrap hover:text-gray-600 hover:bg-gray-200 px-2 py-1 lg:-ml-2 rounded-md font-medium hover:no-underline space-x-2 text-gray-600 cursor-pointer transition-colors active:bg-gray-300">
<Pencil className="w-6 h-6 opacity-75" />
<a className="flex cursor-pointer items-center space-x-2 whitespace-nowrap rounded-md px-2 py-1 font-medium text-gray-600 transition-colors hover:bg-gray-200 hover:text-gray-600 hover:no-underline active:bg-gray-300 lg:-ml-2">
<Pencil className="h-6 w-6 opacity-75" />
<span className="hidden md:inline-block">New Poll</span>
</a>
</Link>
<a
href="https://blog.rallly.co"
className="flex items-center whitespace-nowrap hover:text-gray-600 hover:bg-gray-200 px-2 py-1 lg:-ml-2 rounded-md font-medium hover:no-underline space-x-2 text-gray-600 cursor-pointer transition-colors active:bg-gray-300"
className="flex cursor-pointer items-center space-x-2 whitespace-nowrap rounded-md px-2 py-1 font-medium text-gray-600 transition-colors hover:bg-gray-200 hover:text-gray-600 hover:no-underline active:bg-gray-300 lg:-ml-2"
>
<Newspaper className="w-6 h-6 opacity-75" />
<Newspaper className="h-6 w-6 opacity-75" />
<span className="hidden md:inline-block">Blog</span>
</a>
<Link passHref={true} href="/support">
<a className="flex items-center whitespace-nowrap hover:text-gray-600 hover:bg-gray-200 px-2 py-1 lg:-ml-2 rounded-md font-medium hover:no-underline space-x-2 text-gray-600 cursor-pointer transition-colors active:bg-gray-300">
<Support className="w-6 h-6 opacity-75" />
<a className="flex cursor-pointer items-center space-x-2 whitespace-nowrap rounded-md px-2 py-1 font-medium text-gray-600 transition-colors hover:bg-gray-200 hover:text-gray-600 hover:no-underline active:bg-gray-300 lg:-ml-2">
<Support className="h-6 w-6 opacity-75" />
<span className="hidden md:inline-block">Support</span>
</a>
</Link>
</div>
</div>
</div>
<div className="grow min-w-0">{children}</div>
<div className="min-w-0 grow">{children}</div>
</div>
);
};