Apply tailwindcss rules with `!important` (#29437)

As per discussion in https://github.com/go-gitea/gitea/pull/29423, I
think this is the right way that does not burden developers having to
think about CSS precedence which should be irrelevant with an atomic CSS
framework.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

diff --git a/tailwind.config.js b/tailwind.config.js
index 8c474c33a8ea458b12c87a75e7794b7268df5ce7..7f36822001b667b40ac52b4e44cdd09a21f81200 100644 (file)
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -6,6 +6,7 @@ const isProduction = env.NODE_ENV !== 'development';
 
 export default {
   prefix: 'tw-',
+  important: true, // the frameworks are mixed together, so tailwind needs to override other framework's styles
   content: [
     isProduction && '!./templates/devtest/**/*',
     isProduction && '!./web_src/js/standalone/devtest.js',