add show-on-* classes for display inline, inline-block, flex, inline-…

[florianrubel]

…flex

Proposed changes

The CSS classes .show-on-* like .show-on-medium-and-up will always lead to a display: block but that's not always what you want.

I added classes for .show-on-* to make them supporting inline-block, inline, flex, inline-flex with the following pattern:

.show-on-(screensize)-(display-property)
// f.e.
.show-on-small-inline-block

Screenshots (if appropriate) or codepen:

Codepen: https://codepen.io/anon/pen/ayZrMP

Types of changes

• Bug fix (non-breaking change which fixes an issue).
• New feature (non-breaking change which adds functionality).
• Breaking change (fix or feature that would cause existing functionality to change).

Checklist:

• I have read the CONTRIBUTING document.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have added tests to cover my changes.
• All new and existing tests passed.

[florianrubel]

I forgot to update the documentation. Shame on me.

Will do right now.

[florianrubel]

done

[DanielRuf]

That is just too much. No other frameworks do it like this.

[florianrubel]

Sure. Bootstrap does. But without flex. Only inline, inline-block and block.