JSFiddle - React, Tailwind, and code Playground

HTML

<a class="" href="#">Кнопка</a>


<div class=main></div>

CSS

@import url(https://fonts.googleapis.com/css?family=Arimo:400,400italic,700,700italic);
body {
  height: 1500px;
  padding: 0;
  margin: 0;
  font-family: 'Arimo', sans-serif;
}

a {
	color: #321312;
}

.main {
 
  
  height: 100%;
  background-color: #2D3142;
  -webkit-transition: transform .7s ease-in-out;
  -moz-transition: transform .7s ease-in-out;
  -ms-transition: transform .7s ease-in-out;
  -o-transition: transform .7s ease-in-out;
  transition: transform .7s ease-in-out;
}


.move-to-left {
  -webkit-transform: translateX(-400px);
  -moz-transform: translateX(-400px);
  -ms-transform: translateX(-400px);
  -o-transform: translateX(-400px);
  transform: translateX(-400px);
}

JavaScript

$(document).ready(function() {

  $("a").on("click", function() {
    $(".main").toggleClass("move-to-left");
  });

});