Plugin panel for tri.pengpowers.xyz with global Quick CSS support and paint palette icon
当前为
// ==UserScript==
// @name BetterTriangulet with Quick CSS 🎨
// @version 1.19
// @description Plugin panel for tri.pengpowers.xyz with global Quick CSS support and paint palette icon
// @match https://tri.pengpowers.xyz/*
// @grant none
// @namespace https://gf.qytechs.cn/users/1479014
// ==/UserScript==
(function () {
'use strict';
// === Load stored CSS from localStorage on all pages ===
function loadGlobalQuickCSS() {
const enabled = localStorage.getItem("quickCSS_enabled") === "true";
const css = localStorage.getItem("betterTriangulet_quickCSS") || "";
if (!enabled || !css) return;
let existing = document.getElementById("betterTrianguletQuickCSS");
if (!existing) {
existing = document.createElement("style");
existing.id = "betterTrianguletQuickCSS";
document.head.appendChild(existing);
}
existing.textContent = css;
}
loadGlobalQuickCSS();
// === Load Titan One font ===
const titanFont = document.createElement("link");
titanFont.href = "https://fonts.googleapis.com/css2?family=Titan+One&display=swap";
titanFont.rel = "stylesheet";
document.head.appendChild(titanFont);
// === Quick CSS Panel Functions ===
function applyQuickCSS(css) {
let styleTag = document.getElementById("betterTrianguletQuickCSS");
if (!styleTag) {
styleTag = document.createElement("style");
styleTag.id = "betterTrianguletQuickCSS";
document.head.appendChild(styleTag);
}
styleTag.textContent = css || "";
}
function injectQuickCSSPanel() {
if (document.getElementById("betterTrianguletQuickCSSPanel")) return;
const mainContainer = document.querySelector(".styles__mainContainer___4TLvi-camelCase");
if (!mainContainer) return;
const panel = document.createElement("div");
panel.id = "betterTrianguletQuickCSSPanel";
panel.className = "styles__infoContainer___2uI-S-camelCase";
const theme = localStorage.getItem("theme");
const themeColors = {
Purple: '#4d136b',
Green: '#265b09',
Blue: '#132a6b',
Red: '#6b1313',
Orange: '#6b3b13',
Yellow: '#6b6a13',
Pink: '#6b134a',
White: '#e6e6e6',
Black: '#000000'
};
panel.style.backgroundColor = themeColors[theme] || "var(--container)";
const headerRow = document.createElement("div");
headerRow.className = "styles__headerRow___1tdPa-camelCase";
const icon = document.createElement("i");
icon.className = "fas fa-palette styles__headerIcon___1ykdN-camelCase";
icon.setAttribute("aria-hidden", "true");
const headerText = document.createElement("div");
headerText.className = "styles__infoHeader___1lsZY-camelCase";
headerText.textContent = "Quick CSS";
headerRow.appendChild(icon);
headerRow.appendChild(headerText);
const textarea = document.createElement("textarea");
textarea.id = "betterTrianguletQuickCSSTextarea";
textarea.placeholder = "Enter your custom CSS here...";
Object.assign(textarea.style, {
width: "100%",
minHeight: "120px",
marginTop: "1vw",
backgroundColor: "rgba(255, 255, 255, 0.05)",
color: "inherit",
border: "1px solid var(--accent)",
borderRadius: "0.3vw",
padding: "0.5vw",
fontFamily: "monospace",
fontSize: "1vw",
resize: "vertical"
});
textarea.value = localStorage.getItem("betterTriangulet_quickCSS") || "";
textarea.addEventListener("input", () => {
const css = textarea.value;
applyQuickCSS(css);
localStorage.setItem("betterTriangulet_quickCSS", css);
});
panel.appendChild(headerRow);
panel.appendChild(textarea);
mainContainer.appendChild(panel);
applyQuickCSS(textarea.value);
}
function removeQuickCSSPanel() {
const panel = document.getElementById("betterTrianguletQuickCSSPanel");
if (panel) panel.remove();
const styleTag = document.getElementById("betterTrianguletQuickCSS");
if (styleTag) styleTag.remove();
}
// === Modal Plugin Manager ===
function createModal() {
const profileBody = document.querySelector(".arts__profileBody___eNPbH-camelCase");
if (!profileBody) return;
const modal = document.createElement("div");
modal.id = "betterTrianguletModalOverlay";
Object.assign(modal.style, {
position: "absolute",
top: profileBody.offsetTop + "px",
left: profileBody.offsetLeft + "px",
width: profileBody.offsetWidth + "px",
height: profileBody.offsetHeight + "px",
zIndex: "9999",
backgroundColor: "var(--container)",
color: "inherit",
borderRadius: "0.5vw",
overflowY: "auto",
padding: "2vw",
fontFamily: "Nunito, sans-serif",
display: "flex",
flexDirection: "column",
boxSizing: "border-box",
});
const closeBtn = document.createElement("div");
closeBtn.textContent = "X";
Object.assign(closeBtn.style, {
position: "absolute",
top: "1vw",
right: "1.2vw",
fontFamily: "'Titan One', sans-serif",
fontSize: "2.5vw",
color: "#ff4d4d",
cursor: "pointer",
userSelect: "none",
zIndex: "10000",
transition: "transform 0.15s ease-in-out"
});
closeBtn.onmouseenter = () => closeBtn.style.transform = "scale(1.2)";
closeBtn.onmouseleave = () => closeBtn.style.transform = "scale(1)";
closeBtn.onclick = () => modal.remove();
const title = document.createElement("div");
title.textContent = "Plugin Manager";
Object.assign(title.style, {
fontSize: "2vw",
fontWeight: "800",
marginBottom: "1vw",
color: "var(--accent)",
userSelect: "none",
});
const content = document.createElement("div");
Object.assign(content.style, {
fontSize: "1.2vw",
flexGrow: "1",
marginBottom: "2vw",
whiteSpace: "pre-wrap",
});
// === Quick CSS Plugin Toggle ===
const quickCSSToggle = document.createElement("label");
quickCSSToggle.textContent = "Quick CSS";
Object.assign(quickCSSToggle.style, {
display: "flex",
alignItems: "center",
justifyContent: "space-between",
marginTop: "1vw",
marginBottom: "1vw",
fontWeight: "bold",
fontSize: "1.2vw",
cursor: "default",
userSelect: "none"
});
const quickCSSCheckbox = document.createElement("input");
quickCSSCheckbox.type = "checkbox";
quickCSSCheckbox.checked = localStorage.getItem("quickCSS_enabled") === "true";
quickCSSCheckbox.onchange = () => {
const enabled = quickCSSCheckbox.checked;
localStorage.setItem("quickCSS_enabled", enabled);
if (enabled) injectQuickCSSPanel();
else removeQuickCSSPanel();
};
quickCSSToggle.appendChild(quickCSSCheckbox);
content.appendChild(quickCSSToggle);
// === Reset Data ===
const resetText = document.createElement("text");
resetText.className = "styles__link___5UR6_-camelCase";
resetText.textContent = "Reset Data";
resetText.style.cursor = "pointer";
resetText.style.textDecoration = "underline";
resetText.style.display = "block";
resetText.onclick = () => {
if (confirm("Clear all localStorage data?")) {
localStorage.clear();
location.reload();
}
};
content.appendChild(resetText);
modal.appendChild(closeBtn);
modal.appendChild(title);
modal.appendChild(content);
profileBody.parentElement.appendChild(modal);
}
// === Inject BetterTriangulet Panel ===
function injectPanel() {
const mainContainer = document.querySelector(".styles__mainContainer___4TLvi-camelCase");
if (!mainContainer || document.getElementById("betterTrianguletBox")) return;
const container = document.createElement("div");
container.className = "styles__infoContainer___2uI-S-camelCase";
container.id = "betterTrianguletBox";
const headerRow = document.createElement("div");
headerRow.className = "styles__headerRow___1tdPa-camelCase";
const icon = document.createElement("i");
icon.className = "fas fa-code styles__headerIcon___1ykdN-camelCase";
icon.setAttribute("aria-hidden", "true");
const headerText = document.createElement("div");
headerText.className = "styles__infoHeader___1lsZY-camelCase";
headerText.textContent = "BetterTriangulet";
headerRow.appendChild(icon);
headerRow.appendChild(headerText);
const pluginDiv = document.createElement("div");
const pluginText = document.createElement("text");
pluginText.className = "styles__link___5UR6_-camelCase";
pluginText.id = "managePlugins";
pluginText.textContent = "Manage Plugins";
pluginText.style.cursor = "pointer";
pluginText.style.textDecoration = "underline";
pluginText.style.display = "block";
pluginText.onclick = () => {
if (!document.getElementById("betterTrianguletModalOverlay")) {
createModal();
}
};
const resetText = document.createElement("text");
resetText.className = "styles__link___5UR6_-camelCase";
resetText.textContent = "Reset Data";
resetText.style.cursor = "pointer";
resetText.style.textDecoration = "underline";
resetText.style.display = "block";
resetText.style.marginTop = "0.5vw";
resetText.onclick = () => {
if (confirm("Clear all localStorage data?")) {
localStorage.clear();
location.reload();
}
};
pluginDiv.appendChild(pluginText);
pluginDiv.appendChild(resetText);
container.appendChild(headerRow);
container.appendChild(pluginDiv);
mainContainer.appendChild(container);
if (localStorage.getItem("quickCSS_enabled") === "true") {
injectQuickCSSPanel();
}
}
// === Wait for settings page to load ===
function waitForSettings() {
const settingsHeader = [...document.querySelectorAll("div")].find(el =>
el.textContent.trim() === "Settings" &&
el.className.includes("styles__header___")
);
if (settingsHeader) injectPanel();
else setTimeout(waitForSettings, 250);
}
waitForSettings();
})();
QingJ © 2025
镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址