Support for height media queries

[Simon-Tang]

🚀 Feature Proposal

I think it would be useful for xstyled to provide styling utils based on viewport height, as it does with viewport width.

Motivation

• Users would benefit from having this out of the box with xstyled, instead writing media queries + maybe even Window.matchMedia()
• Users would be able to write the same code to handle both viewport width and height

Example

To be honest, I'm not sure how the API would handle both width and height rules at the same time.

// Viewport width
<x.div minWidth={{ xs: 1, md: 1 / 2 }} />

// Viewport height
<x.div minWidth={{ hxs: 1, hmd: 1 / 2 }} />

// Width and height rules at the same time
???

Pitch