leonardo icon indicating copy to clipboard operation
leonardo copied to clipboard

Published 20 hours ago • verified publisher icon adobe

Background color cannot be changed

Open markjharvey opened this issue 3 years ago • 9 comments

Description

The background color cannot be changed

Steps to reproduce

  1. Go to http://leonardocolor.io
  2. Click on Create new theme
  3. Observe the default Color scale "Gray"
  4. Observe the tab "Theme colors" is selected
  5. Observe the palette generated from the color scale Gray
  6. Observe the Background color cannot be changed
  7. Click on the "Theme Settings icon"
  8. Click on "Background color"
  9. Observe only "Gray" is available to select
  10. If you add more colors to the Color scale, selecting those colors as the Background color does not change anything.

Expected behavior

The Background color should have the option to input a custom color value. Nothing happens when you click on it except copying the current value (#FFFFFF) to clipboard.

Screenshots

Screen Shot 2022-10-18 at 8 53 08 PM

Environment

MacBook Pro M1 (16-inch, 2021) MacOS 12.4 Version 100.0.4896.127 (Official Build) (arm64)

Additional context

N/A

markjharvey avatar Oct 19 '22 00:10 markjharvey

@markjharvey a few things could be happening here:

  1. When the background lightness is set to 100% in the settings menu, regardless of which color scale is selected, the color will always be white (#ffffff). Changing the background lightness to less than 100% will show more color when another scale is selected.
  2. Clicking on the square labeled "background color" in the main area of the page will copy the value: those are output colors generated based on the settings you have set.

Some of these details are demonstrated in this introductory video for creating themes: https://youtu.be/d-i18M384Bo

Hope this helps

NateBaldwinDesign avatar Oct 19 '22 01:10 NateBaldwinDesign

@NateBaldwinDesign So it appears this "Theme Settings" dropdown is actually the "Background color settings"? It's still not clear what the "Background color" dropdown selection does.

markjharvey avatar Oct 19 '22 13:10 markjharvey

  1. The "background color" picker selects which color scale to use for a background. Backgrounds are dynamic, just as with everything else, so you can adjust lightness (this helps for creating light and dark mode themes) Screen Shot 2022-10-19 at 9 48 45 AM

  2. Choosing different scales will change the background color appearance. Lightness of the background is independent and determined via the "lightness" slider. Screen Shot 2022-10-19 at 9 46 08 AM Screen Shot 2022-10-19 at 9 46 18 AM

  3. To make the background black, slide the "lightness" to zero Screen Shot 2022-10-19 at 9 46 32 AM

NateBaldwinDesign avatar Oct 19 '22 15:10 NateBaldwinDesign

@NateBaldwinDesign Thank you so much for that explanation. I can see now I just did not understand how to use this. My fault and thanks again for clarifying.

Perhaps I should create an issue for a feature request, a plain "White" and "Black" option in that dropdown. Maybe it disables the other sliders? I'm not sure exactly and don't want to solution. Just a way to explicitly say "Make the background white/black"

markjharvey avatar Oct 19 '22 20:10 markjharvey

It's no problem @markjharvey! These are good points. There is some difficulty using the tool and it could be improved to help these types of problems.

NateBaldwinDesign avatar Oct 19 '22 23:10 NateBaldwinDesign

@NateBaldwinDesign I just tested this in a few browsers as I had been experiencing the same issue, and the bg theme color does not work in Firefox. I tested Chrome, Edge, Brave, and Firefox (only the last one produces this issue) on Win 11.

njeleniauskas avatar Dec 05 '22 20:12 njeleniauskas

@NateBaldwinDesign I just tested this in a few browsers as I had been experiencing the same issue, and the bg theme color does not work in Firefox. I tested Chrome, Edge, Brave, and Firefox (only the last one produces this issue) on Win 11.

Did you try adjusting the lightness slider? No matter which theme you have selected, if the lightness slider is 0% or 100%, it will be black or white. To get the color selected in the theme, you have to adjust the lightness to somewhere between 0 and 100.

markjharvey avatar Dec 12 '22 21:12 markjharvey

Did you try adjusting the lightness slider? No matter which theme you have selected, if the lightness slider is 0% or 100%, it will be black or white. To get the color selected in the theme, you have to adjust the lightness to somewhere between 0 and 100.

Yes, apologies I should have noted this earlier. That said, Firefox does seem to now be responding to the bg color change (with lightness adjustments) when I checked again today. 👍

njeleniauskas avatar Dec 13 '22 15:12 njeleniauskas