🪟 fix: Windows Vite Build Issue

[danny-avila]

Summary

Issue Encountered:

We experienced a recurring problem where the TailwindCSS classname peer-focus caused Vite to hang, but this issue was only manifesting on Windows 11 environments, not on Linux.

Diagnosis:

Investigation suggested that the usage of peer-focus:dark was problematic due to potential deep recursion or complexity in CSS generation, which was not well-handled by the Windows version of Node.js or Vite.

Solution Implemented:

To resolve the issue, we adjusted the order of the TailwindCSS modifiers in our project. Specifically, we changed peer-focus:dark to dark:peer-focus. This minor adjustment effectively bypassed the recursion issue and resolved the hanging of Vite during development and builds on Windows 11.

Additional Actions:

• We have updated the CI/CD pipeline to include a Windows environment in our testing matrix. This ensures that any Windows-specific issues are caught early in the development process, preventing similar occurrences in the future.
• Adjustments were made compatible across both Windows and Linux platforms without affecting existing functionalities.

Conclusion:

This fix not only resolves the immediate hanging issue but also improves the robustness of our development process by incorporating comprehensive OS-specific testing, ensuring consistent behavior across all supported platforms.

Change Type

• Bug fix (non-breaking change which fixes an issue)

Checklist

• My code adheres to this project's style guidelines
• I have performed a self-review of my own code
• I have commented in any complex areas of my code
• I have made pertinent documentation changes
• My changes do not introduce new warnings
• I have written tests demonstrating that my changes are effective or that my feature works
• Local unit tests pass with my changes
• Any changes dependent on mine have been merged and published in downstream modules.
• New documents have been locally validated with mkdocs

[danny-avila]

FYI @techwithanirudh since the peer-focus:dark was introduced in #2619

Maybe you can confirm if the desired effect is still working as expected after merging this PR

[techwithanirudh]

@danny-avila The desired effect appears to work.

[danny-avila]

@danny-avila The desired effect appears to work.

awesome, thank you for confirming!