Twenty Fifteen: Navigation Block Submenu Color Settings

[viralsampat]

Hello Team,

I have reviewed the Navigation block in the Twenty Fifteen theme and noticed an issue:

When we try to set the submenu font color and background color using Block Settings, the changes are applied only in the block editor (admin), but not on the front-end.

It seems this could be resolved by ensuring the chosen font color and background color styles are also rendered on the front-end for layout consistency.

For better understanding, I have attached a video demonstrating the issue.

Thanks,

[viralsampat]

Issue video:

[sabernhardt]

WordPress 6.2 moved the color classes from the li elements to the submenu ul (GB48219).

The ​fallback colors have three classes for their selectors.

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container{
  background-color:#fff;
  border:1px solid #00000026;
}
.wp-block-navigation.has-background .wp-block-navigation__submenu-container{
  background-color:inherit;
}
.wp-block-navigation:not(.has-text-color) .wp-block-navigation__submenu-container{
  color:#000;
}

Twenty Fifteen's ​color classes only use one class in the selector, such as .has-dark-gray-color.

The theme theoretically could increase all of them to something like :root .has-dark-gray-color[class] or :root .has-dark-gray-color.has-dark-gray-color, but then other themes would need to increase specificity to three classes too.