# Design recipes

Paste one of the following "recipes" into your status page's "Custom CSS" Design setting field to implement a customization.

### Hide the past incidents section and link

```css
.past-incidents, .previous-incidents { display: none !important }
```

### Hide the uptime percentage from your Uptime Graphs

```css
.uptime { display: none }
```

### Auto-select "Select services" Checkbox and Hide "All" in the Subscription Modal

This recipe automatically selects the "Select services" checkbox and hides the "All" option in the subscription modal. Ideal for when you want to make sure your customers select the specific status page services they should get notifications about.

<figure><img src="/files/Lacg40KSeC4HOEeAR7AG" alt="" width="536"><figcaption></figcaption></figure>

**JavaScript Snippet:**\
This JavaScript code automatically selects the "Select services" checkbox when the subscription modal is opened. Add this to the **Status Page Settings** section:

```javascript
document.addEventListener("sp:subscribeModalOpened", function() {
  document.querySelectorAll('[name="subscription[filter]"][value="services"]').forEach(checkbox => {
    checkbox.checked = true;
  });
});
```

**CSS Snippet:**\
This CSS code hides the "All" option in the subscription modal. Add this to the **Status Page Design** section:

```css
.filter-toggle label:first-child { 
  display: none; 
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.statuspal.io/platform/status-page-settings-and-design/design-customization/design-recipes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.