You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Wrapping is the easiest way to create responsive layouts, but our two primary layout components lack an API for enabling wrapping.
Describe the solution you'd like
API for wrapping in HorizontalLayout and VerticalLayout, e.g.
Flow: layout.setWrap(true);
WC: <vaadin-horizontal-layout theme="wrap">
The API simply applies flex-wrap: wrap; on the layout root.
(flex-wrap: wrap-reverse can be kept outside the scope for now, and I feel that it's too niche to warrant an enum-based API. Instead, an optional second parameter could be used in Flow, e.g. setWrap(boolean wrap, boolean reverse) if there is demand for it.)
Describe alternatives you've considered
No response
Additional context
No response
The text was updated successfully, but these errors were encountered:
Adds a new `wrap` theme to `vaadin-horizontal-layout` that simply sets
the `flex-wrap` CSS property on the element to `wrap`, allowing elements
to move to the next line, if there's no space left.
Fixes#7949
Describe your motivation
Wrapping is the easiest way to create responsive layouts, but our two primary layout components lack an API for enabling wrapping.
Describe the solution you'd like
API for wrapping in HorizontalLayout and VerticalLayout, e.g.
Flow:
layout.setWrap(true);
WC:
<vaadin-horizontal-layout theme="wrap">
The API simply applies
flex-wrap: wrap;
on the layout root.(
flex-wrap: wrap-reverse
can be kept outside the scope for now, and I feel that it's too niche to warrant an enum-based API. Instead, an optional second parameter could be used in Flow, e.g.setWrap(boolean wrap, boolean reverse)
if there is demand for it.)Describe alternatives you've considered
No response
Additional context
No response
The text was updated successfully, but these errors were encountered: