Ngorei NexaUI

<Button 
title="White" 
 class="nx-btn-white"nx-offcanvas-target="offcanvas-left"/>

<Offcanvas
title="Offcanvas Kiri"
id="offcanvas-left" 
position="top" 
content='(
 <div>Ini adalah konten offcanvas</div>
)' 
/>

<!-- Tombol trigger -->
<button class="nx-btn" nx-offcanvas-target="offcanvas-left">Offcanvas Kiri</button>

<!-- Offcanvas -->
<div class="nx-offcanvas" id="offcanvas-left" data-position="left">
  <div class="nx-offcanvas-header">
    <h5>Offcanvas Kiri</h5>
    <button class="nx-close" data-offcanvas-close></button>
  </div>
  <div class="nx-offcanvas-body">
    Ini adalah konten offcanvas
  </div>
</div>
          

<!-- Tombol trigger -->
<button class="nx-btn" nx-offcanvas-target="offcanvas-right">Offcanvas Kanan</button>

<!-- Offcanvas -->
<div class="nx-offcanvas" id="offcanvas-right" data-position="right">
  <div class="nx-offcanvas-header">
    <h5>Offcanvas Kiri</h5>
    <button class="nx-close" data-offcanvas-close></button>
  </div>
  <div class="nx-offcanvas-body">
    Ini adalah konten offcanvas
  </div>
</div>
          

<!-- Tombol trigger -->
<button class="nx-btn" nx-offcanvas-target="offcanvas-top">Offcanvas Atas</button>

<!-- Offcanvas -->
<div class="nx-offcanvas" id="offcanvas-top" data-position="top">
  <div class="nx-offcanvas-header">
    <h5>Offcanvas Kiri</h5>
    <button class="nx-close" data-offcanvas-close></button>
  </div>
  <div class="nx-offcanvas-body">
    Ini adalah konten offcanvas
  </div>
</div>
          

<!-- Tombol trigger -->
<button class="nx-btn" nx-offcanvas-target="offcanvas-bottom">Offcanvas Bawah</button>

<!-- Offcanvas -->
<div class="nx-offcanvas" id="offcanvas-bottom" data-position="bottom">
  <div class="nx-offcanvas-header">
    <h5>Offcanvas Kiri</h5>
    <button class="nx-close" data-offcanvas-close></button>
  </div>
  <div class="nx-offcanvas-body">
    Ini adalah konten offcanvas
  </div>
</div>
          

<<div>
</div>