Modal
Content
Open Modal
My details modal
<details>
<summary>
<div class="nhs-btn nhs-fancy2">
Open Modal
</div>
<div class="nhs-modal-overlay"></div>
</summary>
<div class="nhs-modal">
<div class="nhs-modal-close">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
</svg>
</div>
<div class="nhs-modal-title">
<h1>My details modal</h1>
</div>
<div class="nhs-modal-content">
<p>
You can click the X in the corner or click the overlay to close this modal.
Something like this could be useful as a nice way to show additional information,
but that's about as far as I would take it. It's just a nice way of styling the details element.
</p>
</div>
</div>
</details>
<summary>
<div class="nhs-btn nhs-fancy2">
Open Modal
</div>
<div class="nhs-modal-overlay"></div>
</summary>
<div class="nhs-modal">
<div class="nhs-modal-close">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000">
<path d="M0 0h24v24H0V0z" fill="none" />
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
</svg>
</div>
<div class="nhs-modal-title">
<h1>My details modal</h1>
</div>
<div class="nhs-modal-content">
<p>
You can click the X in the corner or click the overlay to close this modal.
Something like this could be useful as a nice way to show additional information,
but that's about as far as I would take it. It's just a nice way of styling the details element.
</p>
</div>
</div>
</details>