Custom CSS and reset
Who can do this: owners and managers.
Custom CSS
Section titled “Custom CSS”Most bars never need this: Settings → Branding covers logo, colours, font and background. If you know CSS, you can change more under Settings → Expert → Custom CSS for the board. It is loaded after the default style.
Every colour and size of the board is a CSS variable you can set:
| Variable | What |
|---|---|
--ds-bg, --ds-surface, --ds-line |
Background, surfaces, lines |
--ds-text, --ds-muted |
Text, muted text |
--ds-accent, --ds-up, --ds-down, --ds-crash |
Accent, rising, falling, crash |
--ds-font, --ds-num |
Font for text, font for numbers |
--ds-logo, --ds-logo-width |
Logo, e.g. url(https://…/logo.png) and 12vh |
--ds-row-h, --ds-gap |
Row height, gaps |
Classes: .board, .board-head, .board-logo, .row-drink (cells .c-name, .c-price, .c-chg, .c-range,
.c-spark), .row-header, .board-ticker, .board-crashbar.
Example:
:root { --ds-accent: #ffb000; }.row-drink .c-name { text-transform: uppercase; }Open board ↗ shows the result after saving.
Reset settings
Section titled “Reset settings”Settings → Expert → Reset settings → Reset to defaults puts settings back to the values of a new bar: the board design (including branding and custom CSS), the guest page switch, automatic crashes, and for owners also the market rules and the business day end. The page says exactly which ones your role resets. Name, country and time zone stay, and so do drinks, screens, slides, tills and the team.