Skip to content

Instantly share code, notes, and snippets.

@T1mL3arn
Created October 17, 2018 12:27
Show Gist options
  • Save T1mL3arn/0507ff1e9448b1962135672c6b125738 to your computer and use it in GitHub Desktop.
Save T1mL3arn/0507ff1e9448b1962135672c6b125738 to your computer and use it in GitHub Desktop.
Violentmonkey themes

CSS themes for Violentmonkey extension

For now there is no way to select theme for code editor. So it is needed to do it manualy (with some tweaks) via VM's settings. VM use CodeMirror - there you can find more themes.

About tweaks

Replace new theme classes with VM's predefined .cm-s-eclipse. Note: that can be not enough due to selectors' specifity.

/* Based on Sublime Text's Monokai theme */
.cm-s-eclipse.CodeMirror { background: #272822; color: #f8f8f2; }
.cm-s-eclipse div.CodeMirror-selected { background: #49483E; }
.cm-s-eclipse .CodeMirror-line::selection, .cm-s-eclipse .CodeMirror-line > span::selection, .cm-s-eclipse .CodeMirror-line > span > span::selection { background: rgba(73, 72, 62, .99); }
.cm-s-eclipse .CodeMirror-line::-moz-selection, .cm-s-eclipse .CodeMirror-line > span::-moz-selection, .cm-s-eclipse .CodeMirror-line > span > span::-moz-selection { background: rgba(73, 72, 62, .99); }
.cm-s-eclipse .CodeMirror-gutters { background: #272822; border-right: 0px; }
.cm-s-eclipse .CodeMirror-guttermarker { color: white; }
.cm-s-eclipse .CodeMirror-guttermarker-subtle { color: #d0d0d0; }
.cm-s-eclipse .CodeMirror-linenumber { color: #d0d0d0; }
.cm-s-eclipse .CodeMirror-cursor { border-left: 1px solid #f8f8f0; }
.cm-s-eclipse span.cm-comment { color: #75715e; }
.cm-s-eclipse span.cm-atom { color: #ae81ff; }
.cm-s-eclipse span.cm-number { color: #ae81ff; }
.cm-s-eclipse span.cm-comment.cm-attribute { color: #97b757; }
.cm-s-eclipse span.cm-comment.cm-def { color: #bc9262; }
.cm-s-eclipse span.cm-comment.cm-tag { color: #bc6283; }
.cm-s-eclipse span.cm-comment.cm-type { color: #5998a6; }
.cm-s-eclipse span.cm-property, .cm-s-eclipse span.cm-attribute { color: #a6e22e; }
.cm-s-eclipse span.cm-keyword { color: #f92672; }
.cm-s-eclipse span.cm-builtin { color: #66d9ef; }
.cm-s-eclipse span.cm-string { color: #e6db74; }
.cm-s-eclipse span.cm-variable { color: #f8f8f2; }
.cm-s-eclipse span.cm-variable-2 { color: #9effff; }
.cm-s-eclipse span.cm-variable-3, .cm-s-eclipse span.cm-type { color: #66d9ef; }
.cm-s-eclipse span.cm-def { color: #fd971f; }
.cm-s-eclipse span.cm-bracket { color: #f8f8f2; }
.cm-s-eclipse span.cm-tag { color: #f92672; }
.cm-s-eclipse span.cm-header { color: #ae81ff; }
.cm-s-eclipse span.cm-link { color: #ae81ff; }
.cm-s-eclipse span.cm-error { background: #f92672; color: #f8f8f0; }
.cm-s-eclipse .CodeMirror-activeline-background { background: #373831; }
.cm-s-eclipse .CodeMirror-matchingbracket {
text-decoration: underline;
color: white !important;
}
.cm-s-eclipse span.cm-operator { color: inherit; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment