Dashboard Layout
The KPI Dashboard layout is fully customizable. You control which cards appear, how large they are, and in what order they are arranged. Changes are saved automatically — there is no separate save step.
Entering Edit Mode
Click the Edit Layout button in the top-right corner of the dashboard toolbar. In edit mode:
- Cards display a drag handle in the top-left corner.
- Cards display a resize handle on the right edge.
- The Add Card button becomes available in the toolbar.
- A subtle visual indicator marks the grid columns.
Click Done to exit edit mode. Your layout is saved as you make changes, so exiting edit mode does not discard anything.
The Grid System
The dashboard uses a 12-column grid. Every card occupies a whole number of columns — no fractional widths. Cards snap to column boundaries automatically as you drag and resize them, so alignment is always consistent.
Card Widths
| Width | Columns | Fraction of screen |
|---|---|---|
| Narrow | 3 columns | One quarter |
| Medium | 4 columns | One third |
| Wide | 6 columns | One half |
| Full | 12 columns | Full width |
Cards can be set to any width between 3 and 12 columns. Intermediate widths (5, 7, 8, etc.) are valid if you need them.
A 4-column width is a good default for most chart cards. Use 3-column cards for single-number metrics you want to show several of in a row. Use 6 or 12 columns for trend lines and tables where horizontal space improves readability.
Reordering Cards
In edit mode, click and hold the drag handle (the icon in the top-left corner of a card) and drag the card to its new position. Other cards shift to make room as you drag. Release to drop the card in place.
Cards reflow to fill gaps automatically — there are no empty gaps in the grid.
Resizing Cards
In edit mode, click and drag the resize handle on the right edge of any card. The card width snaps to the nearest column boundary as you drag. Release when the card reaches the desired width.
Card height is fixed and determined by the visualization type. You can control width, but not height directly. If a chart needs more vertical space, the card type itself is designed to use the available height efficiently.
Saving the Layout
Layout changes are saved automatically to your browser's local storage as you make them. There is no save button and no risk of losing your arrangement.
Because the layout is stored in local storage:
- It persists across browser sessions on the same device.
- It is not synced across devices — each device (or browser) maintains its own layout.
- Clearing browser storage resets the layout to the default empty state.
If you use FleetTAB in a private/incognito window, local storage is cleared when the window closes. Your layout will not persist between incognito sessions.
Exporting to PDF
Click the Export PDF button in the top toolbar to generate a PDF snapshot of the current dashboard.
The export captures:
- All visible cards in their current layout and size.
- The active date range and any applied filters.
- Chart and data content as rendered at the time of export.
The export excludes:
- Interactive controls (dropdowns, unit selectors, filter buttons).
- Edit mode handles and resize controls.
- The toolbar itself.
For consistent PDF exports, set your desired date range and filters before exporting. The PDF reflects the state of the dashboard at the moment you click the button.