// ==UserScript== // @name 洛谷讨论区颜色自定义 // @namespace https://www.luogu.com.cn/user/542457 // @description 可以根据个人喜好,设置洛谷各个讨论区的颜色 // @author cff_0102 // @run-at document-end // @version 1.3.2.1 // @license MIT // @match https://www.luogu.com.cn/* // @icon https://www.luogu.com.cn/favicon.ico // @downloadURL none // ==/UserScript== (function() { 'use strict'; function hexToRgb(hex) {hex = hex.replace(/^#/, '');const bigint = parseInt(hex, 16);const r = (bigint >> 16) & 255;const g = (bigint >> 8) & 255;const b = bigint & 255;return { r, g, b };} function lighterColor(hex) {hex = hex.replace(/^#/, '');const bigint = parseInt(hex, 16);let r = (bigint >> 16) & 255;let g = (bigint >> 8) & 255;let b = bigint & 255;r = Math.floor(255 - (255 - r) / 2);g = Math.floor(255 - (255 - g) / 2);b = Math.floor(255 - (255 - b) / 2);const newHex = ((1 << 24) | (r << 16) | (g << 8) | b).toString(16).slice(1);return `#${newHex}`;} // 更改颜色 function changeColors(){//↓ 更改这里的八个十六进制颜色即可更改洛谷相应版块的颜色 const newcolor1 = '#34495e'; // “全部板块”的颜色 const newcolor2 = '#8e44ad'; // “站务版”的颜色 const newcolor3 = '#52c41a'; // “题目总版”的颜色 const newcolor4 = '#e74c3c'; // “学术版”的颜色 const newcolor5 = '#3ba4a4'; // “灌水区”的颜色 const newcolor6 = '#f39c11'; // “反馈、申请、工单专版”的颜色 const newcolor7 = '#996600'; // “小黑屋”的颜色 const newcolor8 = '#3498db'; // 团队内帖子的颜色 // 更改上面的颜色(并保存更改后的脚本)即可实现更改洛谷对应讨论区的颜色 const ch1 = 1;// 是否更改帖子的背景色(0 或 1)(见 1.0.2 版本发布内容) const textColor = '#2d7b7b';// 讨论列表中帖子的字体颜色以及左侧栏未被选中的字的颜色(包括右下角的回复图标颜色也会改)(#000000 就是洛谷默认的黑色) // 上面是关于讨论列表的其它设置 const ch2 = 1;// 是否更改洛谷各个页面卡片颜色(包括帖子页面内的每条回复)(0 或 1) const bgc = '#ffffffc0';// 如果更改洛谷各个页面卡片颜色,卡片的颜色(后两位是不透明度)(洛谷原版是 #ffffffff) const opt = 1;// 是否更改页面的背景(0 或 1 或 2,0 表示不更改,仍保持原来的灰色;1 表示更改为纯色;2 表示更改为图片) const bgc1 = '#e8f9f8';// 如果 opt 为 1,要更改的背景颜色(#efefef 是洛谷默认背景色)(顺带一提,这个背景色其实是和 https://www.luogu.com.cn/theme/design/98289 相匹配的) const bgi2 = 'url("https://s1.ax1x.com/2023/06/03/pCpu4hT.png")';// 如果 opt 为 2,要更改的背景图片链接(更改双引号中间的内容即可) // 上面是关于全洛谷页面显示的设置 // 更改上面的设置即可更改显示效果(调的好还可以配出深色模式!) // 建议在某个地方保存自己的设置,以免更新时回到原来的设置!更新前先复制以上部分的设置,再进行更新,更新结束后再将上面的设置改回来。 /* 附: 1. 洛谷原版色系: const newcolor1 = '#272727'; // “全部板块”的颜色 const newcolor2 = '#14558f'; // “站务版”的颜色 const newcolor3 = '#f39c11'; // “题目总版”的颜色 const newcolor4 = '#9d3dcf'; // “学术版”的颜色 const newcolor5 = '#52c41a'; // “灌水区”的颜色 const newcolor6 = '#2949b4'; // “反馈、申请、工单专版”的颜色 const newcolor7 = '#272727'; // “小黑屋”的颜色 const newcolor8 = '#272727'; // 团队内帖子的颜色 2. 高对比度色系: const newcolor1 = '#34495e'; // “全部板块”的颜色 const newcolor2 = '#f01010'; // “站务版”的颜色 const newcolor3 = '#f0b810'; // “题目总版”的颜色 const newcolor4 = '#9cf010'; // “学术版”的颜色 const newcolor5 = '#10f0d4'; // “灌水区”的颜色 const newcolor6 = '#109cf0'; // “反馈、申请、工单专版”的颜色 const newcolor7 = '#8010f0'; // “小黑屋”的颜色 const newcolor8 = '#f010d4'; // 团队内帖子的颜色 3. 类似“深色模式”(此时建议将“全部板块”的颜色调浅一点,如改为 #3498db): const ch1 = 1;// 是否更改帖子的背景色(0 或 1)(见 1.0.2 版本发布内容) const textColor = '#e5e5e5';// 讨论列表中帖子的字体颜色以及左侧栏未被选中的字的颜色(包括右下角的回复图标颜色也会改)(#000000 就是洛谷默认的黑色) // 上面是关于讨论列表的其它设置 const ch2 = 1;// 是否更改洛谷各个页面卡片颜色(包括帖子页面内的每条回复)(0 或 1) const bgc = '#5e5e5ec0';// 如果更改洛谷各个页面卡片颜色,卡片的颜色(后两位是不透明度)(洛谷原版是 #ffffffff) const opt = 1;// 是否更改页面的背景(0 或 1 或 2,0 表示不更改,仍保持原来的灰色;1 表示更改为纯色;2 表示更改为图片) const bgc1 = '#2b2b2b';// 如果 opt 为 1,要更改的背景颜色(#efefef 是洛谷默认背景色)(顺带一提,这个背景色其实是和 https://www.luogu.com.cn/theme/design/98289 相匹配的) const bgi2 = 'url("https://s1.ax1x.com/2023/06/03/pCpu4hT.png")';// 如果 opt 为 2,要更改的背景图片链接(更改双引号中间的内容即可) // 上面是关于全洛谷页面显示的设置 */ // 下面这个函数可以关闭广告。不想关的话注释掉就行了。 function closeDivsWithAttributes(attributeValue) { var divElements = document.getElementsByTagName('div'); for (var i = 0; i < divElements.length; i++) { var div = divElements[i]; if (div.getAttribute('data-v-0a593618') === attributeValue && div.getAttribute('data-v-602e5c62') === attributeValue) { div.remove(); } } } closeDivsWithAttributes(""); //帖子列表右侧帖子字体颜色 var elements = document.querySelectorAll('div.avatar-right'); for (var i = 0; i < elements.length; i++) { let e1 = elements[i].querySelectorAll('a.row.content-left.title.link.color-default'); for(let ee of e1)ee.style.color = textColor; let e2 = elements[i].querySelectorAll('div.time'); for(let ee of e2)ee.style.color = textColor; let e3 = elements[i].querySelectorAll('span.forum-name'); for(let ee of e3)ee.style.color = textColor; let e4 = elements[i].querySelectorAll('g'); for(let ee of e4)ee.style.color = textColor; } //帖子列表左侧栏字体颜色 elements = document.querySelector('div.card.left.padding-default'); if(elements){ elements = elements.querySelector('div.section'); if(elements){ let e1 = elements.querySelectorAll('a.forum-container.section-item.row-item.color-default.link'); for (let ee of e1) { let e2List = ee.querySelectorAll('span.forum-name'); for (let e2 of e2List) { if (e2.classList.contains('active')) { e2.style.color = ''; // 清除style.color属性 } else { e2.style.color = textColor; } } } } } const elementsWithCustomStyle = document.querySelectorAll('[style*="--forum-color: #f39c11; color: var(--forum-color);"]');// 题目讨论版 elementsWithCustomStyle.forEach(function (element) { element.style.cssText = `--forum-color: ${newcolor3}; color: var(--forum-color);`; }); var currentURL = window.location.href; // 检查链接是否以特定URL开头 if (currentURL.startsWith("https://www.luogu.com.cn/discuss/new")) { // 获取所有class为card padding-default的元素 elements = document.querySelectorAll(".card.padding-default"); // 遍历元素并修改背景颜色 elements.forEach(function(element) { element.style.backgroundColor = bgc; }); } const forumElement = document.querySelector("section.side"); if(forumElement){ // 获取所属板块的文本内容 const forumTextElement = forumElement.querySelector("a.color-default"); if(forumTextElement){ const forumText = forumTextElement.textContent.trim(); const temp = document.querySelector("section.main"); const temp1 = temp.querySelector("div.card.padding-default"); // 根据所属板块的文本内容判断是否需要修改颜色 if (forumText === '站务版' && !(window.location.href.startsWith('https://www.luogu.com.cn/discuss/new'))/* 防止在帖子发布页(https://www.luogu.com.cn/discuss/new?forum=xxx)底下也出现站务版颜色边框 */) { const newColor = newcolor2; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText === '题目总版') { const newColor = newcolor3; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText === '学术版') { const newColor = newcolor4; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText === '灌水区') { const newColor = newcolor5; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText === '反馈、申请、工单专版') { const newColor = newcolor6; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText === '小黑屋') { const newColor = newcolor7; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (forumText.startsWith('团队')){// 团队帖子内 const newColor = newcolor8; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; }else if (window.location.href.startsWith('https://www.luogu.com.cn/discuss/'/* 确保在讨论区 */ && !(window.location.href.startsWith('https://www.luogu.com.cn/discuss/new'))/* 防止在帖子发布页(https://www.luogu.com.cn/discuss/new?forum=xxx)底下也出现题目版颜色边框 */)){// 在题目详情页中 // console.log(forumText); const newColor = newcolor3; // 设置新的颜色值 const rgbColor = hexToRgb(newColor); // 将十六进制颜色转换为 RGB 形式 // 修改元素的颜色属性 temp1.style.cssText = `border-bottom: 2px solid rgb(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b});`; } } } const a=document.querySelectorAll("[title=全部板块]"); for(let x of a) x.style.cssText = `--forum-color: ${newcolor1}; color: var(--forum-color);`; //洛谷蓝 const b=document.querySelectorAll("[title=站务版]"); for(let x of b) x.style.cssText = `--forum-color: ${newcolor2}; color: var(--forum-color);`; //紫名紫 const c=document.querySelectorAll("[title=题目总版]"); for(let x of c) x.style.cssText = `--forum-color: ${newcolor3}; color: var(--forum-color);`; // AC 绿 const d=document.querySelectorAll("[title=学术版]"); for(let x of d) x.style.cssText = `--forum-color: ${newcolor4}; color: var(--forum-color);`; //红名红 const e=document.querySelectorAll("[title=灌水区]"); for(let x of e) x.style.cssText = `--forum-color: ${newcolor5}; color: var(--forum-color);`; const f=document.querySelectorAll("[title=反馈、申请、工单专版]"); for(let x of f) x.style.cssText = `--forum-color: ${newcolor6}; color: var(--forum-color);`; //排行橙 const g=document.querySelectorAll("[title=小黑屋]"); for(let x of g){x.style.cssText = `--forum-color: ${newcolor7}; color: var(--forum-color);`; //棕名棕 const svgElement = x.querySelector("svg"); const pathElement = svgElement.querySelector("path"); pathElement.setAttribute("d", "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48"); //更改小黑屋图标(从四个方块改成一个方块) } const h=document.querySelectorAll("[title^=团队]"); for(let x of h){x.style.cssText = `--forum-color: ${newcolor8}; color: var(--forum-color);`; //比赛蓝 const svgElement = x.querySelector("svg"); const pathElement = svgElement.querySelector("path"); pathElement.setAttribute("d", "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48"); //更改小黑屋图标(从四个方块改成一个方块) } if(ch2){ let temp1 = document.querySelectorAll("div.card"); for(let temp2 of temp1){ if (!temp2.classList.contains("reply-editor")&&!temp2.classList.contains("modal-card")&&!temp2.classList.contains("reply-card")){ temp2.style.backgroundColor = bgc; } } } if(ch1){ const c=document.getElementsByClassName("card post-item padding-default"); for (let el of c) { if (el.querySelector("[title=站务版]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor2))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title=题目总版]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor3))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title=学术版]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor4))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title=灌水区]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor5))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title=反馈、申请、工单专版]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor6))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title=小黑屋]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor7))}A0; color: var(--forum-color);`; } else if (el.querySelector("[title^=团队]")!=null) { el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor8))}A0; color: var(--forum-color);`; } else {// 题目讨论区 el.style.cssText=`background-color: ${lighterColor(lighterColor(newcolor3))}A0; color: var(--forum-color);`; } }//改背景色 } //更改背景 var mainElement = document.querySelector('.wrapped.lfe-body.mobile-body'); var bodyElement = document.body; if (mainElement) { if(opt===1)mainElement.style.background = bgc1; else if(opt){ // 设置背景图片 bodyElement.style.backgroundImage = bgi2; bodyElement.style.backgroundSize = 'cover'; bodyElement.style.backgroundRepeat = 'no-repeat'; // 将背景固定 bodyElement.style.backgroundAttachment = 'fixed'; mainElement.style.backgroundColor = 'transparent'; } }else{ mainElement = document.querySelector('.lfe-body.mobile-body'); if (mainElement) { if(opt===1)mainElement.style.background = bgc1; else if(opt){ // 设置背景图片 bodyElement.style.backgroundImage = bgi2; bodyElement.style.backgroundSize = 'cover'; bodyElement.style.backgroundRepeat = 'no-repeat'; // 将背景固定 bodyElement.style.backgroundAttachment = 'fixed'; mainElement.style.backgroundColor = 'transparent'; } } } } //更新速度,单位毫秒,太小可能造成卡顿 setInterval(changeColors, 250); })();