[danielededo]

Summary

On a wide screen the report was one narrow column with empty space on both sides. From 1000 px wide:

• The month takes two columns. On the left are the net pay, its summary and what changed. On the right are where the gross pay went and what is set aside.
• The glossary takes two columns.
• "Over time" and "Accrued" stay one column, at most 860 px wide, so the text in their charts stays readable. A first try put the charts in two columns too; at that width their text read badly.
• The web app widens to 1120 px with the report.

Below 1000 px nothing changes.

Type of change

• New feature (non-breaking)

Checklist

• Commits follow the commit convention
• Tests added or updated for the change
• All tests and linters pass locally
• Documentation updated (README, docs/, comments) where behavior changed
• CHANGELOG.md updated under Unreleased for user-visible changes

Notes for the reviewer

• Most of the change is CSS, inside one @media (min-width: 1000px) block in the report template. The web app's style.css gains two lines for .wrap.
• I loosened one e2e check: the report frame is now at least 400 px tall instead of a fixed figure, because on a wide screen the month is shorter.
• On top of main after feat(report): one year at a time, or all #73, these pass locally:
  • gofmt and vet;
  • go test ./...;
  • piiscan;
  • the 19 web unit tests;
  • the 14 e2e tests in Chromium.