Minor cosmetic issue

[gatanaso]

Minor cosmetic issue

[markhm]

Hi @gatanaso,

Many thanks for going above and beyond on your answer. It is definitely still on time and I will be able to use this in my solution. 👍🏻🙏🏻

[gatanaso]

Hi @markhm,

Thanks for opening this issue. Hopefully this answer does not come too late :)

The MultiselectComboBox has stylable parts, so you can adjust the styles however you see fit for you application. For example, to increase the spacing between the tokens (i.e. affect the input field styles) you need to target the multiselect-combo-box-input component:

1. Create a new file under frontend/styles called multiselect-combo-box-input-styles.css
2. In that file add the following code:

[part="token"] + [part="token"] {
    margin-left: 10px; // or any other value
}

3. Apply the new style to your app by adding the following annotation:

@Route("")
@CssImport(value = "./styles/multiselect-combo-box-input-styles.css", themeFor = "multiselect-combo-box-input")
public class MyAwesomeApp extends VerticalLayout {.....}

The above code for example will add more spacing between adjacent tokens, but you can also adjust any of the other parts available in the web component.

Hope this helps,
Goran