GetOpenScript/Reddit.openscript
1
0
Fork 0
mirror of https://github.com/GetOpenScript/Reddit.openscript.git synced 2026-09-18 08:05:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove scrollbars by adding box-sizing and hiding tab overflow scrollbars

Browse Source
This commit is contained in:
multipleof4
2026-09-13 14:19:04 -07:00
parent 382fafdf7a
commit b20ad95a0d
1 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
YouTube.os.js
View File

@@ -1,6 +1,6 @@
// ==UserScript== // ==UserScript==
// @name Reddit Comments on YouTube // @name Reddit Comments on YouTube
// @version 1.0.2 // @version 1.0.3
// @description View Reddit discussion threads and comments in Old Reddit UI directly above YouTube comments. // @description View Reddit discussion threads and comments in Old Reddit UI directly above YouTube comments.
// @match https://www.youtube.com/* // @match https://www.youtube.com/*
// @run-at document_idle // @run-at document_idle
@@ -20,6 +20,9 @@ const ensureStyles = () => {
const style = document.createElement('style'); const style = document.createElement('style');
style.id = STYLE_ID; style.id = STYLE_ID;
style.textContent = ` style.textContent = `
#${MOUNT_ID}, #${MOUNT_ID} * {
box-sizing: border-box;
}
#${MOUNT_ID} { #${MOUNT_ID} {
margin: 16px 0 24px; margin: 16px 0 24px;
font-family: Verdana, Arial, Helvetica, sans-serif; font-family: Verdana, Arial, Helvetica, sans-serif;
@@ -35,18 +38,22 @@ const ensureStyles = () => {
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow-x: auto; overflow-x: auto;
border-bottom: 1px solid #ddd; overflow-y: hidden;
scrollbar-width: none;
-ms-overflow-style: none;
position: relative;
z-index: 2;
} }
html[dark] .os-tabs { .os-tabs::-webkit-scrollbar {
border-bottom-color: #383838; display: none;
width: 0;
height: 0;
} }
.os-tab { .os-tab {
background: #f1f1f1; background: #f1f1f1;
border: 1px solid #ddd; border: 1px solid #ddd;
border-bottom: none;
display: flex; display: flex;
flex: 1; flex: 1 1 0;
min-width: 120px;
font-size: 12px; font-size: 12px;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@@ -55,7 +62,9 @@ const ensureStyles = () => {
color: #333; color: #333;
user-select: none; user-select: none;
text-decoration: none; text-decoration: none;
margin-right: -1px; }
.os-tab:not(:first-child) {
border-left: none;
} }
html[dark] .os-tab { html[dark] .os-tab {
background: #202020; background: #202020;
@@ -73,13 +82,12 @@ const ensureStyles = () => {
background: #fff; background: #fff;
color: #000; color: #000;
font-weight: bold; font-weight: bold;
border-bottom: 1px solid #fff; border-bottom-color: #fff;
margin-bottom: -1px;
} }
html[dark] .os-tab.os-active { html[dark] .os-tab.os-active {
background: #0f0f0f; background: #0f0f0f;
color: #fff; color: #fff;
border-bottom: 1px solid #0f0f0f; border-bottom-color: #0f0f0f;
} }
.os-tab .os-count { .os-tab .os-count {
color: #888; color: #888;