name-color 0.2

This commit is contained in:
mehbark 2024-07-10 19:50:07 -04:00
parent 1a3b2dd3d8
commit 1d526e8365
2 changed files with 21 additions and 8 deletions

View file

@ -67,7 +67,7 @@ function cssify({ requester }: { requester?: string }): string {
if (!color) continue; if (!color) continue;
vars += `--name-color-${name}: ${color};\n`; vars += `--name-color-${name}: ${color};\n`;
classes += classes +=
`a[href$='${name}']{color: var(--name-color-${name}) !important;}\n`; `a[href$='/${name}']{color: var(--name-color-${name}) !important;}\n`;
} }
vars += "}\n\n"; vars += "}\n\n";
return preamble + vars + classes; return preamble + vars + classes;

View file

@ -1,7 +1,7 @@
// ==UserScript== // ==UserScript==
// @name name-color: cohost edition! // @name name-color: cohost edition!
// @namespace https://terezi.pyrope.net // @namespace https://terezi.pyrope.net
// @version 2024-07-10 // @version 0.2
// @description colors names based on `name-color:` statements in profiles. there are no other editions // @description colors names based on `name-color:` statements in profiles. there are no other editions
// @author mehbark // @author mehbark
// @match https://*.cohost.org/* // @match https://*.cohost.org/*
@ -32,6 +32,7 @@ function doit() {
); );
const names = [...new Set(mentions.map(mentionee))]; const names = [...new Set(mentions.map(mentionee))];
names.sort();
const requester = document const requester = document
.querySelector("header") .querySelector("header")
@ -39,23 +40,35 @@ function doit() {
.innerText.slice(1); .innerText.slice(1);
const url = new URL("https://pyrope.net/name-color/style.css"); const url = new URL("https://pyrope.net/name-color/style.css");
url.searchParams.append("requester", requester); url.searchParams.append("requester", requester);
for (const name of names) { for (const name of names) {
url.searchParams.append("name", name); url.searchParams.append("name", name);
} }
let style = document.head.querySelector("#name-color-stylesheet"); let style = document.head.querySelector(".name-color-stylesheet");
if (!style) { if (style) {
const style2 = document.createElement("link");
style2.rel = "stylesheet";
style2.href = url.toString();
style2.onload = () => {
document.head.querySelectorAll(".name-color-stylesheet").forEach(s => s.remove());
style2.className = "name-color-stylesheet";
};
style2.count = style.count + 1;
console.log(style2.count);
document.head.appendChild(style2);
} else {
style = document.createElement("link"); style = document.createElement("link");
style.id = "name-color-stylesheet"; style.className = "name-color-stylesheet";
style.rel = "stylesheet"; style.rel = "stylesheet";
style.href = url.toString();
style.count = 0;
document.head.appendChild(style); document.head.appendChild(style);
} }
style.href = url.toString();
} }
new MutationObserver(doit).observe(document, { new MutationObserver(doit).observe(document.body, {
subtree: true, subtree: true,
childList: true, childList: true,
}); });