On my Statuspage I would like to show a list of the available component statuses.

[darren_brooks]

On the main page I would like to show all the statuses that are available. A legend that shows what options we have when setting a status for each component

For example:  Operational, Partial Outage, Degraded Performance, Major Outage, Under Maintenance

I have seen this on other company sites but can't find how to configure it.

[Leonardo Barrios · Accepted solution]

Hello Darren,

The status legend is intentionally hidden when the components list switches to a single-column (default Statuspage configuration) layout to conserve vertical space and prevent duplicating information. It becomes visible again on wider layouts.

When displayed in a single column, the Status name is shown at the top right of the component box, and it's displayed for each component. When the screen is resized or uses a two-column layout, to save space, we switch, for example, from the word 'Operational' to a green checkmark icon. With this change, we automatically add the legend for these icons at the end of the component's list.

There's no option on the UI to change this, but you can override it by using customized code.

This is the referenced element that has 'display:none'

.layout-content.status.status-index .components-section .components-container.one-column+.component-statuses-legend {
display: none;
}

You can add a customized CSS to change this display method to something like (suggestion):

.layout-content.status.status-index .components-section .components-container.one-column + .component-statuses-legend {
display: flex;
}

You can add this code to your page by logging in to it at manage.statuspage.io > Your Page > Customize Page and Emails > 'Customize HTML & CSS' button > 'Custom CSS' section.

However, this is a suggestion to raw unblock this hidden element. You can create a customized solution that works best for your page.

Best Regards,
Leonardo Barrios - Atlassian Support

[darren_brooks]

Thankyou for your speedy response