Compare commits

...

2 Commits

Author SHA1 Message Date
38eee1eb44 rework style code to use a switch statement 2024-03-21 08:47:57 -03:00
8829166139 reorg custom style code again 2024-03-21 08:40:09 -03:00

View File

@ -1,164 +1,253 @@
// Inspired by the Stylus app: <https://addons.mozilla.org/en-GB/firefox/addon/styl-us/> // Inspired by the Stylus app: <https://addons.mozilla.org/en-GB/firefox/addon/styl-us/>
// Main part of the code: switch on the domain and select the corresponding style
var styles = null; var styles = null;
switch (document.domain) {
/* case "forum.effectivealtruism.org":
styles = `
.class /*
#id
*/
if (document.domain == "forum.effectivealtruism.org") {
styles = `
/*
.Layout-main { .Layout-main {
margin-left: 100px; margin-left: 100px;
} }
.SingleColumnSection-root { .SingleColumnSection-root {
width: 1000px !important; width: 1000px !important;
max-width: 1400px !important; max-width: 1400px !important;
padding-left: 100px !important; padding-left: 100px !important;
} }
.NavigationStandalone-sidebar { .NavigationStandalone-sidebar {
display: none; display: none;
} }
.intercom-lightweight-app{ .intercom-lightweight-app{
display: none; display: none;
} }
*/ */
`; `;
break;
case "nationstates.net":
styles = `
.adidentifier {
display: none;
}
`;
break;
case "mail.proton.me":
styles = `
/*
.item-container-row.read, .item-container.read {
background-color: white;
}
.item-container-row.unread, .item-container.unread {
background-color: #E8E8E8;
}
.selection .item-container-row.item-is-selected, .item-container.item-is-selected {
background-color: var(--selection-background-color) !important;
}
zoom: 0.625 !important;
*/
`;
break;
case "forum.nunosempere.com":
styles = `
body {
zoom: 0.625 !important;
}
`;
break;
case "search.nunosempere.com":
styles = `
/*
body {
zoom: 1.8;
}
*/
footer {
display: none;
}
`;
break;
case "reddit.com":
// fallthrough
case "old.reddit.com":
styles = `
/* kill sidebar ads */
.ad-container,
a[href^="https://alb.reddit.com"]
a[href="/premium"],
[data-promoted^="true"],
#eu-cookie-policy,
.infobar-toaster-container,
.listingsignupbar,
.native-ad-container,
.native-sidebar-ad,
.premium-banner-outer,
{
display: none !important;
}
`;
break;
case "twitter.com":
styles = `
/* hide promoted tweets */
:has(meta[property="og:site_name"][content="Twitter"])
[data-testid="cellInnerDiv"]:has(svg + [dir="auto"]) {
display: none;
}
[data-testid^="placementTracking"] {
display: none;
}
/* hide what's happening section */
:has(meta[property="og:site_name"][content="Twitter"])
[aria-label="Timeline: Trending now"] {
display: none !important;
}
[data-testid^="sidebarColumn"] {
display: none;
}
/* Hide DMs v2 */
[data-testid^="DMDrawerHeader"] {
display: none;
}
/* Tweak main column */
[data-testid^="primaryColumn"] {
min-width: 900px;
max-width: 900px;
}
[data-testid^="cellInnerDiv"] {
min-width: 700px;
max-width: 700px;
}
[aria-label^="Timeline: Conversation"]{
margin-left: 145px;
}
[data-testid^="DMDrawer"]{
display: none;
}
/* Delete a few unused or annoying elements */
[aria-label^="Verified Orgs"] {
display: none;
}
[aria-label^="Lists"] {
display: none;
}
[aria-label^="Communities"] {
display: none;
}
[aria-label^="Primary"] {
margin-top: 50px;
}
[role^="progressbar"]{
display: none;
}
/* hide video */
[data-testid^="videoPlayer"] {
display: none !important;
}
/* No change of colors in hover */
*:hover {
/* background-color: white !important; */
background-color: !important;
transition: none !important;
}*/
/*
*:hover {
background-color: inherit !important;
transition: none !important;
}*/
/* Hide go to top button */
[aria-label^="New posts are available. Push the period key to go to the them."]{
display: none;
}
/* No transparency at the top */
[aria-live^="polite"]{
background: white !important;
}
`;
break;
default:
console.log("No custom style");
} }
if (document.domain == "nationstates.net") { if (styles != null) {
styles = ` var styleSheet = document.createElement("style");
.adidentifier { styleSheet.innerText = styles;
display: none; document.head.appendChild(styleSheet);
console.log("Style changed");
}
// Extra: Replace default alert with new function
// whose style can be changed!
window.alert = (message) => {
let alertDiv = document.getElementById("customAlert");
if (!alertDiv) {
const html = `
<div id="customAlert" class="custom-alert">
<div class="custom-alert-content">
<p id="alertMessage"></p>
<button id="alertOkButton">OK</button>
</div>
</div>
<style>
.custom-alert {
display: none;
position: fixed;
z-index: 999;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0,0,0,0.4);
}
.custom-alert-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
font-family: monospace; /* Use monospace font */
}
.visible {
display: block;
}
</style>
`;
document.body.insertAdjacentHTML("beforeend", html);
alertDiv = document.getElementById("customAlert");
document.getElementById("alertOkButton").onclick = () => {
alertDiv.classList.remove("visible");
document.removeEventListener("keydown", dismissAlert);
};
}
const dismissAlert = (event) => {
if (
event.key === "Enter" /*&& event.ctrlKey*/ &&
alertDiv.classList.contains("visible")
) {
alertDiv.classList.remove("visible");
document.removeEventListener("keydown", dismissAlert);
} }
`; };
}
if (document.domain == "mail.proton.me") { document.addEventListener("keydown", dismissAlert);
styles = ` document.getElementById("alertMessage").textContent = message;
/* alertDiv.classList.add("visible");
.item-container-row.read, .item-container.read { };
background-color: white;
}
.item-container-row.unread, .item-container.unread {
background-color: #E8E8E8;
}
.selection .item-container-row.item-is-selected, .item-container.item-is-selected {
background-color: var(--selection-background-color) !important;
}
zoom: 0.625 !important;
*/
`;
}
if (document.domain == "forum.nunosempere.com") {
styles = `
body {
zoom: 0.625 !important;
}
`;
}
if (document.domain == "search.nunosempere.com") {
styles = `
body {
/* zoom: 1.8; */
}
footer { // Extra: hide video players on twitter
display: none;
}
`;
}
if (document.domain == "twitter.com") { if (document.domain == "twitter.com") {
styles = `
/* hide promoted tweets */
:has(meta[property="og:site_name"][content="Twitter"])
[data-testid="cellInnerDiv"]:has(svg + [dir="auto"]) {
display: none;
}
[data-testid^="placementTracking"] {
display: none;
}
/* hide what's happening section */
:has(meta[property="og:site_name"][content="Twitter"])
[aria-label="Timeline: Trending now"] {
display: none !important;
}
[data-testid^="sidebarColumn"] {
display: none;
}
/* Hide DMs v2 */
[data-testid^="DMDrawerHeader"] {
display: none;
}
/* Tweak main column */
[data-testid^="primaryColumn"] {
min-width: 900px;
max-width: 900px;
}
[data-testid^="cellInnerDiv"] {
min-width: 700px;
max-width: 700px;
}
[aria-label^="Timeline: Conversation"]{
margin-left: 145px;
}
[data-testid^="DMDrawer"]{
display: none;
}
/* Delete a few unused or annoying elements */
[aria-label^="Verified Orgs"] {
display: none;
}
[aria-label^="Lists"] {
display: none;
}
[aria-label^="Communities"] {
display: none;
}
[aria-label^="Primary"] {
margin-top: 50px;
}
[role^="progressbar"]{
display: none;
}
/* hide video */
[data-testid^="videoPlayer"] {
display: none !important;
}
/* No change of colors in hover */
*:hover {
/* background-color: white !important; */
background-color: !important;
transition: none !important;
}*/
/*
*:hover {
background-color: inherit !important;
transition: none !important;
}*/
/* Hide go to top button */
[aria-label^="New posts are available. Push the period key to go to the them."]{
display: none;
}
/* No transparency at the top */
[aria-live^="polite"]{
background: white !important;
}
`;
// Function to hide the grandparent of video players // Function to hide the grandparent of video players
// takes 0.014ms to run, so performance is not the concern here.
// timed with console.time, console.timeEnd
function hideVideoPlayerGrandparent() { function hideVideoPlayerGrandparent() {
document document
.querySelectorAll('[data-testid="videoPlayer"]') .querySelectorAll('[data-testid="videoPlayer"]')
@ -194,92 +283,4 @@ if (document.domain == "twitter.com") {
hideVideoPlayerGrandparent(); hideVideoPlayerGrandparent();
} }
if (document.domain == "reddit.com" || document.domain == "old.reddit.com") {
styles = `
/* kill sidebar ads */
.native-ad-container,
.premium-banner-outer,
.native-sidebar-ad,
.infobar-toaster-container,
#eu-cookie-policy,
.ad-container,
.listingsignupbar,
a[href="/premium"],
[data-promoted^="true"],
a[href^="https://alb.reddit.com"]
{
display: none !important;
}
`;
}
if (styles != null) {
var styleSheet = document.createElement("style");
styleSheet.innerText = styles;
document.head.appendChild(styleSheet);
console.log("Style changed");
}
// Replace default alert with new function
// whose style can be changed!
window.alert = (message) => {
let alertDiv = document.getElementById("customAlert");
if (!alertDiv) {
const html = `
<div id="customAlert" class="custom-alert">
<div class="custom-alert-content">
<p id="alertMessage"></p>
<button id="alertOkButton">OK</button>
</div>
</div>
<style>
.custom-alert {
display: none;
position: fixed;
z-index: 999;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0,0,0,0.4);
}
.custom-alert-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
font-family: monospace; /* Use monospace font */
}
.visible {
display: block;
}
</style>
`;
document.body.insertAdjacentHTML("beforeend", html);
alertDiv = document.getElementById("customAlert");
document.getElementById("alertOkButton").onclick = () => {
alertDiv.classList.remove("visible");
document.removeEventListener("keydown", dismissAlert);
};
}
const dismissAlert = (event) => {
if (
event.key === "Enter" /*&& event.ctrlKey*/ &&
alertDiv.classList.contains("visible")
) {
alertDiv.classList.remove("visible");
document.removeEventListener("keydown", dismissAlert);
}
};
document.addEventListener("keydown", dismissAlert);
document.getElementById("alertMessage").textContent = message;
alertDiv.classList.add("visible");
};
// ^ takes 0.014ms to run, so performance is not the concern here.
// timed with console.time, console.timeEnd
document.body.style.visibility = "visible"; document.body.style.visibility = "visible";