JSFiddle - React, Tailwind, and code Playground

by Oleh Aloshkin

HTML

<div>

</div>

SCSS

div {
  width: 300px;
  height: 200px;
  background: #000;
  transition: width 1s;
  &.small {
    width: 50px;
  }
}

JavaScript

document.querySelector('div').addEventListener('click', function(e) {
	if (this.classList.contains('small')) {
  	this.classList.remove('small');
    return;
  }
  this.classList.add('small');
});