Upgrade Tailwind to v4 (#491)

apps/yaak-client/components/CookieDialog.tsx

@@ -155,7 +155,7 @@ export const CookieDialog = ({ cookieJarId }: Props) => {
           rightSlot={
             filter.length > 0 && (
               <IconButton
-                className="!bg-transparent !h-auto min-h-full opacity-50 hover:opacity-100 -mr-1"
+                className="bg-transparent! h-auto! min-h-full opacity-50 hover:opacity-100 -mr-1"
                 icon="x"
                 title="Clear filter"
                 onClick={() => {
@@ -239,7 +239,7 @@ export const CookieDialog = ({ cookieJarId }: Props) => {
                         <TableCell className={classNames("pl-2", isSelected && "rounded-l")}>
                           {c.name}
                         </TableCell>
-                        <TruncatedWideTableCell className="min-w-[10rem]">
+                        <TruncatedWideTableCell className="min-w-40">
                           {c.value}
                         </TruncatedWideTableCell>
                         <TableCell>{cookieDomain(c)}</TableCell>
@@ -547,7 +547,7 @@ function CookieEditor({
 }
 
 function CookieKeyValueRow({ labelClassName, ...props }: ComponentProps<typeof KeyValueRow>) {
-  return <KeyValueRow labelClassName={classNames("w-[7rem]", labelClassName)} {...props} />;
+  return <KeyValueRow labelClassName={classNames("w-28", labelClassName)} {...props} />;
 }
 
 function CookieTextInput({
@@ -589,7 +589,7 @@ function CookieTextarea({ onChange, value }: { onChange: (value: string) => void
     <textarea
       autoCapitalize="off"
       autoCorrect="off"
-      className={classNames(cookieInputClassName, "min-h-[5rem] resize-y")}
+      className={classNames(cookieInputClassName, "min-h-20 resize-y")}
       onChange={(event) => onChange(event.target.value)}
       value={value}
     />
@@ -600,7 +600,7 @@ const NEW_COOKIE_KEY = "__new-cookie__";
 const NON_EMPTY_INPUT_PATTERN = ".*\\S.*";
 const cookieInputClassName = classNames(
   "x-theme-input w-full min-w-0 min-h-sm rounded-md bg-transparent",
-  "border border-border-subtle outline-none",
+  "border border-border-subtle outline-hidden",
   "px-2 text-xs font-mono cursor-text placeholder:text-placeholder",
   "focus:border-border-focus invalid:border-danger",
   "disabled:opacity-disabled disabled:border-dotted",