Skip to content

Panel

<ns-panel>

Overview

Panel is a decorative empty container that holds each section of a page.

✨ This is an auto-generated AI summary of the ns-panel's documentation. It may not be accurate. ✨

It provides an area to place a layout, add an optional decoration and apply the appropriate margins. There can be more than one ns-panel on a page.

Examples

Guidance

Standard

Labelled diagram of ns-panel

Key

KeyField typeGuidelines
ADecorationChoose between a no-colour background (default) or one of the decoration options.
BAnonymous slotItems placed in the anonymous slot can include a variety of different types of content and components.

Implementation

Placement

The ns-panel component can be used in the following components:

Specification

Attributes

decoration
Property
decoration
Description
The decorative background colour of the panel with optional top and bottom offset percentages.
Type
string
Options
cyan lime navy blue forest orange red yellow white grey-light
Default
type
Property
type
Type
string
Default
panel

Slots

SlotPermitted tagsDescription
Anonymous slot<div> <ns-column> <ns-content> <ns-lockup> The anonymous slot for content.

Last updated: