JSFiddle - React, Tailwind, and code Playground

HTML

<div id="verticalMenu" class="vMenu">
		<a href="javascript:void(0)" class="toggleIcon" onclick="SwitchTab()">X</a>
		<a href="#">Main</a>
		<a href="#">Shop</a>
		<a href="#">Products</a>
		<a href="#">Contact</a>
		<a href="#">Carier</a>
	</div>
	
	<div id="manage" onclick="SwitchTab()">
		<div class="tab1"></div>
		<div class="tab2"></div>
		<div class="tab3"></div>
		<p>Click in this icon on top to active menu on the left side</p>
	</div>

CSS

body
{
	font-family: Arial;
}

.vMenu
{
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 1;
	top: 0;
	left: 0;
	background-color: #6495ED;
	overflow-x: hidden;
	transition: 0.4s;
	padding-top: 60px;
}

.vMenu a
{
	padding: 8px 8px 8px 32px;
	text-decoration: none;
	font-size: 18px;
	color: #ffffff;
	display: block;
	transition: 0.3s;
}

.vMenu a:hover
{
	color: #808080;
}

.vMenu .toggleIcon
{
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px; 
	margin-left: 50px;
}
/*
.openBtn
{
	font-size: 20px;
	cursor: pointer;
	background-color: #111;
	color: white;
	padding: 10px 15px;
	border: none;
}
*/
#manage
{
	transition: margin-left .5s;
}

@media screen and (max-height: 450px)
{
	.sideBar
	{
		padding-top: 15px;
	}
	
	.sideBar a
	{
		font-size: 18px;
	}
	
}

.tab1, .tab2, .tab3
{
	width: 35px;
	height: 5px;
	background-color: #333;
	margin: 6px 0;
	transition: 0.4s;
}


/* Style dla transformacji buttona kanapki */

.change .tab1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px);
  transform: rotate(-45deg) translate(-9px, 6px);
}

.change .tab2 {opacity: 0;}

.change .tab3 {
  -webkit-transform: rotate(45deg) translate(-8px, -8px);
  transform: rotate(45deg) translate(-8px, -8px);

JavaScript

var MenuHidden = true;
     
function ShowMenu() {
	document.getElementById("manage").classList.toggle("change");
  document.getElementById("verticalMenu").style.width = "250px";
  document.getElementById("manage").style.marginLeft = "250px";
  MenuHidden = !MenuHidden;
}     

function HideMenu() {
	document.getElementById("manage").classList.toggle("change");
	document.getElementById("verticalMenu").style.width = "0px";
  document.getElementById("manage").style.marginLeft = "0px";
  MenuHidden = !MenuHidden;
}
      
function SwitchTab() {
	if (MenuHidden) ShowMenu(); else HideMenu();
}