Vertically centering rows

[zsherman]

Is there a recommended way to do this or should we just specify whatever styles directly on the <Page> component?

[AriTheElk]

The way to officially handle this within flexbox is by using the justify-content property. I ported this property to hedron in the form of the justifyContent component property (outlined here on the wiki).

Here's an example of justifyContent in action. Let me know if this answers your question 😄

[AriTheElk]

Admittedly, I need to work on ramping up the wiki documentation. If you're not familiar with the flexbox system, it would be fairly obscure what the properties outlined in the wiki actually do. Seeing as the whole point of hedron is to abstract away the complicated flex stuff, I really need to document them better.

justifyContent sets the flex-align on the vertical axis, alignContent sets the flex-align on the horizontal axis. The values they accept are stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit

[zsherman]

Oh yeah I'm familiar with flexbox, I was asking about centering rows within a page, not just centering inside the rows themselves.

[zsherman]

For now I just added my own flex styles in a style object but it would be nice if you could add flex attrs to the <Page> component

[AriTheElk]

Ah, sorry for misunderstanding. Yeah that's a valid workaround; would definitely be nice to add that feature, so thanks for the suggestion! Any ideas on what an ideal API would look like for you?

[zsherman]

Cool no worries, thanks for the library!

Thought the way http://roylee0704.github.io/react-flexbox-grid/ handles it was quite good/obvious.

[AriTheElk]

Thanks, I'll check it out 👍

[AriTheElk]

I have officially added this to the roadmap, feel free to drop by on #50 with any additional input/suggestions you might have before I begin the implementation 😄

[zsherman]

thanks @garetmckinley, will do!

[AriTheElk]

This is resolved in v1. Alignment, in general, is now much more flexible and the Page component has been removed.