Menú de tres puntos

El menú de tres puntos es un menú desplegable tipo lista al cual puedes añadirle las opciones que desees. Su estructura es la siguiente:

<div class="meatballs-menu">
  <button class="meatballs-menu__button"></button>
  <nav class="meatballs-menu__nav">
    <ul class="meatballs-menu__list">
      <li class="meatballs-menu__item">
        <button class="meatballs-menu__link">Item 1</button>
      </li>
      <li class="meatballs-menu__item">
        <button class="meatballs-menu__link">Item 2</button>
      </li>
      <li class="meatballs-menu__item">
        <button class="meatballs-menu__link">Item 3</button>
      </li>
    </ul>
  </nav>
</div>

Por defecto la lista de items se muestra del lado izquierdo, para que sea del lado derecho se debe añadir la clase meatballs-menu--right. Para cambiar la orientación del ícono se utiliza la clase meatballs-menu--horizontal y para cambiar el color a blanco meatballs-menu--white. Para cerrar el menú se debe dar click en cualquier parte de la página o presionando la tecla ESC.