Incorrect Mode Copying

[andreas-bylund]

Description:

When selecting to copy a mode, the incorrect mode is copied. Specifically:

• When selecting to copy Light mode, Dark mode is copied instead.
• When selecting to copy Dark mode, Light mode is copied instead.

Steps to Reproduce:

1. Select the option to copy Light mode.
2. Observe that Dark mode is copied instead.
3. Select the option to copy Dark mode.
4. Observe that Light mode is copied instead.

Example:

Outcome when I copy the following component in Light Mode:

<section className="p-6 bg-gray-800 text-gray-100">
    [...]
</section>

And when I copy the same component in Dark mode:

<section className="p-6 dark:bg-gray-100 dark:text-gray-800">
    [...]
</section>

[ndizeyedavid]

copy the available mode and then tweak it

[matronator]

Also, when you have dark mode turned on on the site, it switches the colors in the snippet, so dark mode uses light colors and vice versa.

[Microwawe]

Hi and thanks for the feedback!

Yea the dark/light mode buttons might be a bit misleading, because those just copy the component as it is on the screen with or without the dark-variant.

If you want to copy the "actual" light mode only, you can switch the whole site to the light theme from the settings in the left edge by clicking the power button and then copying the light mode.

This is the first time someone has mentioned this as an issue so do you guys have suggestions for making the different copy-buttons easier to understand?