RegExr: toggle sidebar

Allows you to toggle sidebar on RegExr.com

2017-01-28 기준 버전입니다. 최신 버전을 확인하세요.

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name         RegExr: toggle sidebar
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Allows you to toggle sidebar on RegExr.com
// @author       Himalay
// @match        http://regexr.com/
// @grant        none
// ==/UserScript==

(function () {
  'use strict';

  document.head.appendChild(Object.assign(document.createElement('style'), {
    innerText: `#menuToggle {
                    font-weight: 900;
                    color: #101113;
                    margin-right: 10px;
                  }

                  .sidemenu {
                    position:absolute;
                    float: none;
                    left: -352px;
                  }

                  .mainarea {
                    float: none;
                    width: 100%;
                  }`
  }));

  toggleSidemenu();

  document.querySelector('#docview  .title').prepend(Object.assign(document.createElement('a'), {
    id: 'menuToggle',
    innerText: '☰'
  }));

  document.querySelector('#menuToggle').addEventListener('click', toggleSidemenu);

  function toggleSidemenu() {
    document.querySelector('#libview').classList.toggle('sidemenu');
    document.querySelector('#docview').classList.toggle('mainarea');
  }
})();