Horizontal layout
Navigation across the top instead of down the side. It gives the content the full width, which suits a reporting screen; it costs you the room a long list of sections needs.
Cash at bank
$284,310.55
+4.1%
across 3 accounts
Overdue
$19,720.00
4 customers
oldest over 90 days · of 128,950 owed
Owed to suppliers
$14,910.00
4 bills
3 due within 14 days
Net profit · YTD
$22,050.00
3.5% margin
before tax
How to use it
Every layout is a template in src/templates/layouts/. A page chooses one on its first line and changes nothing else:
{% extends "layouts/horizontal.njk" %}
The page content below is identical to the dashboard's. Nothing in it knows which shell it is sitting in, which is the point — you can change the shell for the whole product by changing one line in each page, or by pointing base.njk somewhere else.