Bump tailwindcss from 3.4.17 to 4.1.16

app/views/converters/index.html.erb

@@ -92,7 +92,7 @@
           </div>
 
           <div class="mt-6" data-converter-target="output">
-            <div class="grid grid-cols-[1fr,auto] items-center">
+            <div class="grid grid-cols-[1fr_auto] items-center">
               <div class="text-gray-900 rounded-md px-3 py-1.5 text-sm font-medium" aria-controls="tabs-1-panel-1">Phlex</div>
               <button data-action="click->converter#copy" class="text-gray-900 bg-gray-100 hover:bg-gray-200 active:bg-gray-300 rounded-md ml-12 px-3 py-1.5 text-sm font-medium">
                 <i class="fas fa-copy"></i>

app/views/layouts/application.html.erb

@@ -33,7 +33,7 @@
     </div>
 
     <footer class="mt-16 mb-3 md:sticky md:bottom-0 bg-white">
-      <div class="max-w-screen-xl mx-auto w-full py-6 border-t border-gray-200 dark:border-gray-600">
+      <div class="max-w-(--breakpoint-xl) mx-auto w-full py-6 border-t border-gray-200 dark:border-gray-600">
         <div class="flex flex-col md:flex-row md:justify-between md:items-start items-center px-3 text-center md:text-left">
           <div class="text-sm">
             Phlexing - ERB to Phlex converter - Built by <a class="font-semibold" href="https://github.com/marcoroth" target="_blank">Marco Roth</a>

package.json

@@ -13,11 +13,14 @@
     "esbuild-rails": "^1.0.7",
     "postcss": "^8.5.6",
     "stimulus-use": "^0.52.3",
-    "tailwindcss": "^3.4.17",
+    "tailwindcss": "^4.1.16",
     "turbo_power": "^0.7.1"
   },
   "scripts": {
     "build": "node esbuild.config.mjs",
     "build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify"
+  },
+  "devDependencies": {
+    "chokidar": "^4.0.3"
   }
 }