Today we mess around with CSS Flexbox. Mozilla MDN explains this well, much better than I can be bothered to right now ;) here. This YouTube video is also really good at explaining it

Repo here and demo is here.

JS code snippet below:

    const panels = document.querySelectorAll('.panel');

    function toggleOpen() {

    function toggleActive(e) {
      if (e.propertyName.includes('flex')) {

    panels.forEach(panel => panel.addEventListener('click', toggleOpen));
    panels.forEach(panel => panel.addEventListener('transitionend', toggleActive));