JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.0.0/raphael-min.js"></script>
<div id="menu"></div>

<div id="text"> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi faucibus est metus, elementum <a href="#" id="switch">tincidunt</a> nibh egestas eget.
</div>

CSS

* {
    margin: 0;
    padding: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body {
    height: 100%;
}
#menu { 
    width: 50%;
    background: #60F;
    padding: 2.5%;
}
#menu svg { 
    display: block;
    width: 100%;
    height: 100%;
    max-height: 100%;
}
#text { 
    width: 50%;
    background: #309;
    padding: 2.5%;
} 
#text, #text a {
    color: #FFF;
}

JavaScript

var menu = Raphael('menu', '100%', '100%');

menu.setViewBox('0', '0', '50', '50', true);

var menu_bg = menu.rect(0,0, 50, 50);
    menu_bg.attr({
        id : 'menu_bg',
        'stroke-width' : '0',
        'fill' : '#000'}).data('id', 'menu_bg');

var menu_line_1 = menu.rect(12.9, 12.9, 24.1, 4);
    menu_line_1.attr({
        id : 'menu_line_1',
        x : '12.9',
        y : '12.9',
        fill : '#FFF',
        'stroke-width' : '0'}).data('id','menu_line_1'); 
   
var menu_line_2 = menu.rect(12.9, 23, 24.1, 4);
    menu_line_2.attr({
        id : 'menu_line_2',
        x : '12.9',
        y : '23',
        fill : '#FFF',
        'stroke-width' : '0'}).data('id','menu_line_2');

var menu_line_3 = menu.rect(12.9, 33.1, 24.1, 4);
    menu_line_3.attr({
        id : 'menu_line_3',
        x : '12.9',
        y : '33.1',
        fill : '#FFF',
        'stroke-width' : '0'}).data('id','menu_line_3');

$(function(){
  
  var btn_state = false; 
    
  $('#switch').click(function(){
      if(btn_state === false){ 
        menu_bg.attr({fill: '#EEE'});
        menu_line_1.attr({fill: '#000'});
        menu_line_2.attr({fill: '#000'});
        menu_line_3.attr({fill: '#000'});
        btn_state = true;
      }
      else { 
        menu_bg.attr({fill: '#000'});
        menu_line_1.attr({fill: '#FFF'});
        menu_line_2.attr({fill: '#FFF'});
        menu_line_3.attr({fill: '#FFF'});
        btn_state = false;
      }   
    });
    
});