Greasy Fork is available in English.
Magi搜索修改为白色主色调
目前为
// ==UserScript==
// @name Magi搜索-白
// @namespace http://tampermonkey.net/
// @version 1.1
// @description Magi搜索修改为白色主色调
// @author Shillber
// @include *://magi.com/*
// @grant none
// ==/UserScript==
/*Magi搜索进化 */
(function () {
/* 执行判断 */
const key = encodeURIComponent('修改谷花泰的插件:纯净苍穹');
if (window[key]) {
return;
};
window[key] = true;
class FuckAD {
constructor(configs) {
this._configs = configs;
/*
* config里的配置解释
* {
* 正则匹配的域名数组
* sites: ['zhihu.com'],
*
* 移除的节点数组
* remove: ['#id'],
*
* display隐藏的节点数组
* displayNone: ['#id'],
*
* visibility隐藏的节点数组
* visibilityHidden: ['#id'],
*
* 额外的css
* style: `
* body {
* background-color: #000;
* }
* `,
*
* 额外的函数执行
* others() {
* console.log('others: 哈哈');
* }
* }
*
*/
/* 初始化 */
this.init();
};
/*
* 初始化
*/
init() {
const that = this;
/* 所有要移除的节点 */
let remove = [];
/* 总体style */
let style = '';
/* 要执行的其它函数集 */
let others = [];
/* 统计 */
this._configs.forEach(config => {
const canLoad = that.siteInList(config.sites);
if (canLoad) {
remove = remove.concat(config.remove);
style += (config.style || '');
style += (that.letSelectorsDisplayNone(config.displayNone));
style += (that.letSelectorsVisibilityHidden(config.visibilityHidden));
config.others && (others = others.concat(config.others));
};
});
/* 添加style */
this.addStyle(style);
that.removeNodesBySelectors(remove);
/* 执行others内所有函数 */
try {
others.forEach(func => {
func();
});
} catch (err) {
console.error('via: others function run error', err);
};
/* 监听dom，确保节点移除 */
if (remove && remove.length > 0) {
this.observe({
targetNode: document.documentElement,
config: {
attributes: false
},
callback(mutations, observer) {
that.removeNodesBySelectors(remove);
}
})
}
};
/*
* 监听dom节点加载函数
*/
observe({ targetNode, config = {}, callback = () => { } }) {
if (!targetNode) {
return;
};
config = Object.assign({
attributes: true,
childList: true,
subtree: true
}, config);
const observer = new MutationObserver(callback);
observer.observe(targetNode, config);
};
/*
* 添加style
*/
addStyle(style = '') {
const styleElm = document.createElement('style');
styleElm.innerHTML = style;
document.head.appendChild(styleElm);
};
/*
* 选择节点，返回节点数组
*/
selectNodes(selector) {
if (!selector) {
return [];
};
const nodes = document.querySelectorAll(selector);
return nodes;
};
/*
* 判断网站是否在名单内
*/
siteInList(sites) {
const hostname = window.location.hostname;
const result = sites.some(site => {
if (hostname.match(site)) {
return true;
}
return false;
});
return result;
};
/*
* 移除多个节点
*/
removeNodes(nodes = []) {
Array.from(nodes, node => {
node.parentNode.removeChild(node);
});
};
/*
* 根据selector数组移除多个节点
*/
removeNodesBySelectors(selectors = []) {
let nodeArr = [];
selectors.forEach(selector => {
const nodes = this.selectNodes(selector);
if (nodes && nodes.length > 0) {
nodeArr = nodeArr.concat(Array.from(nodes));
};
});
this.removeNodes(nodeArr);
};
/*
* 根据css选择器生成style
*/
generateStyleBySelectors(selectors = [], customStyle = `{}`) {
if (!selectors || selectors.length === 0) {
return '';
};
let style = '';
selectors.forEach(selector => {
if (selector) {
style += `
${selectors} ${customStyle}
`;
};
});
return style;
};
/*
* 让数组里的选择器全部 display: none
*/
letSelectorsDisplayNone(selectors = []) {
return this.generateStyleBySelectors(selectors, `{
display: none!important;
}`);
};
/*
* 让数组里的选择器全部 visibility: hidden
*/
letSelectorsVisibilityHidden(selectors = []) {
return this.generateStyleBySelectors(selectors, `{
visibility: hidden!important;
}`);
};
};
new FuckAD([
{
sites: ['magi.com'],
style: `
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
body {
color: #000;
background-color: #FFF
}
body:before {
position: fixed;
content: "";
opacity: 0;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1;
background: linear-gradient(#FFF, #FFF);
background-repeat: no-repeat;
background-size: 100% 100vh;
transition: opacity .2s
}
body[data-layout="result"]>#curtain {
background-color: #1C1C20
}
div.tips {
font-size: .875rem;
color: #000;
padding: .5rem .5rem;
margin-bottom: .75rem;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
word-break: break-all;
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto
}
div.tips>em {
font-style: normal;
color: #FFD862
}
div.tips#censored {
font-size: .8125rem;
color: #8E8E92;
padding-bottom: 0
}
#header {
position: relative;
height: 100%;
width: 100%;
background-color:#FFF;
box-shadow: 0 0 10px 0 #EEE;
}
#search-bar {
position: relative;
z-index: 2;
display: flex;
align-items: stretch;
height: 2.5rem;
background-color: #FFF;
border-radius: .2rem;
box-shadow: 0 0 .2rem 0 rgba(10, 10, 15, 0.2)
}
#search-input {
flex: 1 1;
color: #0A0A0F;
width: 0;
border: none;
outline: 0;
border-radius: 0;
background: transparent;
line-height: normal;
padding: 0 .5rem
}
#search-submit {
flex: 0 0 2.55rem;
cursor: pointer;
border: none;
outline: 0;
border-radius: 0 .2rem .2rem 0;
background-color: #F5F5F5;
background-size: auto 1.3rem
}
#intro>a {
text-decoration: none;
font-size: .875rem;
color: #000;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#showcase>span {
display: inline-block;
margin: .75rem 0;
padding-left: .5rem;
font-size: .875rem;
font-style: italic;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #626266;
background-repeat: no-repeat;
background-size: 200px;
-webkit-background-clip: text;
background-clip: text;
background-image: linear-gradient(-40deg, transparent 0%, transparent 40%, #000 50%, transparent 60%, transparent 100%);
animation: home-slidein 1.1s ease, home-shine 2s ease 0s infinite
}
#showcase>ul>li>a {
display: block;
padding: .5rem .5rem;
border-radius: .2rem;
text-decoration: none;
background-color: #FAFAFA;
position: relative;
z-index: 2
}
#showcase>ul>li>a h5 {
color: #000;
font-size: .875rem;
font-weight: normal;
margin: 0;
padding: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#showcase>ul>li>a:visited h5 {
color: #FF0000
}
#showcase>ul>li>a cite {
color: #90E6A6;
display: block;
font-size: .75rem;
font-style: normal;
font-weight: normal;
margin-top: .25rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#showcase>ul>li>div>span {
color: #000;
flex: 0 2 auto;
font-size: .75rem;
font-style: italic;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#showcase>ul>li>div>a {
flex: 0 1 auto;
display: inline-block;
font-size: .8125rem;
margin-left: .5rem;
color: #000;
background-color: rgba(20, 162, 245, 0.3);
border-bottom-color: #FAFAFA;
text-decoration: none;
border-radius: .2rem;
padding: .5rem .5rem;
padding-bottom: .4375rem;
border-bottom-style: solid;
border-bottom-width: .125rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#footer {
font-size: .75rem;
color: #000;
text-align: center
}
#footer div:last-child {
cursor: default;
color: #626266;
transform: scale(.833);
margin-bottom: .75rem
}
#search-suggestions {
position: relative;
z-index: 1;
padding-top: .2rem;
margin-top: -0.2rem;
color: #0A0A0F;
background-color: #FFF;
box-shadow: 0 1px 1px 1px #EEE;
border-bottom-left-radius: .2rem;
border-bottom-right-radius: .2rem;
overflow: hidden;
display: none
}
#search-suggestions li[data-active=true] {
color: #000;
background-color: #FAFAFA
}
.gauge>path {
fill: none;
stroke: #000;
stroke-width: 2;
stroke-linecap: round;
animation: progress 1s ease-out forwards
}
.gauge>path[data-color="green"] {
stroke: #40AE36
}
.gauge>path[data-color="yellow"] {
stroke: #F5980C
}
.gauge>path[data-color="red"] {
stroke: #F5473E
}
.gauge>text {
fill: #000;
font-size: inherit;
text-anchor: middle
}
.card {
color: #000;
background-color: #FAFAFA;
padding: .5rem .5rem;
margin-bottom: .75rem;
border-radius: .2rem;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
word-break: break-all;
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto
}
.card[data-type="warn"] {
font-size: .9375rem;
color: #0A0A0F;
background-color: #FFD862;
text-align: center
}
.card[data-type="next"] {
cursor: pointer;
font-size: .9375rem;
color: #000;
background-color: #FAFAFA;
text-align: center
}
.card[data-type="web"] {
color: #000
}
@media screen and (min-width:760px) {
.card[data-type="web"] {
/* background-color: transparent */
background-color: #FAFAFA
}
}
.card[data-type="web"] a:visited h3 {
color: #FF0000
}
.card[data-type="web"] h3 {
display: block;
font-size: 1rem;
font-style: normal;
font-weight: normal;
line-height: 1.5em;
color: #000;
margin: 0
}
.card[data-type="web"] cite {
display: block;
color: #90E6A6;
font-style: normal;
font-weight: normal;
line-height: 1.5em;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.card[data-type="web"] p time {
color: #8E8E92;
word-spacing: -0.15rem
}
.card[data-type="web"] p em {
font-style: normal;
color: #FF557D
}
.card[data-type="web"] dl dt {
display: inline;
color: #8E8E92
}
.card[data-type="web"] ul li a {
display: block;
color: #000;
background-color: #F0F0F0;
padding: .5rem .5rem;
border-radius: .2rem;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.card[data-type="web"] ul li a:visited {
color: #FF0000
}
.card[data-type="fact"] {
padding: 0;
color: #000;
background-color: #FAFAFA
}
.card[data-type="fact"][data-subtype="entity"]>header span {
color: #8E8E92
}
.card[data-type="fact"][data-subtype="set"]>header span {
color: #8E8E92
}
.card[data-type="fact"][data-subtype="value"]>header span {
color: #FF557D
}
.card[data-type="fact"][data-subtype="assertion"]>header span {
color: #8E8E92
}
.card[data-type="fact"]>header>div h2 {
color: #000;
font-size: 1.125rem;
font-weight: normal;
padding: 0;
margin: .5rem 0 0 0
}
.card[data-type="fact"]>header a {
flex: 0 0 auto;
color: #626266;
font-size: .75rem;
margin-left: .5rem;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.card[data-type="fact"]>div>section {
margin-bottom: .5rem;
border-top: .0625rem solid #FAFAFA
}
.card[data-type="fact"]>div>section>header h4 {
flex: 0 0 auto;
color: #000;
font-size: .75rem;
margin: 0 .5rem 0 0
}
.card[data-type="fact"]>div>section>header span {
flex: 0 1 auto;
font-size: .75rem;
transform-origin: left;
transform: scale(.833);
color: #626266;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.card[data-type="fact"]>div>section[data-scope="property"]>div>div {
display: inline-flex;
flex-flow: row nowrap;
align-items: center;
border-radius: .2rem;
background-color: #F0F0F0;
padding: .5rem .5rem
}
.card[data-type="fact"]>div>section[data-scope="property"]>div>div>a {
text-decoration: none;
padding: .5rem 0;
transition: color .2s;
color: #000
}
.card[data-type="fact"]>div>section[data-scope="property"]>div>div>a:hover {
color: #000
}
.card[data-type="suggest"] ul li a {
display: block;
font-size: .875rem;
color: #000;
background-color: #FAFAFA;
padding: .5rem .5rem;
border-radius: .2rem;
text-align: left;
text-decoration: none;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.card[data-type="suggest"] ul li a:visited {
color: #FF0000
}
.fact>dl[data-color="green"]:after {
background-color: #40AE36
}
.fact>dl[data-color="green"] dd {
border-color: #40AE36;
background-color: rgba(64, 174, 54, 0.3)
}
.fact>dl[data-color="yellow"]:after {
background-color: #F5980C
}
.fact>dl[data-color="yellow"] dd {
border-color: #F5980C;
background-color: rgba(245, 152, 12, 0.3)
}
.fact>dl[data-color="red"]:after {
background-color: #F5473E
}
.fact>dl[data-color="red"] dd {
border-color: #F5473E;
background-color: rgba(245, 71, 62, 0.3)
}
section[data-scope=description] .fact[data-render=cell]:before {
content: "“";
color: #626266
}
section[data-scope=description] .fact[data-render=cell]:after {
content: "”";
color: #626266
}
.fact[data-render=tuple]>dl {
cursor: default;
background-color: #F0F0F0
}
.fact[data-render=tuple]>dl>dd:before {
display: block;
color: #8E8E92;
content: attr(data-field);
font-size: .75rem;
text-transform: uppercase;
transform-origin: top left;
transform: scale(.667);
white-space: nowrap;
line-height: 1;
padding-bottom: .1665rem
}
.fact[data-render=tuple]>dl:after {
content: attr(data-confidence);
border-radius: .2rem;
flex: 0 0 2rem;
line-height: 2rem;
margin: .5rem .5rem;
width: 2rem;
height: 2rem;
font-size: .875rem;
color: #000;
text-align: center;
cursor: help;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.fact>div {
color: #8E8E92;
background-color: #F0F0F0;
font-size: .75rem;
padding: 0 .5rem;
overflow: hidden
}
.fact>div>span {
display: block;
padding-top: .5rem;
border-top: .0625rem solid #F0F0F0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.fact>div ul>li {
padding: 0 .5rem;
border-left: .125rem solid #626266
}
.fact>div ul>li:hover {
border-left: .125rem solid #000
}
.fact>div ol>li>a h5 {
font-size: .875rem;
font-weight: normal;
margin: 0;
color: #000;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.fact>div ol>li>a:visited h5 {
color: #FF0000
}
.fact>div ol>li>a div cite {
flex: 0 1 auto;
padding-right: .25rem;
font-size: .75rem;
font-style: normal;
color: #8E8E92;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
.fact>div ol>li>a div time {
flex: 0 0 auto;
color: #8E8E92;
font-size: .75rem;
font-style: normal;
word-spacing: -0.15rem
}
.fact>div>div {
display: flex;
flex-flow: row nowrap;
align-items: center;
margin-top: .5rem;
border-top: .0625rem solid #F0F0F0;
padding: .5rem 0
}
.fact>div>div>a {
flex: 0 1 auto;
display: inline-block;
font-size: .8125rem;
margin-left: .5rem;
color: #000;
background-color: rgba(20, 162, 245, 0.3);
border-bottom-color: #14A2F5;
text-decoration: none;
border-radius: .2rem;
padding: .5rem .5rem;
padding-bottom: .4375rem;
border-bottom-style: solid;
border-bottom-width: .125rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#bibliography {
margin-left: 4rem;
color: #000
}
#bibliography h4 {
font-size: .8125rem;
font-weight: normal;
color: #8E8E92;
margin: .5rem 0 0 .5rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#bibliography ol li {
display: flex;
margin-top: .75rem;
border-radius: .2rem;
background: linear-gradient(90deg, #FAFAFA, rgba(44, 44, 48, 0));
transition: background .2s
}
#bibliography ol li a h5 {
font-size: .8125rem;
font-weight: normal;
color: #000;
margin: 0;
transition: color .2s;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#bibliography ol li a div cite {
flex: 0 1 auto;
font-style: normal;
color: #8E8E92;
padding-right: .25rem;
transition: color .2s;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#bibliography ol li a div time {
flex: 0 0 auto;
color: #8E8E92;
word-spacing: -0.15rem
}
#bibliography ol li:hover {
background: #FAFAFA;
box-shadow: 0 0 0 2px #FAFAFA
}
#bibliography ol li:hover h5 {
color: #000
}
#bibliography ol li:hover cite {
color: #8E8E92
}
`
},
]);
})();