Skip to content

Fix stage header when dark-www and scratch3to2 are active simultaneously#8849

Merged
mxmou merged 6 commits intoScratchAddons:masterfrom
iqnite:scratch2-to-3-fix
Feb 19, 2026
Merged

Fix stage header when dark-www and scratch3to2 are active simultaneously#8849
mxmou merged 6 commits intoScratchAddons:masterfrom
iqnite:scratch2-to-3-fix

Conversation

@iqnite
Copy link
Contributor

@iqnite iqnite commented Feb 19, 2026

Resolves https://discord.com/channels/806602307750985799/1469856099590213683

Changes

Updated the scratch3to2 addon's userstyle to apply the page background and border colors from dark-www on the stage header, if the latter is enabled. If dark-www is enabled, the gradient uses the colors from "Page background" and a darker variant.

dark-www disabled

image

dark-www enabled

image

Reason for changes

This change ensures that colors are consistent when both dark-www and scratch3to2 are enabled.

Tests

Tested on Microsoft Edge 145.0.3800.65.

Copilot AI review requested due to automatic review settings February 19, 2026 10:23
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR updates the scratch3to2 addon to properly integrate with the dark-www addon by applying dark theme colors to the stage header when both addons are simultaneously enabled. The change replaces hard-coded gradient and border colors with CSS variables from dark-www, ensuring visual consistency across the interface.

Changes:

  • Modified stage header styling to use dark-www CSS variables for background and border colors
  • When dark-www is enabled, the stage header will display with a solid background color matching the page theme instead of the original white-to-gray gradient

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Copy link
Member

@mxmou mxmou left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This will remove the gradient even when dark-www is set to the Scratch 2.0 preset, which is probably quite commonly used together with scratch3to2. I think it's better to have two versions of the gradient (light and dark) and switch between them based on the page background color.

@iqnite
Copy link
Contributor Author

iqnite commented Feb 19, 2026

@mxmou I've now updated it to use the colors from the page and gray settings. I feel it's more flexible than arbitrarily determining light/dark, looks better on colored backgrounds, and there's no notable difference when using the Scratch 2.0 theme preset.

@mxmou
Copy link
Member

mxmou commented Feb 19, 2026

That's better, but the gradient still isn't as noticeable as before with the 2.0 preset. Instead of page and gray, I suggest using two different shades of page, which can be generated using CSS like this:

  • var(--darkWww-page, white)
  • color-mix(in srgb, var(--darkWww-page, white), black 10%)

@iqnite
Copy link
Contributor Author

iqnite commented Feb 19, 2026

color-mix(in srgb, var(--darkWww-page, white), black 10%)

That's funny, I searched for this for 10 minutes without any results. Thank you.

@mxmou mxmou merged commit 96b2962 into ScratchAddons:master Feb 19, 2026
1 check passed
@iqnite iqnite deleted the scratch2-to-3-fix branch February 19, 2026 21:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

Comments