JSFiddle - React, Tailwind, and code Playground

by anastacia_tymush

HTML

<ul>
  <li>
    <label for="item1">Пункт меню</label>
    <input type="checkbox" id="item1">
    <ul>
      <li>Підменю</li>
      <li>Підменю</li>
      <li>Підменю</li>
    </ul>
  </li>
  <li>
    <label for="item2">Пункт меню</label>
    <input type="checkbox" id="item2" checked>
    <ul>
      <li>Підменю</li>
      <li>Підменю</li>
      <li>Підменю</li>
    </ul>
  </li>

CSS

label {
  cursor: pointer;
  user-select: none;
  -moz-user-select: none;
}

ul ul {
  display: none;
}

ul input:checked+ul {
  display: block;
}

input {
  display: none;
}