Motivation

The purpose of this demo is to deepen my understanding of flexbox and explore the use case of using flexbox. Build mobile first design with responsive media query.

Flexbox properties

flex-basis
flex-grow
flex-shrink
flex-wrap
flex-flow

Design Specification

Font-Family: 'Blinker' Bold, Regular
Font-Family: 'PT Sans Pro' Regular
Primary Color - #05CBE9 (cyan)
Background Color - #111D4A (dark blue)
Font Color - #9BA0B3 (gray)

Small Screen

title - 28px (1.75em)
body - 16px (1em)
button - 20px (1.25)

Big Screens

title - 36px (2.25em)
body - 18px (1.125em)
button - 20px (1.25)