[ci] run stylelint as part of CI tests (#6143)

## Summary

Final PR continuing from

- https://github.com/Comfy-Org/ComfyUI_frontend/pull/5926
- https://github.com/Comfy-Org/ComfyUI_frontend/pull/5940

actually run stylelint in lint workflows.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6143-ci-run-stylelint-as-part-of-CI-and-pre-commit-hook-2916d73d3650811891bcc9f94379cc5f)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL@users.noreply.github.com>

.github/workflows/ci-lint-format.yaml

@@ -39,6 +39,9 @@ jobs:
       - name: Run ESLint with auto-fix
         run: pnpm lint:fix
 
+      - name: Run Stylelint with auto-fix
+        run: pnpm stylelint:fix
+
       - name: Run Prettier with auto-format
         run: pnpm format
 
@@ -63,6 +66,7 @@ jobs:
       - name: Final validation
         run: |
           pnpm lint
+          pnpm stylelint
           pnpm format:check
           pnpm knip
 

packages/design-system/src/css/style.css

@@ -200,7 +200,7 @@
   --node-stroke-executing: var(--color-blue-100);
   --text-secondary: var(--color-stone-100);
   --text-primary: var(--color-charcoal-700);
-  --input-surface: rgba(0, 0, 0, 0.15);
+  --input-surface: rgb(0 0 0 / 0.15);
 }
 
 .dark-theme {
@@ -247,7 +247,7 @@
   --node-stroke-executing: var(--color-blue-100);
   --text-secondary: var(--color-slate-100);
   --text-primary: var(--color-pure-white);
-  --input-surface: rgba(130, 130, 130, 0.1);
+  --input-surface: rgb(130 130 130 / 0.1);
 }
 
 @theme inline {
@@ -258,9 +258,15 @@
   --color-button-surface: var(--button-surface);
   --color-button-surface-contrast: var(--button-surface-contrast);
   --color-dialog-surface: var(--dialog-surface);
-  --color-interface-menu-component-surface-hovered: var(--interface-menu-component-surface-hovered);
-  --color-interface-menu-component-surface-selected: var(--interface-menu-component-surface-selected);
-  --color-interface-menu-keybind-surface-default: var(--interface-menu-keybind-surface-default);
+  --color-interface-menu-component-surface-hovered: var(
+    --interface-menu-component-surface-hovered
+  );
+  --color-interface-menu-component-surface-selected: var(
+    --interface-menu-component-surface-selected
+  );
+  --color-interface-menu-keybind-surface-default: var(
+    --interface-menu-keybind-surface-default
+  );
   --color-interface-panel-surface: var(--interface-panel-surface);
   --color-interface-stroke: var(--interface-stroke);
   --color-nav-background: var(--nav-background);
@@ -1174,7 +1180,7 @@ audio.comfy-audio.empty-audio-widget {
 }
 
 .isLOD .lg-node-header {
-  border-radius: 0px;
+  border-radius: 0;
   pointer-events: none;
 }
 

src/renderer/extensions/vueNodes/widgets/components/audio/AudioPreviewPlayer.vue

@@ -388,7 +388,7 @@ onUnmounted(() => {
 
 <style scoped>
 .audio-player-menu {
-  --p-tieredmenu-item-focus-background: rgba(255, 255, 255, 0.1);
-  --p-tieredmenu-item-active-background: rgba(255, 255, 255, 0.1);
+  --p-tieredmenu-item-focus-background: rgb(255 255 255 / 0.1);
+  --p-tieredmenu-item-active-background: rgb(255 255 255 / 0.1);
 }
 </style>