Move custom tailwind plugins out of tailwind.js file

Issue

Description

We have several custom plugins inside tailwind.js file, let’s move them out from there to src/theme/plugins.

Once they are in different files we should import them and add it to tailwind.js like this:

plugins: [
    require('tailwindcss/plugins/container')({
      // center: true,
      // padding: '1rem',
    }),
   require('src/theme/plugins/panel')(),
   require('src/theme/plugins/diagonalbg')(),
   // etc...
  ],

[klazbaba]

Not programming test. I just want to see it run before making my PR. Thanks very much @tureey

[crysfel]

@klazbaba based on the error and the source code you are showing… it looks to me that the problem might be the way you are exporting inside each plugin.

Without seeing that code it’s difficult to asses, but maybe you don’t need the extra () in each require, try just this:

plugins: [
  require('./src/theme/plugins/color'),
  require('./src/theme/plugins/height'),
  // etc...
],

In order to test all you have to do is yarn start and the app should load as usual.

yarn start does everything for you (compiles css, extracts i18n files, compiles i18n files, etc…).