☰

RegExr: toggle sidebar

Allows you to toggle sidebar on RegExr.com

  1. // ==UserScript==
  2. // @name         RegExr: toggle sidebar
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1
  5. // @description  Allows you to toggle sidebar on RegExr.com
  6. // @author       Himalay
  7. // @match        http://regexr.com/
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function () {
  12.   'use strict';
  13.  
  14.   document.head.appendChild(Object.assign(document.createElement('style'), {
  15.     innerText: `#menuToggle {
  16.                     font-weight: 900;
  17.                     color: #101113;
  18.                     margin-right: 10px;
  19.                   }
  20.  
  21.                   .sidemenu {
  22.                     position:absolute;
  23.                     float: none;
  24.                     left: -352px;
  25.                   }
  26.  
  27.                   .mainarea {
  28.                     float: none;
  29.                     width: 100%;
  30.                   }`
  31.   }));
  32.  
  33.   toggleSidemenu();
  34.  
  35.   document.querySelector('#docview  .title').prepend(Object.assign(document.createElement('a'), {
  36.     id: 'menuToggle',
  37.     innerText: '☰'
  38.   }));
  39.  
  40.   document.querySelector('#menuToggle').addEventListener('click', toggleSidemenu);
  41.  
  42.   function toggleSidemenu() {
  43.     document.querySelector('#libview').classList.toggle('sidemenu');
  44.     document.querySelector('#docview').classList.toggle('mainarea');
  45.   }
  46. })();