Inline the css-variables-parser dependency (#29571)

Get rid of the `postcss@7` dependency by inlining this simple function.

(cherry picked from commit d769b664dedb5f63b73146b58b21c0a772c2630d)

package-lock.json

@@ -24,7 +24,6 @@
         "chartjs-plugin-zoom": "2.0.1",
         "clippie": "4.0.7",
         "css-loader": "6.10.0",
-        "css-variables-parser": "1.0.1",
         "dayjs": "1.11.10",
         "dropzone": "6.0.0-beta.2",
         "easymde": "2.18.0",
@@ -4032,35 +4031,6 @@
         "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
       }
     },
-    "node_modules/css-variables-parser": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/css-variables-parser/-/css-variables-parser-1.0.1.tgz",
-      "integrity": "sha512-GWaqrwGtAWVr/yjjE17iyvbcy+W3voe0vko1/xLCwFeYd3kTLstzUdVH+g5TTXejrtlsb1FS4L9rP6PmeTa8wQ==",
-      "dependencies": {
-        "postcss": "^7.0.36"
-      }
-    },
-    "node_modules/css-variables-parser/node_modules/picocolors": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
-      "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA=="
-    },
-    "node_modules/css-variables-parser/node_modules/postcss": {
-      "version": "7.0.39",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
-      "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
-      "dependencies": {
-        "picocolors": "^0.2.1",
-        "source-map": "^0.6.1"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      }
-    },
     "node_modules/css-what": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz",

package.json

@@ -23,7 +23,6 @@
     "chartjs-plugin-zoom": "2.0.1",
     "clippie": "4.0.7",
     "css-loader": "6.10.0",
-    "css-variables-parser": "1.0.1",
     "dayjs": "1.11.10",
     "dropzone": "6.0.0-beta.2",
     "easymde": "2.18.0",

tailwind.config.js

@@ -1,9 +1,28 @@
 import {readFileSync} from 'node:fs';
 import {env} from 'node:process';
-import {parse} from 'css-variables-parser';
+import {parse} from 'postcss';
 
 const isProduction = env.NODE_ENV !== 'development';
 
+function extractRootVars(css) {
+  const root = parse(css);
+  const vars = new Set();
+  root.walkRules((rule) => {
+    if (rule.selector !== ':root') return;
+    rule.each((decl) => {
+      if (decl.value && decl.prop.startsWith('--')) {
+        vars.add(decl.prop.substring(2));
+      }
+    });
+  });
+  return Array.from(vars);
+}
+
+const vars = extractRootVars([
+  readFileSync(new URL('web_src/css/themes/theme-gitea-light.css', import.meta.url), 'utf8'),
+  readFileSync(new URL('web_src/css/themes/theme-gitea-dark.css', import.meta.url), 'utf8'),
+].join('\n'));
+
 export default {
   prefix: 'tw-',
   important: true, // the frameworks are mixed together, so tailwind needs to override other framework's styles
@@ -23,15 +42,10 @@ export default {
   theme: {
     colors: {
       // make `tw-bg-red` etc work with our CSS variables
-      ...Object.fromEntries(
+      ...Object.fromEntries(vars.filter((prop) => prop.startsWith('color-')).map((prop) => {
-        Object.keys(parse([
+        const color = prop.substring(6);
-          readFileSync(new URL('web_src/css/themes/theme-gitea-light.css', import.meta.url), 'utf8'),
+        return [color, `var(--color-${color})`];
-          readFileSync(new URL('web_src/css/themes/theme-gitea-dark.css', import.meta.url), 'utf8'),
+      })),
-        ].join('\n'), {})).filter((prop) => prop.startsWith('color-')).map((prop) => {
-          const color = prop.substring(6);
-          return [color, `var(--color-${color})`];
-        })
-      ),
       inherit: 'inherit',
       current: 'currentcolor',
       transparent: 'transparent',