fix: tailwind prettier errors

apps/web/src/components/Publication/LensOpenActions/UnknownModule/Preview.tsx

@@ -22,13 +22,13 @@ const UnknownModulePreview: FC<UnknownModulePreviewProps> = ({ module }) => {
       <Card className="flex bg-gray-50 p-5" forceRounded>
         <div className="w-full space-y-1.5 text-left">
           <div className="flex items-center justify-between space-x-2">
-            <div className="flex items-center space-x-2 w-full">
+            <div className="flex w-full items-center space-x-2">
               <GetOpenActionModuleIcon
                 className="text-brand-500"
                 module={module}
               />
               {loading ? (
-                <div className="shimmer h-4 my-1.5 w-4/12 rounded-full" />
+                <div className="shimmer my-1.5 h-4 w-4/12 rounded-full" />
               ) : (
                 <b className="text-lg font-bold">
                   {data?.moduleMetadata?.metadata.title || 'Unknown Module'}

apps/web/src/components/Shared/Oembed/Embed.tsx

@@ -16,7 +16,7 @@ interface EmbedProps {
 
 const Embed: FC<EmbedProps> = ({ og, publicationId }) => {
   return (
-    <div className="mt-4 text-sm w-full md:w-4/6">
+    <div className="mt-4 w-full text-sm md:w-4/6">
       <Link
         href={og.url}
         onClick={(event) => {
@@ -44,7 +44,7 @@ const Embed: FC<EmbedProps> = ({ og, publicationId }) => {
             {!og.isLarge && og.image ? (
               <Image
                 alt="Thumbnail"
-                className="size-28 md:size-36 rounded-l-xl border-r dark:border-gray-700"
+                className="size-28 rounded-l-xl border-r md:size-36 dark:border-gray-700"
                 height={144}
                 onError={({ currentTarget }) => {
                   currentTarget.src = og.image as string;
@@ -64,7 +64,7 @@ const Embed: FC<EmbedProps> = ({ og, publicationId }) => {
                   </div>
                 ) : null}
                 {og.site ? (
-                  <div className="items-center space-x-2 pt-1.5 hidden md:flex">
+                  <div className="hidden items-center space-x-2 pt-1.5 md:flex">
                     {og.favicon ? (
                       <img
                         alt="Favicon"

apps/web/src/components/Shared/Sidebar/SidebarMenu.tsx

@@ -34,7 +34,7 @@ const SidebarMenu: FC<SidebarProps> = ({ items }) => {
           <>
             <Menu.Button
               className={cn(
-                'focus:border-brand-500 focus:ring-brand-400 w-full rounded-xl border border-gray-300 bg-white outline-none dark:border-gray-700 dark:bg-gray-800 text-left px-3 py-2 flex items-center space-x-2',
+                'focus:border-brand-500 focus:ring-brand-400 flex w-full items-center space-x-2 rounded-xl border border-gray-300 bg-white px-3 py-2 text-left outline-none dark:border-gray-700 dark:bg-gray-800',
                 {
                   'bg-gray-200 text-black dark:bg-gray-800 dark:text-white':
                     open,
@@ -47,7 +47,7 @@ const SidebarMenu: FC<SidebarProps> = ({ items }) => {
               <div>{selectedItem.title}</div>
             </Menu.Button>
             <MenuTransition>
-              <Menu.Items className="mt-2 absolute w-full z-10" static>
+              <Menu.Items className="absolute z-10 mt-2 w-full" static>
                 <Card forceRounded>
                   {menuItems.map((item) => (
                     <Menu.Item
@@ -57,7 +57,7 @@ const SidebarMenu: FC<SidebarProps> = ({ items }) => {
                           {
                             'dropdown-active': active || selectedItem === item
                           },
-                          'm-2 p-2 rounded-lg flex items-center space-x-2'
+                          'm-2 flex items-center space-x-2 rounded-lg p-2'
                         )
                       }
                       href={item.url}

apps/web/src/components/Shared/UserPreview.tsx

@@ -167,7 +167,7 @@ const UserPreview: FC<UserPreviewProps> = ({
         <HoverCard.Portal>
           <HoverCard.Content
             asChild
-            className="w-64 z-10"
+            className="z-10 w-64"
             side="bottom"
             sideOffset={5}
           >

package.json

@@ -26,7 +26,7 @@
   "devDependencies": {
     "husky": "^8.0.3",
     "prettier": "^3.1.1",
-    "prettier-plugin-tailwindcss": "^0.5.9",
+    "prettier-plugin-tailwindcss": "^0.5.10",
     "start-server-and-test": "^2.0.0",
     "turbo": "^1.11.2"
   },

packages/ui/src/Alert.tsx

@@ -57,7 +57,7 @@ export const Alert: FC<AlertProps> = ({
             leaveFrom="opacity-100 translate-y-0 sm:scale-100"
             leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
           >
-            <div className="inline-block w-full scale-100 space-y-6 rounded-xl bg-white p-5 text-left align-bottom shadow-xl transition-all dark:bg-gray-800 sm:max-w-sm sm:align-middle">
+            <div className="inline-block w-full scale-100 space-y-6 rounded-xl bg-white p-5 text-left align-bottom shadow-xl transition-all sm:max-w-sm sm:align-middle dark:bg-gray-800">
               <div className="space-y-2">
                 <b className="text-xl">{title}</b>
                 <p>{description}</p>

packages/ui/src/Modal.tsx

@@ -58,7 +58,7 @@ export const Modal: FC<ModalProps> = ({
                 { 'sm:max-w-3xl': size === 'md' },
                 { 'sm:max-w-lg': size === 'sm' },
                 { 'sm:max-w-sm': size === 'xs' },
-                'inline-block w-full scale-100 rounded-xl bg-white text-left align-bottom shadow-xl transition-all dark:bg-gray-800 sm:my-8 sm:align-middle'
+                'inline-block w-full scale-100 rounded-xl bg-white text-left align-bottom shadow-xl transition-all sm:my-8 sm:align-middle dark:bg-gray-800'
               )}
             >
               {title ? (

packages/ui/src/Tooltip.tsx

@@ -25,7 +25,7 @@ export const Tooltip: FC<TooltipProps> = ({
         </RadixTooltip.Trigger>
         <RadixTooltip.Portal>
           <RadixTooltip.Content
-            className="hidden !rounded-lg !text-xs !leading-6 tracking-wide sm:block bg-gray-700 text-white px-3 py-0.5 z-10"
+            className="z-10 hidden !rounded-lg bg-gray-700 px-3 py-0.5 !text-xs !leading-6 tracking-wide text-white sm:block"
             side={placement}
             sideOffset={5}
           >

prettier.config.js

@@ -7,6 +7,6 @@ module.exports = {
   trailingComma: 'none',
   singleQuote: true,
   tabWidth: 2,
-  endOfLine: 'lf'
-  // plugins: [require.resolve('prettier-plugin-tailwindcss')]
+  endOfLine: 'lf',
+  plugins: [require.resolve('prettier-plugin-tailwindcss')]
 };