Confusing Barrio Color Scheme Settings UI Labels

Created on 19 June 2024, 11 months ago

In the Barrio Color Scheme Settings form we have a number of confusing options.

We can choose the Primary base color and the Secondary base color. Fine, no problem.

When we want to choose the H1 color or the H2 color or the H3 color we are given choices between “Base color”, “Primary color”, or “Secondary color”.

Does “Base color” refer to the color value of the previously set “Primary base color” or something else? I have a feeling it is something else because otherwise there would not be an option to choose “Primary color” separately.

Either some form labels need to be rewritten or the select options need to clearly match a form field where we can know which value we are selecting.

🐛 Bug report
Status

Active

Version

5.5

Component

User interface

Created by

🇺🇸United States tommyk

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @tommyk
  • Status changed to Closed: works as designed 10 months ago
  • 🇵🇪Peru hatuhay Lima

    Barrio colors are based on Material Design color managent, using Bootstrap framework.
    The theme generates site colors based on 2 colors
    Please refer to https://m1.material.io/style/color.html#color-color-system

  • Status changed to Active 9 months ago
  • 🇺🇸United States tommyk

    I read the page you linked to. It does not have the word "base" on it anywhere.

    Let me reiterate my question: What does "Base color" refer to? We don't have the option to set a "Base color" in the UI, so where does the value come from?

  • 🇵🇪Peru hatuhay Lima

    Primary color

  • 🇺🇸United States tommyk

    Why is there a different choice for "Base color" and "Primary color" in the select list if they are the same? It's very confusing.

  • 🇹🇷Turkey makbay

    I'd like to propose a small but important change to improve clarity in the color scheme settings UI.

    Currently, the form uses the labels for the color fields:

    • Primary base color
    • Secondary base colo

    Meanwhile, when choosing colors for headings (H1, H2, etc.), we are presented with options like:

    • Base color
    • Primary color
    • Secondary color

    This inconsistency causes confusion. Users are left unsure whether Primary base color corresponds to Primary color, and what Base color refers to at all.

    Suggested fix:

    • Rename "Primary base color" to "Primary color"
    • Rename "Secondary base color" to "Secondary color"

    This change would align the labels with the options in the dropdowns and provide a more intuitive experience.

  • @makbay opened merge request.
  • 🇺🇸United States tommyk

    This wouldn't fix it. There will still be an option for "Base color" in the heading color select lists. We will still have no idea what color "Base color" refers to unless we are familiar with the explanation in this issue. The select lists probably need to be changed along with the corresponding labels for the Primary and Secondary color selection.

  • 🇹🇷Turkey makbay

    Base color equals to body color. It makes the heading colors equal to the body color, in another words, does not change the heading colors.

    There is another bigger problem that I have just discovered and resolved here:
    https://www.drupal.org/project/bootstrap_barrio/issues/3522986 🐛 Incorrect logic in _get_color() causes color values useless Active

  • 🇺🇸United States tommyk

    Agree with the suggestion to change the option string to something that makes more sense "Body text color" or "Default text color" each would make sense to me. Including the word "text" would remove any ambiguity as to whether it refers to text color or background color.

Production build 0.71.5 2024