Last active
September 10, 2024 14:55
-
-
Save evanreichard/968eee1cf83da38c81c155fb775cf3c6 to your computer and use it in GitHub Desktop.
old-reddit-mobile.user.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ==UserScript== | |
| // @name Reddit Tweaks | |
| // @version 0.0.4 | |
| // @match *://old.reddit.com/* | |
| // @downloadURL https://gist.githubusercontent.com/evanreichard/968eee1cf83da38c81c155fb775cf3c6/raw/old-reddit-mobile.user.js | |
| // @grant GM.addStyle | |
| // @grant GM.registerMenuCommand | |
| // @grant GM.unregisterMenuCommand | |
| // @grant GM.getValue | |
| // @grant GM.setValue | |
| // @grant GM_getValue | |
| // @noframes | |
| // @run-at document-start | |
| // ==/UserScript== | |
| let isEnabled = GM_getValue("enabled") | |
| let activeStyleElement; | |
| async function toggleStyle(){ | |
| let currentlyEnabled = await GM.getValue('enabled', true); | |
| if (currentlyEnabled){ | |
| activeStyleElement?.remove(); | |
| GM.unregisterMenuCommand('Style - Disable'); | |
| GM.registerMenuCommand('Style - Enable', toggleStyle); | |
| } else { | |
| applyStyle(); | |
| GM.unregisterMenuCommand('Style - Enable'); | |
| GM.registerMenuCommand('Style - Disable', toggleStyle); | |
| } | |
| isEnabled = !currentlyEnabled | |
| await GM.setValue('enabled', isEnabled); | |
| } | |
| function applyStyle(){ | |
| // Add Mobile Styles | |
| activeStyleElement = GM.addStyle(` | |
| :root { | |
| --color1: rgba(230, 240, 255, 0.7); /* Very light blue */ | |
| --color2: rgba(255, 240, 230, 0.7); /* Very light peach */ | |
| --color3: rgba(240, 255, 240, 0.7); /* Very light green */ | |
| --color4: rgba(255, 240, 255, 0.7); /* Very light magenta */ | |
| } | |
| /* Hide Headers, Siders, Promoted & Rank */ | |
| .side, | |
| .footer-parent, | |
| .rank, | |
| #sr-header-area, | |
| .mobile-web-redirect-bar, | |
| .link.promotedlink, | |
| .infobar.listingsignupbar { | |
| display: none; | |
| } | |
| /* Override Last Clicked Style */ | |
| .link.last-clicked { | |
| border: unset; | |
| border-bottom: 1px solid; | |
| background-color: #DDDDDD; | |
| } | |
| /* Comment Border Removal */ | |
| .comment .child, .comment .showreplies { | |
| border-left: unset; | |
| } | |
| /* Comment Colors */ | |
| .comment { | |
| padding: 10px; | |
| border-radius: 10px; | |
| border: 1px solid #bbbbbb; | |
| margin: 5px 0px; | |
| background-color: var(--color1); | |
| filter: hue-rotate(90deg); | |
| } | |
| .comment .entry { | |
| filter: hue-rotate(-90deg); | |
| } | |
| .link { | |
| margin-bottom: 5px; | |
| padding-bottom: 5px; | |
| border-bottom: 1px solid; | |
| } | |
| #header-bottom-right { | |
| top: 0; | |
| bottom: unset; | |
| border-bottom-left-radius: 7px; | |
| border-top-left-radius: unset; | |
| } | |
| #header-bottom-left { | |
| display: flex; | |
| flex-wrap: wrap; | |
| justify-content: space-between; | |
| } | |
| .tabmenu { | |
| width: 100%; | |
| display: flex; | |
| margin-bottom: 2px; | |
| } | |
| .tabmenu li a { | |
| padding: 2px 15px 2px 15px; | |
| } | |
| .pagename, .tabmenu { | |
| align-content: end; | |
| } | |
| .expando .md { | |
| max-width: unset; | |
| } | |
| .nextprev { | |
| display: flex; | |
| justify-content: center; | |
| gap: 100px; | |
| } | |
| .nextprev a { | |
| height: 30px; | |
| display: block; | |
| width: 100px; | |
| text-align: center; | |
| align-content: center; | |
| } | |
| .nextprev .separator { | |
| display: none; | |
| } | |
| `); | |
| // Enable Better Mobile Scaling | |
| const metaViewportElement = document.createElement('meta'); | |
| metaViewportElement.setAttribute('name', 'viewport'); | |
| metaViewportElement.setAttribute('content', 'width=device-width, initial-scale=0.9'); | |
| document.head.appendChild(metaViewportElement); | |
| // Remove Subreddit Style | |
| document.head.querySelector("[ref=applied_subreddit_stylesheet]")?.remove() | |
| // Remove Subreddit Header Image | |
| let aElem = document.querySelector("#header-bottom-left a") | |
| if (aElem) { | |
| aElem.outerHTML = `<a href="/" id="header-img" class="default-header" title="">reddit.com</a>` | |
| } | |
| // Move Expando -> Full Width | |
| Array.from(document.querySelectorAll(".expando")).forEach(item => { | |
| item.parentElement?.parentElement?.appendChild(item) | |
| }) | |
| // Remove Pagination Text | |
| let allNodes = document.querySelector(".nextprev")?.childNodes || []; | |
| if (allNodes.length > 0 && allNodes[0].textContent === "view more: ") allNodes[0].remove() | |
| } | |
| // Expand / Collapse on Comment Click | |
| document.addEventListener("click", evt => { | |
| if (!isEnabled) return; | |
| const isExpand = evt.target.classList.contains("expand"); | |
| if (isExpand) return; | |
| const foundComment = evt.target.closest(".comment") | |
| if (!foundComment) return; | |
| const foundExpander = foundComment.querySelector(".expand"); | |
| if (!foundExpander) return; | |
| foundExpander.click(); | |
| }) | |
| if (isEnabled === true){ | |
| applyStyle(); | |
| GM.registerMenuCommand('Style - Disable', toggleStyle); | |
| } else { | |
| GM.registerMenuCommand('Style - Enable', toggleStyle); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment