Upgrade main stregsystem pages to modern HTML

[atjn]

I have removed the old table-based layout and used some CSS instead. I have created two CSS classes that make the layout work much easier:

Main

All pages are now wrapped in a <main> element with default styling which ensures that there is consistent spacing around the edges of each page. Before this, each page implemented different HTML hacks that resulted in different spacing on the pages.

The elements also use the class center which automatically centers most elements on the page. Before this, every single element was wrapped in a <center> element to achieve the same thing.

Horizontal table

Many of the pages used a table to place elements in a horizontal line. I have replaced the tables with a standard class horizontal-table that can apply horizontal layout to any element.

Because I have standardized these styles, the new pages do not look exactly like the old ones did. I don't think the changes are big enough for anyone to really notice, and on the positive side, it is now much easier to apply new styles and theming because everything can be changed with a few CSS classes.

I am sorry to dump such a large PR, but I don't think these changes make sense in isolation, you need to see the full change. If you think it is too big to review, I can split it into smaller changesets and submit those as PR's. Remember to disable whitespace diffs when reviewing, otherwise the changes will seem much bigger than they are.

This is a partial implementation of #473 and #474.

[krestenlaust]

Have you tested existing themes to make sure they still work?

[atjn]

Do you mean the seasonal themes that automatically display on certain dates?

[krestenlaust]

Yes😁

[atjn]

I just checked and they all seem to work fine. They only change the background/foreground, they don't actually interact with the contents of the page, so they are not affected :)

[krestenlaust]

Awesome, I'll review it when I get the time

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 80.90%. Comparing base (6471aeb) to head (29fd2f0).
Report is 14 commits behind head on next.

Additional details and impacted files

@@            Coverage Diff             @@
##             next     #481      +/-   ##
==========================================
- Coverage   81.18%   80.90%   -0.28%     
==========================================
  Files          33       39       +6     
  Lines        3114     3609     +495     
  Branches      379      453      +74     
==========================================
+ Hits         2528     2920     +392     
- Misses        546      635      +89     
- Partials       40       54      +14     

Flag	Coverage Δ
	80.90% <ø> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[krestenlaust]

LGTM!

New appearance:

Old appearance: