Modal

Basic Modal

<!-- Modal Structure -->
<div class="ethio-modal" id="demo-modal">
  <div class="ethio-modal-content">
    <div class="ethio-modal-header">
      <h3>Modal Title</h3>
      <button class="ethio-modal-close" onclick="ethio.closeModal('demo-modal')">×</button>
    </div>
    <div class="ethio-modal-body">
      <p>Modal content goes here.</p>
    </div>
    <div class="ethio-modal-footer">
      <button class="ethio-btn ethio-btn-ghost" onclick="ethio.closeModal('demo-modal')">Cancel</button>
      <button class="ethio-btn ethio-btn-primary">Confirm</button>
    </div>
  </div>
</div>

<!-- JavaScript -->
<script>
const ethio = new ethioWDS();
function openModal() {
  ethio.openModal('demo-modal');
}
</script>