The panel component is the baseline for numerous components such as modals, card, notifications, and more. Panel containers hold all sort of elements, and their size is determined by the space those elements occupy.
Level
The panel has 4 levels of shadows.
Level 1
Level 2
Level 3
Level 4
<NVStack Vertical Fill Gutter="8" P="8">
<NVPanel Level="1">Panel</NVPanel>
<NVPanel Level="2">Panel</NVPanel>
<NVPanel Level="3">Panel</NVPanel>
<NVPanel Level="4">Panel</NVPanel>
</NVStack>
<div class="nv-stack nv-stack-vertical nv-stack-fill gutter-y-8 p-8">
<div class="nv-panel nv-panel-level-1">Level 1</div>
<div class="nv-panel nv-panel-level-2">Level 2</div>
<div class="nv-panel nv-panel-level-3">Level 3</div>
<div class="nv-panel nv-panel-level-4">Level 4</div>
</div>
<nv-stack vertical fill gutter="8" p="8">
<nv-panel level="1">Panel</nv-panel>
<nv-panel level="2">Panel</nv-panel>
<nv-panel level="3">Panel</nv-panel>
<nv-panel level="4">Panel</nv-panel>
</nv-stack>
<NvStack fill gutter={8} p={8} vertical>
<NvPanel level="1"> Panel </NvPanel>
<NvPanel level="2"> Panel </NvPanel>
<NvPanel level="3"> Panel </NvPanel>
<NvPanel level="4"> Panel </NvPanel>
</NvStack>
