JSFiddle - React, Tailwind, and code Playground

by tonyleeper

HTML

<div class="box"></div>
<button id="toggle">toggle</button>

CSS

.box {
  width: calc(100% - 100px);
  transition: width 1s;
  background-color: blue;
  height: 100px;
}

.box.small {
  width: 50px;
}

JavaScript

var toggler = document.getElementById('toggle');
toggler.addEventListener('click', function (event) {
	var box = document.getElementsByClassName('box')[0];
  box.classList.toggle('small');
});