Icon

Examples

HTML
SCSS
JS

<div class="dropdown">
    <button class="btn toggle" type="button" aria-expanded="false">
        Dropdown button
    </button>
    <ul class="menu">
        <li><a class="dropdown-item" href="#">Action</a></li>
        <li><a class="dropdown-item" href="#">Another action</a></li>
        <li><a class="dropdown-item" href="#">Something else here</a></li>
    </ul>
    <svg-circle />
</div>

@use "sass:list";
@use "sass:string";
@use "sass:meta";
@use "sass:map";

customElements.define("svg-circle", class extends HTMLElement {
    connectedCallback() {
        this.innerHTML = `<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
         fill="currentColor" aria-hidden="true">
        <path fill-rule="evenodd"
              d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
              clip-rule="evenodd"/>
    </svg>`;
    }
});