JSFiddle - React, Tailwind, and code Playground
HTML
<section id="main_menu" class="menu">
<header id="menu_title">
<h1>HTML5 / CSS3</h1>
</header>
<section id="translate" class="sub_menu">
<header>
<h2>2D Translate</h2>
</header>
<section id="javascript" class="sub_sub_menu">
<header>
<h3>Javascript</h3>
</header>
<div class="button">
<button id="button_translate_2d" onclick="mainStart(command.TRANSLATE_2D, 'div_translate_2d')">
<p>translate_2d</p>
</button>
</div>
<div class="button">
<button id="button_translate_x" onclick="mainStart(command.TRANSLATE_X, 'div_translate_2d')">
<p>translateX</p>
</button>
</div>
</section>
<section id="matrix_2d" class="sub_menu">
<header>
<h3>Matrix 2D</h3>
</header>
<div class="button">
<button id="button_matrix_2d_translate" onclick="mainStart(command.TRANSLATE_MATRIX_2D, 'div_translate_2d')">
<p>translate</p>
</button>
</div>
</section>
</section>
<section id="rotation" class="sub_menu">
<header>
<h2>2D Rotation</h2>
</header>
<section id="javascript" class="sub_sub_menu">
<header>
<h3>Javascript</h3>
</header>
<div class="button">
<button id="button_rotate_x_3d" onclick="mainStart(command.ROTATE_X_3D, 'div_rotate_2d')">
<p>rotateX_3d</p>
</button>
</div>
<div class="button">
<button id="button_rotate_x" onclick="mainStart(command.ROTATE_X, 'div_rotate_2d')">
<p>rotateX</p>
</button>
</div>
</section>
<section id="matrix_2d" class="sub_menu">
<header>
<h3>Matrix 2D</h3>
</header>
<div class="button">
<button id="button_matrix_3d_rotate_x"...