Badge Background Color in ValoTheme.MENU_BADGE

Flow
1

Hello,
im realtively new to this styling things with css.
Could give me someone an hint or pointer how i can changy the backgriund color of the badge label ?

I need to remove them so that i can place a “second” ImageIcon to the right side.
Can i modfy this programmatically or do i need to overwrite some style parameters, or do i need to create my “own” style ?

Thanks for any hints or clues

peter

2

Hey Peter,

I think the background-color is derived from
$valo-menu-background-color
. However, if you just want to change the background color without fiddling with theme parameters, you can add the following to your theme (
WebContent/VAADIN/themes//.scss
):

@mixin <your-theme> {
  @include valo;

  .valo-menu-item [class*="badge"]
 {
    background: blue;
  }
}