# Configuration

URL: https://zerodev.ca/docs/vail/configuration

> Every option in settings.json: site details, theme, announcement, footer and incidents.



Vail is set up in `settings.json` in its folder. The file is read on the server each time the page loads, so changes show on the next refresh. Visitors never see the file.

```json title="settings.json"
{
  "site": {
    "title": "Zero Development",
    "description": "Live status for our services.",
    "logo": "",
    "icon": "/icon.png",
    "favicon": "/favicon.ico",
    "links": [{ "label": "Home", "url": "https://zerodev.ca" }]
  },
  "theme": { "primaryColor": "blue", "defaultColorScheme": "dark", "radius": "sm" },
  "announcement": { "enabled": false, "type": "info", "title": "Scheduled Maintenance", "message": "Upgrades on Sunday at 02:00 UTC." },
  "footer": { "text": "%sitename% • Made with Vail Status" },
  "discord": { "enabled": false, "webhookUrl": "", "apiKey": "", "username": "Vail Status", "avatarUrl": "" },
  "groups": [],
  "incidents": []
}
```

`groups` holds your services. See [Monitors](/docs/vail/monitors). `discord` is covered in [Discord Alerts](/docs/vail/discord).

## site

| Option        | What it does                                                                              |
| ------------- | ----------------------------------------------------------------------------------------- |
| `title`       | The page name, shown in the header and the browser tab.                                   |
| `description` | A line under the title.                                                                   |
| `icon`        | A square icon next to the title, such as `/icon.png`. Without one, a pulse icon is shown. |
| `logo`        | Reserved. Not shown yet.                                                                  |
| `favicon`     | The browser tab icon.                                                                     |
| `links`       | Header buttons, each with a `label` and `url`.                                            |

Images can be a full URL or a file in the `public/` folder, such as `/icon.png`.

## theme

| Option               | What it does                                                                                                 |
| -------------------- | ------------------------------------------------------------------------------------------------------------ |
| `primaryColor`       | The accent colour. Any Mantine colour, such as `blue`, `cyan`, `teal`, `violet`, `orange` or `red`.          |
| `defaultColorScheme` | `dark`, `light` or `auto` to follow the visitor's device. Visitors can switch with the button in the header. |
| `radius`             | Corner roundness: `xs`, `sm`, `md`, `lg` or `xl`.                                                            |

## announcement

A banner above the status summary, for maintenance or news.

| Option    | What it does                                        |
| --------- | --------------------------------------------------- |
| `enabled` | Show the banner.                                    |
| `type`    | `info` (blue), `warning` (yellow) or `error` (red). |
| `title`   | The heading.                                        |
| `message` | The text.                                           |

## footer

| Placeholder  | Becomes           |
| ------------ | ----------------- |
| `%sitename%` | `site.title`.     |
| `%year%`     | The current year. |

```json
"footer": { "text": "© %year% %sitename%" }
```

## incidents

Incidents show under **Incident History**. Updates are shown in the order you list them, so put the newest first.

```json
"incidents": [
  {
    "id": "api-latency",
    "title": "API Latency",
    "status": "resolved",
    "severity": "minor",
    "createdAt": "2026-09-12T14:00:00.000Z",
    "updates": [
      { "timestamp": "2026-09-12T14:30:00.000Z", "status": "resolved", "message": "Response times are back to normal." },
      { "timestamp": "2026-09-12T14:00:00.000Z", "status": "investigating", "message": "We are looking into slow API responses." }
    ]
  }
]
```

| Option      | What it does                                                   |
| ----------- | -------------------------------------------------------------- |
| `id`        | Any unique text.                                               |
| `title`     | The incident name.                                             |
| `status`    | `investigating`, `identified`, `monitoring` or `resolved`.     |
| `severity`  | `minor`, `major` or `critical`.                                |
| `createdAt` | When it started, as an ISO date.                               |
| `updates`   | The timeline, each with a `timestamp`, `status` and `message`. |

Dates are shown with their time zone, as rendered by your server.
