Mark sections view as default to reflect current version (#35583)

This commit is contained in:
c0ffeeca7 2024-11-05 15:43:14 +01:00 committed by GitHub
parent 4a670b232d
commit d3bc5aeb0f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 22 additions and 24 deletions

View File

@ -1,7 +1,7 @@
--- ---
type: view type: view
title: Masonry view title: Masonry view
sidebar_label: Masonry (default) sidebar_label: Masonry
description: "The default panel layout uses a masonry algorithm." description: "The default panel layout uses a masonry algorithm."
related: related:
- docs: /dashboards/panel/ - docs: /dashboards/panel/

View File

@ -1,7 +1,7 @@
--- ---
type: view type: view
title: Sections (experimental) title: Sections
sidebar_label: Sections (experimental) sidebar_label: Sections (default)
description: "Lets you organize your cards in sections on a grid." description: "Lets you organize your cards in sections on a grid."
description: "The panel view shows a single card in the full width of the screen." description: "The panel view shows a single card in the full width of the screen."
related: related:
@ -27,16 +27,11 @@ You can group cards without using horizontal or vertical stack cards.
A fully populated dashboard in Sections view layout A fully populated dashboard in Sections view layout
</p> </p>
{% note %}
The sections view was released beginning of March 2024 and is experimental! Do not build your daily dashboard on top of it yet! We are still collecting feedback.<br>
It is not possible to migrate dashboards into sections view.
{% endnote %}
## Creating a sections view ## Creating a sections view
1. If you have multiple dashboards, in the left sidebar, select the dashboard to which you want to add the sections view. 1. If you have multiple dashboards, in the left sidebar, select the dashboard to which you want to add the sections view.
2. Follow the steps on [adding a new view](/dashboards/views/#adding-a-view-to-a-dashboard). 2. Follow the steps on [adding a new view](/dashboards/views/#adding-a-view-to-a-dashboard).
- Under **View type**, select **Sections (experimental)**. - Under **View type**, select **Sections**.
3. Under **Max number of sections wide**, select the maximum number of columns you want to see in the new sections view. 3. Under **Max number of sections wide**, select the maximum number of columns you want to see in the new sections view.
4. Under **Dense section placement**, select if you want to allow the cards to be arranged automatically in order to fill gaps between cards. 4. Under **Dense section placement**, select if you want to allow the cards to be arranged automatically in order to fill gaps between cards.
- This will remove some gaps, but it also means you have less control over the order of the cards. - This will remove some gaps, but it also means you have less control over the order of the cards.
@ -77,17 +72,17 @@ In the sections view, you can rearrange sections and cards by dragging them to a
1. To edit your dashboard, in the top right corner, select the edit {% icon "mdi:edit" %} button. 1. To edit your dashboard, in the top right corner, select the edit {% icon "mdi:edit" %} button.
2. To rearrange sections, hold the move {% icon "mdi:cursor-move" %} button and move the card. 2. To rearrange sections, hold the move {% icon "mdi:cursor-move" %} button and move the card.
<p class='img'> <p class='img'>
<img src="/images/dashboards/section_view_rearrange_sections.gif" alt="Rearranging sections by dragging"/> <img src="/images/dashboards/section_view_rearrange_sections.gif" alt="Rearranging sections by dragging"/>
Rearranging sections by dragging Rearranging sections by dragging
</p> </p>
3. To rearrange cards, tap and hold the card and move it to your desired location. 3. To rearrange cards, tap and hold the card and move it to your desired location.
<p class='img'> <p class='img'>
<img src="/images/dashboards/section_view_rearrange_cards.gif" alt="Rearranging cards by dragging"/> <img src="/images/dashboards/section_view_rearrange_cards.gif" alt="Rearranging cards by dragging"/>
Rearranging cards by dragging Rearranging cards by dragging
</p> </p>
## Show or hide section conditionally ## Show or hide section conditionally

View File

@ -9,7 +9,7 @@ related:
- docs: /dashboards/panel/ - docs: /dashboards/panel/
title: Panel view title: Panel view
- docs: /dashboards/sections/ - docs: /dashboards/sections/
title: Sections view (experimental) title: Sections view (default)
- docs: /dashboards/views/ - docs: /dashboards/views/
title: About views title: About views
--- ---

View File

@ -10,6 +10,11 @@ related:
The vertical stack card allows you to group multiple cards so they always sit in the same column. The vertical stack card allows you to group multiple cards so they always sit in the same column.
<p class='img'>
<img src='/images/dashboards/edit-dashboard.webp' alt='Screencast showing how to edit a dashboard customize a vertical stack card'>
Screencast showing how to edit a dashboard and customize a vertical stack card.
</p>
{% include dashboard/edit_dashboard.md %} {% include dashboard/edit_dashboard.md %}
## YAML configuration ## YAML configuration

View File

@ -26,8 +26,8 @@ You can customize your dashboard using various options:
- Use custom cards from our amazing community. - Use custom cards from our amazing community.
<p class='img'> <p class='img'>
<img src='/images/dashboards/edit-dashboard.webp' alt='Screencast showing how to edit a dashboard customize a vertical stack card'> <img src="/images/dashboards/section_view_rearrange_cards.gif" alt="Screencast showing how to edit a dashboard in section view and how to rearrange cards"/>
Screencast showing how to edit a dashboard and customize a vertical stack card. Screencast showing how to edit a dashboard in section view and how to rearrange cards
</p> </p>
## Explore the interactive demo dashboard ## Explore the interactive demo dashboard

View File

@ -34,12 +34,10 @@ Views control the layout.
There are four different view types: There are four different view types:
- **Sections (default)**: Arranges cards in a grid system and lets you group them in sections.
- **Panel**: Displays one card in full width. For example a map or an image. - **Panel**: Displays one card in full width. For example a map or an image.
- **Sidebar**: Arranges cards in 2 columns, a wide one and a smaller one on the right. - **Sidebar**: Arranges cards in 2 columns, a wide one and a smaller one on the right.
- **Masonry (default)**: Arranges cards in columns based on their card size. - **Masonry**: Arranges cards in columns based on their card size.
- **Sections (experimental)**: Arranges cards in a grid system and lets you group them in sections.
It is currently not possible to migrate your dashboard from one view type into another. For example, if you have a dashboard in masonry view, and want it in sections view, you need to create a new view.
## Adding a view to a dashboard ## Adding a view to a dashboard