cosmos icon indicating copy to clipboard operation
cosmos copied to clipboard

[Layout] Extend the StackLayout to cope with all flexbox possibilities

Open andresgalante opened this issue 7 years ago • 0 comments
trafficstars

At the moment Cosmos provides a set of components but lacks a system to organize elements on the screen.

The StackLayout component arranges components next to one another, with a consistent gutter.

The StackLayout component is a grid container that wraps its immediate children into StackLayout.Items and separates them with a grid gap.

The gutter between rows allows 4 sizes: none, default, small and large.

Examples of similar implementations of this components are: https://mineral-ui.com/components/flex https://polaris.shopify.com/components/structure/stack

All layouts should be responsive (or ready to be responsive), accessible and documented.

Important: In order to have consistent spacing across the system, the immediate children of the StackLayout.Item should have it's margin cleared. @francocorreasosa suggested to make this by default but optional, in case the author wants to keep them.

andresgalante avatar Nov 21 '18 17:11 andresgalante