'Is there any way to use font S as standard size in Vaadin Flow 14?

In vaadin Flow, M is the standard size, and is used by most elements by default. How can we change to use S as the standard size (font size and line height)? I want to change space (size, uniform, wide and tall) to use S too.



Solution 1:[1]

You can override the default Lumo values in a global style sheet. For example, the following will make the fonts consistently smaller:

html {
    --lumo-font-size: 1rem;
    --lumo-font-size-xxxl: 1.75rem;
    --lumo-font-size-xxl: 1.375rem;
    --lumo-font-size-xl: 1.125rem;
    --lumo-font-size-l: 1rem;
    --lumo-font-size-m: 0.875rem;
    --lumo-font-size-s: 0.8125rem;
    --lumo-font-size-xs: 0.75rem;
    --lumo-font-size-xxs: 0.6875rem;
}

For new projects, start.vaadin.com enable the adjustment of the theme downloaded with the starter.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Tarek Oraby