Add a custom rule to prevent colors from being hardcoded outside of theme (#288)

* Add a custom rule to prevent colors from being hardcoded in ESLint

* Refactor colors

* Create packages folder and fix colors

* Remove external dependency for css alphabetical order linting

* Fix install with yarn

---------

Co-authored-by: Charles Bochet <charles@twenty.com>

packages/eslint-plugin-twenty/rules/no-hardcoded-colors.js

@@ -0,0 +1,24 @@
+module.exports = {
+  create: function (context) {
+    return {
+      TaggedTemplateExpression(node) {
+        if (context.getFilename().endsWith('themes.ts')) {
+          return;
+        }
+
+        node.quasi.quasis.forEach((quasi) => {
+          const colorRegex =
+            /(?:rgba?\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})(,\s*\d+\.?\d*)?\))|(?:#[0-9a-fA-F]{6})/i;
+
+          if (colorRegex.test(quasi.value.raw)) {
+            context.report({
+              node,
+              message:
+                'Do not use hardcoded RGBA or Hex colors. Please use a color from the theme file.',
+            });
+          }
+        });
+      },
+    };
+  },
+};