Add possibility of overriding the tailwind.config.js (#11763)

* Add possibility of overriding the tailwind.config.js

* Add docs

* Add template comment

decidim-core/lib/decidim/assets/tailwind/instance.rb

@@ -30,7 +30,16 @@ def tailwind_variables
         end
 
         def tailwind_configuration_template
-          File.read(File.expand_path("tailwind.config.js.erb", __dir__))
+          File.read(configuration_template_path)
+        end
+
+        def configuration_template_path
+          @configuration_template_path ||= begin
+            original_path = File.expand_path("tailwind.config.js.erb", __dir__)
+            alternate_path = File.expand_path("config/tailwind.config.js.erb", app_path)
+
+            File.exist?(alternate_path) ? alternate_path : original_path
+          end
         end
 
         def app_path

decidim-core/lib/decidim/assets/tailwind/tailwind.config.js.erb

@@ -1,3 +1,10 @@
+// This file is automatically generated.
+// Do not edit this file, it will be overwritten
+//
+// If you want to modify it, follow instructions from
+// https://docs.decidim.org/en/develop/customize/styles
+//
+
 const { inherit, current, transparent, white } = require("tailwindcss/colors")
 
 const withOpacity =

docs/modules/customize/pages/styles.adoc

@@ -60,6 +60,14 @@ Decidim uses Webpacker to compile assets. There are two ways to customize CSS:
 
 We use http://sass-lang.com/guide[SASS, with SCSS syntax] as CSS preprocessor.
 
+== Tailwind CSS
+
+Decidim uses Taiwind CSS as a CSS framework, which has a default configuration that is being handled by `tailwind.config.js` in the root of your project.
+
+Since this file is being managed by Decidim, it will be impossible to customize it.
+
+You can override the default configuration by creating a file  `config/tailwind.config.js.erb` starting from the following https://github.com/decidim/decidim/blob/develop/decidim-core/lib/decidim/assets/tailwind/tailwind.config.js.erb[content]
+
 == Accessibility
 
 To maintain accesibility level, if you add new colors use a http://webaim.org/resources/contrastchecker/[Color contrast checker] (WCAG AA is mandatory, WCAG AAA is recommended)