Item Grid Layout

The item layout consists of several key areas to facilitate navigation, interaction, and customization:

1. Section Manager: Located on the right-hand side of the screen, this is the primary navigation tool for managing sections within the item view.
2. Item View: The central area where all content/widgets related to a collection, deployment, resource group, or resource is displayed.
3. Widgets: Modular components displayed within sections that can be rearranged and resized.
4. Item Operations Bar: Located at the top of the page, this bar contains actions such as saving, editing, and other utility buttons.

The layout is designed to be fully customizable, allowing users to tailor their experience to their specific needs.

Customizing Your Layout

With the tools provided, users can fully customize their grid layouts:

• Sections: Organize content into logical groups, rename sections, change icons, and rearrange their order.
• Widgets: Add, move, resize, and remove widgets to create a tailored layout.
• Persistence: Save changes using the save button. The configuration will persist across sessions for the same item type.

By using these features, users can optimize their workflows and ensure efficient navigation of the Dune Portal.

Section Manager

The Section Manager is the sidebar located on the right side of the item view. It enables users to navigate and manage sections efficiently.

Features

• Navigation: Clicking on a section in the Section Manager scrolls the item view to the corresponding section.

• Edit Mode: Enter edit mode by clicking the edit button at the top of the Section Manager. In this mode:

  • Sections are represented by horizontal separators including their section titles and icons.
  • Sections can be renamed, and icons can be changed by clicking their respective edit buttons.
  • The order and position of sections can be rearranged via drag-and-drop, except for the first section, which is fixed.
  • Sections may be removed, except for predefined essential sections.

• Save Layout: Clicking on the checkmark while in edit mode, will save your current layout.

• Reset Layout: Clicking on the Reset Layout button while in edit mode, will reset the layout to it's default state.

Sections

Section Customization

When in edit mode, the sections within the item view can be customized:

Renaming Sections

1. Click the edit icon next to a section name to rename it.
2. Enter the desired name in the input field and save changes.

Changing Section Icons

1. While editing the section name you can click the current icon to the left of the name input to open a menu of icon options.
2. Select an appropriate icon to update the corresponding icon shown in the Section Manager for this section. You will see a preview of the icon as soon as you click save.

Reordering Sections

1. Drag and drop sections to rearrange their order. (The first section can't be moved since this marks the top of the item view)
2. The Section Manager will reflect the updated order.

Adding or Deleting Sections

1. Use the "Add Section" button to create new sections at the bottom of the layout.
2. Use the delete button to remove sections (except the first section).

Widgets

Overview

Widgets are modular components that can be placed within the item view. They provide functionality and information specific to the item view. A widget is part of the section directly above it.

Widget Customization

Adding Widgets

1. In edit mode, the Section Manager displays a widget expansion area.
2. Filter widgets using the available tabs and drag a widget from the list into the layout.

Moving Widgets

1. Hover over a widget to activate the move cursor.
2. Drag and drop the widget to the desired position within a section.
3. The grid dynamically adjusts to accommodate the new widget placement.

Resizing Widgets

1. Locate the resize handle at the bottom-right corner of a widget.
2. Click and drag the handle to scale the widget to the desired size.

Removing Widgets

1. Essential widgets cannot be removed (no remove button).
2. For removable widgets, click the remove button to send them back to the widget section in the expansion area.