Autodesk / orion-ui

UI Components that work seamlessly in multiple UI frameworks
https://goo.gl/shxHPB
Other
22 stars 6 forks source link

Add Spacing #314

Open nfiniteset opened 7 years ago

nfiniteset commented 7 years ago
As a developer
I want to add spacers to my application
So that my users will see consistent spacing throughout my app

Typical usages

Stack w/ medium spacing

<div />
<Spacer width="m" />
<div />

Inline w/ medium spacing

<div style="display: flex" />
  <div />
  <Spacer type="inline" width="m" />
  <div />
<div />

Stack w/ medium inset

<Spacer inset="m">
  <h1>Hello, world!</h1>
</Spacer>

Complete props

Spacer = {
  inset: PropTypes.string, // => hig.setInset(inset)
  type: PropTypes.string, // => hig.setType(type)
  width: PropTypes.string // => hig.setWidth(width)
}

TODO