Greasy Fork is available in English.
Tema Dracula para glitch.com
当前为
// ==UserScript==
// @name glitch-theme-dracula
// @namespace http://tampermonkey.net/
// @version 2.2.1
// @description Tema Dracula para glitch.com
// @author Nassinger#6809
// @match https://glitch.com/edit/
// @grant GM_addStyle
// @require http://code.jquery.com/jquery-3.4.1.min.js
// @run-at document-start
// ==/UserScript==
const $ = window.jQuery;
$(document).ready(() => {
GM_addStyle (`
* {
transition: background 0.3s, color 0.3s, opacity 0.3s;
}
body, span {
color: #eee;
}
.filetree-child file active data span {
color: black;
}
.ContainerStatusItem__StatusItemDiv-sc-122ynxp-0 kHAzjL, .status-badge, .advanced-options > .button-wrap, header .header-project .project-name-width-placeholder, header:not(.no-header-styles) .header-project .project-name-width-placeholder, .status-badge .icon {
background: none;
}
.sidebar .sidebar-section, .panel, .sidebar .sidebar-section > .button-wrap > button, .button-small, .button-secondary, .advanced-options > .button-wrap > button, .pop-over tools-pop, .pop-over section.info, .tools-pop, header, .button, button:not(.no-button-styles), header:not(.no-header-styles), .editor-wrap, .sidebar .sidebar-section > .button-wrap > button, .sidebar .sidebar-people-wrap button, .search-input, .replace-input, .CodeMirror-search-field {
border: none;
}
.pop-over {
background-color: #343746;
}
.body, .blank-slate, .editor-read-only .text-editor .CodeMirror-gutters,.editor-connection-error .text-editor .CodeMirror-gutters, .editor-read-only,.editor-connection-error, :root, .panel, body, #application, .active .file-rename-input, .editor-helper, .text-editor, .text-editor .CodeMirror-gutters, .button, button:not(.no-button-styles), .search-input, .replace-input, .CodeMirror-search-field {
background-color: #282a36;
--primary-background: #282a36;
}
.CodeMirror-dialog, .pop-over, .pop-over project-pop, .tools-pop, .new-file-pop {
border: none;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.5);
bottom: 40px;
}
.CodeMirror-dialog {
height: 42px;
}
.sidebar, .pop-over section.actions, .person-pop {
background: #343746;
border: none;
}
textarea .content-editable, .pop-over section .input-wrap input {
border-bottom: 1px solid #21222c;
}
.CodeMirror-dialog, .pop-loader, .mini-pop .mini-pop-action:hover, .logs-panel .log-item:hover, .show-app-pop, header, header:not(.no-header-styles), .pop-over section.info, jump-to-button, button:not(.no-button-styles).active {
background: #21222c;
}
.pop-over .results-list .result {
border-radius: 3px;
}
.pop-over .results-list .result:hover .result-name, .pop-over .results-list .result:hover .button {
color: white;
}
.pop-over .results-list .result:hover .button {
background: rgba(13, 15, 28, 0.2);
}
.pop-over .results-list .result .button:hover {
background: rgba(13, 15, 28, 0.4);
}
.CodeMirror-code .cm-keyword {
color: #ff79c6;
}
.CodeMirror-code .cm-variable {
color: #eee;
}
.CodeMirror-code .cm-comment {
color: #6272a4;
}
.CodeMirror-code .cm-string {
color: #f1fa8c;
}
.CodeMirror-code .cm-property {
color: #8be9fd;
}
.CodeMirror-code .cm-operator, .CodeMirror-code .cm-tag {
color: #ff79c6;
}
.CodeMirror-code .cm-number, .CodeMirror-code .cm-atom {
color: #bd93f9;
}
.CodeMirror-code .cm-qualifier {
font-style: italic;
}
.CodeMirror-code .cm-def {
color: #f8f8f2;
}
.CodeMirror-code .cm-params {
color: #ffb86c;
}
.CodeMirror-code .cm-function {
color: #50fa7b;
}
.CodeMirror-code .cm-link {
color: #38a0f5;
}
.CodeMirror-code .cm-url {
color: #eff0f9;
text-decoration: underline;
}
.CodeMirror-code .cm-header {
color: #ff5926;
font-weight: bold;
}
.CodeMirror-code .cm-strong {
color: #ffdd33;
font-weight: bold;
}
.CodeMirror-code .cm-em {
font-style: italic;
}
.CodeMirror-code .cm-quote {
color: #ffdd33;
}
.text-editor .CodeMirror-linenumber {
color: #545f85;
}
.display-folder-name span {
color: #858790;
}
.editor-helper {
border-bottom: 1px solid #21222c;
}
.filetree .filetree-child:not(.folder):hover, .filetree .folder-path:hover, .filetree .filetree-child:not(.folder):focus, .filetree .folder-path:focus, .filetree .filetree-child:not(.folder).active, .filetree .folder-path.active {
border-radius: 3px 0px 0px 3px;
}
.filetree .filetree-child.active {
color: black;
}
.logic.active {
background-color: #f2d13d;
}
.logic .extension-type {
color: #ffdf4f;
}
.text-editor .CodeMirror-foldmarker, .data:not(.active):hover, .data:not(.active):focus, .logic:not(.active):focus, header .nav-item:not(.active):hover, header:not(.no-header-styles) .nav-item:hover, header .nav-item:focus, header:not(.no-header-styles) .nav-item:focus, header .nav-item.active, header:not(.no-header-styles) .nav-item.active, header .right-options .action:hover, header:not(.no-header-styles) .right-options .action:hover, header .right-options .action:focus, header:not(.no-header-styles) .right-options .action:focus, header .right-options .action.active, header:not(.no-header-styles) .right-options .action.active {
background: rgba(217, 227, 255, 0.1);
}
.text-editor .CodeMirror-foldmarker:hover, .sidebar-collapsed:hover, .CodeMirror-activeline-background, .pop-over section.actions .button-secondary:hover, .pop-over section.actions button:hover, button:not(.no-button-styles):hover, button:hover, .button:hover, button-small:hover {
background: rgba(217, 227, 255, 0.2);
}
.sidebar-collapsed .icon-collapse {
background-color: none !important;
}
.icon-collapse {
opacity: 0.6;
background-color: #21212e;
border-radius: 5px;
}
.icon-collapse:hover {
opacity: 1;
background-color: #55596b;
}
.sidebar-collapsed .icon-collapse {
background-color: none !important;
}
.button-small button-secondary, .button-small:hover .icon, .button-secondary:hover .icon, .button:hover .icon {
background: none;
color: white;
}
.ContainerStatusItem__StatusItemDiv-sc-122ynxp-0, .pop-over .results-list .results a li {
border: none;
}
.ContainerStatusItem__StatusItemDiv-sc-122ynxp-0 div {
background: #21222c;
border: none;
}
.status-badge icon {
background: none;
color: white;
}
.filetree-child.file.active .extension-type, .filetree-child.file.active span {
color: #21222c;
}
*:focus {
outline: none;
}
::-webkit-scrollbar {
border: 12px solid rgba(10, 13, 20, 0.4);
width: 12px;
height: 12px;
}
.CodeMirror-vscrollbar {
margin-right: 5.51px;
}
.CodeMirror-hscrollbar {
margin-bottom: 5.51px;
}
::-webkit-scrollbar-thumb {
border: 12px solid rgba(222, 231, 255, 0.15);
}
.button-ask-for-help.button-no-styles {
display: none;
}
.pop-over section.danger-zone {
background: #c93292;
}
.notifications .notification {
padding: 5px 7px;
margin: 0px 15px 9px 0px;
}
#project-search-input {
background: #2f3140;
}
.pop-over .results-list .results .result.project-result {
margin-top: 6px;
}
.pop-over .results-list .results:nth-child(1) {
margin-top: 0px;
}
.custom-domain-pop {
overflow: hidden;
}
.sidebar .sidebar-section:nth-child(1), .pop-over section.actions, .pop-over .results-list .result, .pop-over section, .pop-over a section:not(.no-bottom-border):last-child {
border-bottom: 1px solid #282a36;
}
.mini-pop .mini-pop-action {
background: #282a36;
border-bottom: 1px solid #21222c;
}
.content-editable, .pop-over section .input-wrap input, textarea.content-editable {
border-bottom: 1px solid #343746;
}
.pop-over section .input-wrap input {
border-bottom: 1px solid #282a36;
}
.text-editor .CodeMirror-foldgutter-open:hover {
background-color: #343746;
}
`);
const interval = setInterval(() => {
if ($('.CodeMirror').length) {
const editor = $('.CodeMirror')[0].CodeMirror;
function Context(state, mode, depth, prev) {
this.state = state; this.mode = mode; this.depth = depth; this.prev = prev
};
function copyContext(context) {
return new Context(
CodeMirror.copyState(context.mode, context.state),
context.mode,
context.depth,
context.prev && copyContext(context.prev)
);
};
CodeMirror.defineMode("jsx", (config, modeConfig) => {
var xmlMode = CodeMirror.getMode(config, {
name: "xml",
allowMissing: true,
multilineTagIndentPastTag: false,
allowMissingTagName: true
});
var jsMode = CodeMirror.getMode(config, modeConfig && modeConfig.base || 'javascript');
function flatXMLIndent(state) {
const tagName = state.tagName;
state.tagName = null;
const result = xmlMode.indent(state, '', '');
state.tagName = tagName;
return result;
};
function getMode(stream, state) {
if (state.context.mode == xmlMode) {
return xmlToken(stream, state, state.context);
} else {
return jsToken(stream, state, state.context);
};
};
function xmlToken(stream, state, cx) {
if (cx.depth == 2) {
if (stream.match(/^.*?\*\//)) {
cx.depth = 1;
} else {
stream.skipToEnd();
};
return 'comment';
};
if (stream.peek() == "{") {
xmlMode.skipAttribute(cx.state)
let indent = flatXMLIndent(cx.state),
xmlContext = cx.state.context;
if (xmlContext && stream.match(/^[^>]*>\s*$/, false)) {
while (xmlContext.prev && !xmlContext.startOfLine) {
xmlContext = xmlContext.prev;
};
if (xmlContext.startOfLine) {
indent -= config.indentUnit;
} else if (cx.prev.state.lexical) {
indent = cx.prev.state.lexical.indented;
};
} else if (cx.depth == 1) {
indent += config.indentUnit
};
state.context = new Context(CodeMirror.startState(jsMode, indent), jsMode, 0, state.context);
return null;
};
if (cx.depth == 1) {
if (stream.peek() == '<') {
xmlMode.skipAttribute(cx.state);
state.context = new Context(CodeMirror.startState(xmlMode, flatXMLIndent(cx.state)), xmlMode, 0, state.context);
return null;
} else if (stream.match('//')) {
stream.skipToEnd();
return 'comment';
} else if (stream.match('/*')) {
cx.depth = 2;
return getMode(stream, state);
};
};
let style = xmlMode.token(stream, cx.state), cur = stream.current(), stop;
if (/\btag\b/.test(style)) {
if (/>$/.test(cur)) {
if (cx.state.context) {
cx.depth = 0;
} else {
state.context = state.context.prev;
};
} else if (/^</.test(cur)) {
cx.depth = 1;
};
} else if (!style && (stop = cur.indexOf('{')) > -1) {
stream.backUp(cur.length - stop);
};
return style;
};
let point;
function jsToken(stream, state, cx) {
const keywords = /((function|if|while|try|catch|for|constructor|async) *(?=\()|(of|in|get|set) +)/;
if(!stream.match(keywords, false)) {
if(stream.match(/(require|setInterval) *(?=\()/)) {
return 'property';
};
if(stream.match(/super *(?=\()/)) {
return 'number';
};
if(stream.match(/\w+ *(?=\()/)) {
return 'function';
};
} else {
const match = stream.match(keywords);
if(match) {
if(/(function|if|while|try|catch|for|constructor)/.test(match)) return 'keyword';
return point ? 'function' : 'keyword';
};
};
if(!/ |\n|;/.test(stream.peek())) {
point = stream.peek() === '.';
};
if (stream.peek() == '<' && jsMode.expressionAllowed(stream, cx.state)) {
jsMode.skipExpression(cx.state);
state.context = new Context(CodeMirror.startState(xmlMode, jsMode.indent(cx.state, '', '')), xmlMode, 0, state.context);
return null;
};
const style = jsMode.token(stream, cx.state);
if (!style && cx.depth != null) {
var cur = stream.current();
if (cur == '{') {
cx.depth ++;
} else if (cur == '}') {
if (--cx.depth == 0) {
state.context = state.context.prev;
};
};
};
return style;
};
return {
startState() {
return {context: new Context(CodeMirror.startState(jsMode), jsMode)}
},
copyState(state) {
return {context: copyContext(state.context)}
},
token: getMode,
indent(state, textAfter, fullLine) {
return state.context.mode.indent(state.context.state, textAfter, fullLine)
},
innerMode(state) {
return state.context
}
}
}, 'xml', 'javascript');
CodeMirror.defineMIME('text/jsx', 'jsx')
CodeMirror.defineMIME('text/typescript-jsx', {
name: 'jsx',
base: {
name: 'javascript',
typescript: true
}
});
editor.setOption('mode', 'jsx');
const collapse = $('.icon-collapse')[0];
collapse.onclick = () => {
collapse.style['background-color'] = '#21212e';
};
const removeColor = () => {
const input = $('.file-rename-input');
if(input[0]) {
input[0].style.background = 'rgba(0, 0, 0, 0.2)';
};
};
for(const file of [ ...$('.filetree-child') ]) {
file.ondblclick = () => {
setTimeout(() => removeColor(), 10);
};
};
const buttons = document.getElementsByClassName('options icon opens-pop-over');
for(const button of [ ...buttons ]) {
button.onclick = () => {
setTimeout(() => {
const renameButton = $('*[data-testid="rename"]')[0];
if(renameButton) {
renameButton.onclick = () => {
setTimeout(() => removeColor(), 40);
};
};
}, 40);
};
};
clearInterval(interval);
};
}, 100);
document.documentElement.style.setProperty('--colors-border', '#343746');
document.documentElement.style.setProperty('--primary-background', '#282a36');
});