PR #35284: chore: workflow header action button affordances

• Repository: langgenius/dify
• Author: hjlarry
• State: open | merged: False
• Link: https://github.com/langgenius/dify/pull/35284

Description (problem / solution / changelog)

[!IMPORTANT]

1. Make sure you have read our contribution guidelines
2. Ensure there is an associated issue and you have been assigned to it
3. Use the correct syntax to link this PR: Fixes #<issue number>.

Summary

fix: https://github.com/langgenius/dify/issues/35295

This change refines the workflow header action buttons to make their behavior and visual affordances more consistent.

• Aligned the Chat Variables, Environment Variables, and System Variables header buttons with the Run History icon button interaction pattern.
• Updated their active state styling so selected panels are clearly indicated in both light and dark themes.
• Added tooltips and accessible labels to those header buttons for better discoverability and accessibility.
• Increased the size of the grouped action button container and added small spacing between the icons so the group matches neighboring header controls more closely.
• Added the same tooltip treatment to the Checklist trigger for consistency across header actions.

Screenshots

dark mode: <img width="840" height="446" alt="image" src="https://github.com/user-attachments/assets/07f69386-fecb-42af-b2b3-04912b9d7dd2" /> light mode: <img width="846" height="480" alt="image" src="https://github.com/user-attachments/assets/755d2951-b53d-42a8-acc4-a3c60955c5fe" /> mouse hover: <img width="444" height="226" alt="image" src="https://github.com/user-attachments/assets/d882ae1e-65aa-4da9-87e7-922f17666c2c" />

Checklist

• This change requires a documentation update, included: Dify Document
• I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
• I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
• I've updated the documentation accordingly.
• I ran make lint && make type-check (backend) and cd web && pnpm exec vp staged (frontend) to appease the lint gods

Changed files

• web/app/components/workflow/header/__tests__/chat-variable-button.spec.tsx (modified, +7/-12)
• web/app/components/workflow/header/__tests__/env-button.spec.tsx (modified, +7/-11)
• web/app/components/workflow/header/__tests__/global-variable-button.spec.tsx (modified, +7/-11)
• web/app/components/workflow/header/chat-variable-button.tsx (modified, +31/-13)
• web/app/components/workflow/header/checklist/__tests__/index.spec.tsx (modified, +6/-0)
• web/app/components/workflow/header/checklist/index.tsx (modified, +38/-25)
• web/app/components/workflow/header/env-button.tsx (modified, +31/-13)
• web/app/components/workflow/header/global-variable-button.tsx (modified, +31/-13)
• web/app/components/workflow/header/header-in-normal.tsx (modified, +1/-1)