☰

Toggle Reddit Sidebar

Adds a button to toggle the sidebar on Reddit, with the option to have it hidden or shown by default.

  1. // ==UserScript==
  2. // @name         Toggle Reddit Sidebar
  3. // @namespace    toggle-reddit-sidebar
  4. // @version      1.0
  5. // @description  Adds a button to toggle the sidebar on Reddit, with the option to have it hidden or shown by default.
  6. // @author       GemedetAdept
  7. // @match        *://*.reddit.com/*
  8. // @credits      Adapted, with permission, from "Hide Reddit Side Bar" script by u/pm_all_ahri_art @ https://greasyfork.org/en/scripts/375201-hide-reddit-side-bar
  9. // @license      GNU v3.0
  10. // ==/UserScript==
  11.  
  12. var IsHidden = true;
  13.  
  14. var sidebar = document.querySelector(".side");
  15. sidebar.style.overflow = "hidden";
  16.  
  17. function toggleSidebar () {
  18.  
  19. 	if (IsHidden == true) {
  20.  
  21. 		sidebar.style.height = "";
  22. 		sidebar.style.width = "";
  23. 		IsHidden = false;
  24. 	}
  25.  
  26. 	else if (IsHidden == false) {
  27.  
  28. 		sidebar.style.height = "0px";
  29. 		sidebar.style.width = "0px";
  30. 		IsHidden = true;
  31. 	}
  32. }
  33.  
  34. var togglebutton = document.createElement("button");
  35. var toggletext = document.createTextNode("toggleBar");
  36. togglebutton.appendChild(toggletext);
  37.  
  38. togglebutton.style.fontSize = "10px";
  39. togglebutton.style.fontWeight = "bold";
  40. togglebutton.style.left = "4px";
  41. togglebutton.style.color = "#81b3d9";
  42.  
  43. togglebutton.addEventListener("click", toggleSidebar);
  44.  
  45. var navBar = document.querySelector("#header");
  46. var buttonSection = navBar.querySelector("#header-bottom-right");
  47. var itemBarDivider = buttonSection.querySelector(".logout.hover");
  48.  
  49. buttonSection.appendChild(togglebutton);
  50. itemBarDivider.append(" | ");
  51. itemBarDivider.style.color = "#808080";
  52.  
  53. if (IsHidden == true) {
  54.  
  55. 	sidebar.style.height = "0px";
  56. 	sidebar.style.width = "0px";
  57. }
  58.  
  59. else if (IsHidden == false) {
  60.  
  61. 	sidebar.style.height = "";
  62. 	sidebar.style.width = "";
  63. }