Skip to content

Conversation

@bmartel
Copy link
Contributor

@bmartel bmartel commented Nov 28, 2025

This pull request significantly improves the Storybook developer experience by enhancing dark mode support and customizing the theme for the Label Studio project. The main changes include adding a custom dark theme, ensuring consistent dark mode styling across Storybook Docs and UI elements, and updating configuration for better maintainability and static asset handling.

Storybook Theming and Configuration Enhancements:

  • Introduced a custom dark theme for Storybook, including branding (title, logo, URL), by configuring the manager with the new theme in manager.ts.
  • Updated main.ts to add staticDirs for serving static assets (like logos) and refactored the configuration for improved readability and maintainability.

Dark Mode and Styling Improvements:

  • Overhauled preview.scss to enforce dark mode colors throughout Storybook, including Docs pages, tables, code blocks, form controls, and buttons, using CSS variables and !important for consistency. [1] [2]
  • Ensured that Storybook Docs UI elements (e.g., args tables, code blocks, toggles, buttons) are styled for dark mode, improving readability and visual consistency.
  • Updated the webpack configuration in main.ts to avoid prefixing CSS class names for Storybook preview styles, ensuring that Storybook's own UI is not affected by local class name prefixing.

Code Quality and Maintenance:

  • Improved code readability by formatting and clarifying conditional logic in the webpack rules within main.ts.

@bmartel bmartel requested a review from nass600 November 28, 2025 17:31
@github-actions github-actions bot added the chore label Nov 28, 2025
@netlify
Copy link

netlify bot commented Nov 28, 2025

Deploy Preview for heartex-docs canceled.

Name Link
🔨 Latest commit 7227662
🔍 Latest deploy log https://app.netlify.com/projects/heartex-docs/deploys/6929dfe19b9e200008e6205b

@netlify
Copy link

netlify bot commented Nov 28, 2025

Deploy Preview for label-studio-docs-new-theme canceled.

Name Link
🔨 Latest commit 7227662
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-docs-new-theme/deploys/6929dfe18274ff000821ef26

@netlify
Copy link

netlify bot commented Nov 28, 2025

Deploy Preview for label-studio-storybook ready!

Name Link
🔨 Latest commit 7227662
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-storybook/deploys/6929dfe15bf28e000855b2e9
😎 Deploy Preview https://deploy-preview-8912--label-studio-storybook.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@netlify
Copy link

netlify bot commented Nov 28, 2025

Deploy Preview for label-studio-playground ready!

Name Link
🔨 Latest commit 7227662
🔍 Latest deploy log https://app.netlify.com/projects/label-studio-playground/deploys/6929dfe39c4a57000814938c
😎 Deploy Preview https://deploy-preview-8912--label-studio-playground.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@codecov
Copy link

codecov bot commented Nov 28, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 57.74%. Comparing base (a2f4b57) to head (7227662).
⚠️ Report is 4 commits behind head on develop.

❗ There is a different number of reports uploaded between BASE (a2f4b57) and HEAD (7227662). Click for more details.

HEAD has 1 upload less than BASE
Flag BASE (a2f4b57) HEAD (7227662)
pytests 1 0
Additional details and impacted files
@@             Coverage Diff             @@
##           develop    #8912      +/-   ##
===========================================
- Coverage    66.10%   57.74%   -8.37%     
===========================================
  Files          820      561     -259     
  Lines        64416    40878   -23538     
  Branches     11041    11040       -1     
===========================================
- Hits         42581    23603   -18978     
+ Misses       21831    17271    -4560     
  Partials         4        4              
Flag Coverage Δ
lsf-e2e 51.81% <ø> (+<0.01%) ⬆️
lsf-integration 48.53% <ø> (+0.32%) ⬆️
lsf-unit 8.33% <ø> (ø)
pytests ?

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@bmartel
Copy link
Contributor Author

bmartel commented Nov 28, 2025

/fmt

Workflow run

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants