Header.html template adjusted to make the navigation menu collapse behind a button on small screens. There should be no change when viewing these on tablets and larger screens.
Changes include:
- Making the navigation menu collapse on small screens, to be replaced by a "hamburger" icon that then expands to show the menu when clicked.
- Ensuring GitHub icon takes same colour/style as the navigation items
- Added the Bootstrap js script to the footer (in order to make the collapsing menu work). This code will have to be amedned to make the "local only" version work properly.
HTML adjusted to make them responsive and better sized when viewed on a mobile device. There should be no change when viewing these on tablets large screens.
Changes include:
- Making containers 100% wide on screens below the Bootstrap "lg" breakpoint. This removes the left and right outer margins, making the most of available space on small screens.
- Making the navigation menu collapse on small screens, to be replaced by a "hamburger" icon that then expands to show the menu when clicked.
- Making all tables responsive so that they can be horizontally scrolled on small screens.
- Table items now centrally align vertically on the table rows (using the "align-middle" class").