refactor(alpine): restructure components and remove unused utilities for better modularity and maintainability

tailwind.config.js

@@ -1,5 +1,83 @@
 /** @type {import('tailwindcss').Config} */
 const { Icons } = require("tailwindcss-plugin-icons");
+
+const devcmActivityIcons = [
+  "folder",
+  "home",
+  "search",
+  "archive",
+  "script-text",
+  "article",
+  "book-open",
+  "file",
+  "file-alt",
+  "file-multiple",
+  "note",
+  "notes",
+  "label",
+  "label-alt",
+  "user",
+  "users",
+  "contact",
+  "git-branch",
+  "git-commit",
+  "git-merge",
+  "git-pull-request",
+  "github",
+  "link",
+  "external-link",
+  "open",
+  "code",
+  "command",
+  "bug",
+  "debug",
+  "server",
+  "cloud",
+  "monitor",
+  "device-laptop",
+  "dashboard",
+  "analytics",
+  "chart",
+  "chart-bar",
+  "kanban",
+  "timeline",
+  "mail",
+  "message",
+  "chat",
+  "comment",
+  "notification",
+  "calendar",
+  "clock",
+  "bookmark",
+  "heart",
+  "lightbulb",
+  "shield",
+  "lock",
+  "image",
+  "image-gallery",
+  "camera",
+  "music",
+  "video",
+  "shopping-bag",
+  "cart",
+  "wallet",
+  "map",
+  "pin",
+  "flag",
+  "power",
+  "upload",
+  "download",
+  "edit",
+  "trash",
+  "plus",
+  "close",
+  "sliders",
+  "sliders-2",
+  "visible",
+  "eye",
+  "eye-closed",
+];
+
 module.exports = {
   content: ["./templates/**/*.html", "./src/main.ts"],
   theme: {
@@ -12,9 +90,14 @@ module.exports = {
       pixelarticons: {
         includeAll: true,
       },
+      "radix-icons": {
+        icons: {
+          gear: {},
+        },
+      },
     })),
   ],
-  darkMode: ['class', '[data-color-scheme="dark"]'],
+  darkMode: ["class", '[data-color-scheme="dark"]'],
   safelist: [
     "prose-sm",
     "prose-base",
@@ -26,5 +109,6 @@ module.exports = {
     "prose-zinc",
     "prose-neutral",
     "prose-stone",
+    ...devcmActivityIcons.map((icon) => `i-pixelarticons-${icon}`),
   ],
-};
+};