mirror of https://github.com/status-im/codimd.git
Added new editor theme: one-dark, updated monokai active line gutter style
This commit is contained in:
parent
98ca5cb3df
commit
8de5404bb1
|
@ -28,7 +28,7 @@
|
|||
.cm-s-monokai span.cm-link {color: #ae81ff;}
|
||||
.cm-s-monokai span.cm-error {background: #f92672; color: #f8f8f0;}
|
||||
|
||||
.cm-s-monokai .CodeMirror-activeline-background {background: #373831 !important;}
|
||||
.cm-s-monokai .CodeMirror-activeline-background, .cm-s-monokai .CodeMirror-activeline .CodeMirror-gutter-wrapper {background: #373831 !important;}
|
||||
.cm-s-monokai .CodeMirror-matchingbracket {
|
||||
text-decoration: underline;
|
||||
color: white !important;
|
||||
|
|
|
@ -0,0 +1,211 @@
|
|||
/**
|
||||
* Atom One Dark Theme
|
||||
*
|
||||
* Copyright (c) 2015 Hikio - twitter.com/hik_io
|
||||
*
|
||||
* 06/26/2015
|
||||
*
|
||||
* Licensed under MIT
|
||||
* GitHub https://github.com/hikio/brackets-one-dark
|
||||
*/
|
||||
/*
|
||||
Modified by jackycute 2015
|
||||
borrow some color from tomorrow-night-eighties
|
||||
*/
|
||||
/* Editor */
|
||||
.panel,
|
||||
#main-toolbar {
|
||||
background: #1d222a;
|
||||
}
|
||||
#working-set-list-container,
|
||||
.dark #editor-holder .pane-header {
|
||||
background: #15181e;
|
||||
}
|
||||
.working-set-header,
|
||||
#project-files-header .btn-alt-quiet {
|
||||
background: rgba(204, 217, 255, 0.05);
|
||||
}
|
||||
.working-set-header > span {
|
||||
background: transparent;
|
||||
}
|
||||
.sidebar-selection,
|
||||
.filetree-selection,
|
||||
.sidebar-selection-extension,
|
||||
.filetree-selection-extension {
|
||||
background: #282c34;
|
||||
}
|
||||
.dark #status-bar,
|
||||
.dark #status-indicators {
|
||||
background: #15181e;
|
||||
border-top-color: #1d222a;
|
||||
}
|
||||
.dark a,
|
||||
.open-files-container li.selected a {
|
||||
color: #528bff;
|
||||
}
|
||||
/* Code Styling */
|
||||
.cm-s-one-dark.CodeMirror,
|
||||
.cm-s-one-dark .CodeMirror-scroll {
|
||||
/* background-color: #282c34;*/
|
||||
background-color: #1e2126;
|
||||
color: #abb2bf;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-activeline-background {
|
||||
background: transparent;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror-focused .CodeMirror-activeline-background {
|
||||
background: rgba(204, 217, 255, 0.05);
|
||||
}
|
||||
.show-line-padding .cm-s-one-dark.CodeMirror-focused .CodeMirror-activeline-background {
|
||||
box-shadow: inset 15px 0 0 0 #000;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror-focused .CodeMirror-activeline .CodeMirror-gutter-elt {
|
||||
background: transparent;
|
||||
color: #5c6370;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror-focused .CodeMirror-activeline .inline-widget .CodeMirror-gutter-elt {
|
||||
color: red;
|
||||
}
|
||||
.cm-s-one-dark .cm-string-2,
|
||||
.cm-s-one-dark .cm-hr {
|
||||
color: #56b6c2;
|
||||
}
|
||||
.cm-s-one-dark .cm-number,
|
||||
.cm-s-one-dark .cm-attribute,
|
||||
.cm-s-one-dark .cm-qualifier,
|
||||
.cm-s-one-dark .cm-plus,
|
||||
.cm-s-one-dark .cm-atom {
|
||||
color: #eda35e;
|
||||
}
|
||||
.cm-s-one-dark .cm-def {
|
||||
color: #c678dd;
|
||||
}
|
||||
.cm-s-one-dark .cm-property,
|
||||
.cm-s-one-dark .cm-variable,
|
||||
.cm-s-one-dark .cm-variable-2,
|
||||
.cm-s-one-dark .cm-variable-3,
|
||||
.cm-s-one-dark .cm-operator,
|
||||
/*.cm-meta,*/
|
||||
.cm-s-one-dark .cm-bracket {
|
||||
color: #f76e79;
|
||||
}
|
||||
/*borrow from tomorrow-night-eighties*/
|
||||
.cm-s-one-dark .cm-variable {
|
||||
color: #99cc99;
|
||||
}
|
||||
.cm-s-one-dark .cm-variable-2 {
|
||||
color: #6699cc;
|
||||
}
|
||||
|
||||
.cm-s-one-dark .cm-comment {
|
||||
color: #5c6370;
|
||||
font-style: italic;
|
||||
}
|
||||
.cm-s-one-dark .cm-error,
|
||||
.cm-s-one-dark .cm-minus {
|
||||
color: #be5046;
|
||||
}
|
||||
.cm-s-one-dark .cm-header {
|
||||
color: #eda35e;
|
||||
}
|
||||
.cm-s-one-dark .cm-link {
|
||||
color: #98c379;
|
||||
text-decoration: none;
|
||||
}
|
||||
.cm-s-one-dark .cm-rangeinfo {
|
||||
color: #c678dd;
|
||||
}
|
||||
.cm-s-one-dark .cm-keyword,
|
||||
.cm-s-one-dark .cm-builtin,
|
||||
.cm-s-one-dark .cm-tag {
|
||||
color: #98c379;
|
||||
}
|
||||
.cm-s-one-dark .cm-string {
|
||||
/* color: #98c379;*/
|
||||
color: #6699cc;
|
||||
}
|
||||
/* Extra CSS */
|
||||
.cm-s-one-dark .CodeMirror-searching {
|
||||
color: #fff !important;
|
||||
border: 1px solid #528bff;
|
||||
margin: 0 -1px;
|
||||
background-color: rgba(204, 217, 255, 0.09);
|
||||
box-shadow: 0px 0px 6px rgba(66, 133, 244, 0.4);
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-searching.searching-current-match {
|
||||
color: #fff;
|
||||
background-color: #528bff;
|
||||
box-shadow: 0px 0px 6px rgba(66, 133, 244, 0.8);
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-cursor {
|
||||
border-left: 2px solid #528bff !important;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-gutters {
|
||||
/* background-color: #282c34;*/
|
||||
background-color: #1e2126;
|
||||
border-right: 1px solid rgba(204, 217, 255, 0.05);
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-linenumber {
|
||||
color: #393e46;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror-selected {
|
||||
background: rgba(204, 217, 255, 0.05);
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror-focused .CodeMirror-selected {
|
||||
background: rgba(204, 217, 255, 0.09);
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-matchingbracket,
|
||||
.cm-s-one-dark .CodeMirror-matchingtag {
|
||||
/* Ensure visibility against gray inline editor background */
|
||||
background-color: rgba(204, 217, 255, 0.09);
|
||||
color: #abb2bf !important;
|
||||
border-bottom: 1px solid #528bff;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-overwrite .CodeMirror-cursor {
|
||||
border-left: none !important;
|
||||
border-bottom: 1px solid #fff;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror {
|
||||
background: transparent;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror .CodeMirror-gutters {
|
||||
background: transparent;
|
||||
border-right: none;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror .CodeMirror-activeline-background {
|
||||
background: transparent;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror .CodeMirror-activeline .CodeMirror-gutter-elt {
|
||||
background: transparent;
|
||||
color: #5c6370;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror-focused .CodeMirror-activeline-background {
|
||||
background: #000;
|
||||
}
|
||||
.cm-s-one-dark.CodeMirror .CodeMirror-focused .CodeMirror-activeline .CodeMirror-gutter-elt {
|
||||
background: rgba(204, 217, 255, 0.05);
|
||||
color: #fff;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-foldgutter-open:after {
|
||||
color: #393e46;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-foldgutter-folded:after {
|
||||
color: #5c6370;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror.over-gutter .CodeMirror-foldgutter-open:after,
|
||||
.cm-s-one-dark.CodeMirror-focused .CodeMirror-activeline .CodeMirror-foldgutter-open:after {
|
||||
color: #5c6370;
|
||||
}
|
||||
.cm-s-one-dark .CodeMirror-foldmarker {
|
||||
border-color: #393e46;
|
||||
color: #abb2bf;
|
||||
background: rgba(204, 217, 255, 0.05);
|
||||
}
|
||||
/* Non-editor styling */
|
||||
.image-view,
|
||||
.not-editor {
|
||||
background-color: #282c34;
|
||||
}
|
||||
.view-pane .image-view {
|
||||
color: #abb2bf;
|
||||
}
|
|
@ -23,6 +23,7 @@
|
|||
<link rel="stylesheet" href="/vendor/codemirror/addon/scroll/simplescrollbars.css">
|
||||
<link rel="stylesheet" href="/vendor/codemirror/addon/search/matchesonscrollbar.css">
|
||||
<link rel="stylesheet" href="/vendor/codemirror/theme/monokai.css">
|
||||
<link rel="stylesheet" href="/vendor/codemirror/theme/one-dark.css">
|
||||
<link rel="stylesheet" href="/css/github-extract.css">
|
||||
<link rel="stylesheet" href="/css/gist.css">
|
||||
<link rel="stylesheet" href="/vendor/highlight-js/github-gist.min.css">
|
||||
|
|
Loading…
Reference in New Issue