This tag is essential for a mobile friendly layout. See
https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
for more info.

The markup is added before the actual archnavbarlist to make it possible
to select said list via the CSS sibling selector depending on hamburger
state/class.

Note that this commit removes the minium body width of 650px.

A new JavaScript file base.js is introduced and included in the base
template so the hamburger button will work on every page.

- Make navigation bar stick to top on mobile.
- Increase font size and spacing of navigation entries on mobile and
increase their clickable area.
- Expanded mobile navigation now spans the entire height.

It makes more sense for footer and devnavbar to be siblings of content, and not
children. Also, this step makes it way easier to properly layout everything
using flexbox instead of the outdated float mechanism.

- Layout switches arrangement of content depending on screen width using
flexbox
- Enable word-breaking for news articles. This is necessary because long words
like directory paths might otherwise overflow on small screen widths.
- The contents of the packages page are in correct order but there are
still fixed widths which mess up the layout on small mobile devices.

This is to prevent the headlines from overlapping with the article
timestamp.

- Every nav-sidebar items needs to be wrapped in a container to make
proper styling possible.
- nav-siderbar items will appear in columns of 2 or 3 depending on
available screen width on mobile.

This way the navbar content won't span the entire screen width on wide
monitors.

Table will be reformatted on mobile devices following the technique
described here: https://css-tricks.com/responsive-data-tables/