Create responsive portfolio design

[dcecile]

Set up this website to work on smaller screens:

• Main portfolio
  Idea: Also set max height for intro

• Resume preview
  Idea: Use media queries to see if the default em size plus margins is larger than 100vw, if so, use vw or vh size; also, don't forget super long portrait screens

• Portfolio details
  Idea: Set a calculated width for the list items (full-screen, simple margins) and flex overflow, or just use auto overflow

• Add my portfolio and resume as a responsive design example

• Test

• Log issue: "View my portfolio" getting line-broken

[dcecile]

Top 4 tallest details: CSS, HTML, Unitron, Forks in the Road. If someone is using a low-spec laptop like me, and they have a big task bar taking up vertical space, points will be cut off. At least until I implement #28 to allow scrolling inside details. I think it's fine for now -- the viewer will still see some important points.

That said, I think I'll restrict my big font size for when vertical and horizontal limits are met.

• Refactor media queries
• Apply font size increase for large min width and height
• Collapse link size, top/bottom padding, border, and border radius under low-font-size medium min height but over medium min width for nav buttons
• Hide overflowed list items
• Hide border and nav buttons when under medium min width
• Tweak animation for tight width (zoom out?)

[dcecile]

iPhone (375x667) button wrap issue:

[dcecile]

iPhone issue deferred to #32