Skip to content

Commit 658f9a0

Browse files
atelierbrammarijnh
atelierbram
authored and
marijnh
committed
[duotone themes] Add
1 parent 944ff92 commit 658f9a0

File tree

3 files changed

+75
-0
lines changed

3 files changed

+75
-0
lines changed

‎demo/theme.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@
1616
<link rel="stylesheet" href="../theme/cobalt.css">
1717
<link rel="stylesheet" href="../theme/colorforth.css">
1818
<link rel="stylesheet" href="../theme/dracula.css">
19+
<link rel="stylesheet" href="../theme/duotone-dark.css">
20+
<link rel="stylesheet" href="../theme/duotone-light.css">
1921
<link rel="stylesheet" href="../theme/eclipse.css">
2022
<link rel="stylesheet" href="../theme/elegant.css">
2123
<link rel="stylesheet" href="../theme/erlang-dark.css">
@@ -99,6 +101,8 @@ <h2>Theme Demo</h2>
99101
<option>cobalt</option>
100102
<option>colorforth</option>
101103
<option>dracula</option>
104+
<option>duotone-dark</option>
105+
<option>duotone-light</option>
102106
<option>eclipse</option>
103107
<option>elegant</option>
104108
<option>erlang-dark</option>

‎theme/duotone-dark.css‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
/*
2+
Name: DuoTone-Dark
3+
Author: by Bram de Haan, adapted from DuoTone themes by Simurai (http://simurai.com/projects/2016/01/01/duotone-themes)
4+
5+
CodeMirror template by Jan T. Sott (https://github.com/idleberg), adapted by Bram de Haan (https://github.com/atelierbram/)
6+
*/
7+
8+
.cm-s-duotone-dark.CodeMirror { background: #2a2734; color: #6c6783; }
9+
.cm-s-duotone-dark div.CodeMirror-selected { background: #545167!important; }
10+
.cm-s-duotone-dark .CodeMirror-gutters { background: #2a2734; border-right: 0px; }
11+
.cm-s-duotone-dark .CodeMirror-linenumber { color: #545167; }
12+
13+
/* begin cursor */
14+
.cm-s-duotone-dark .CodeMirror-cursor { border-left: 1px solid #ffad5c; /* border-left: 1px solid #ffad5c80; */ border-right: .5em solid #ffad5c; /* border-right: .5em solid #ffad5c80; */ opacity: .5; }
15+
.cm-s-duotone-dark .CodeMirror-activeline-background { background: #363342; /* background: #36334280; */ opacity: .5;}
16+
.cm-s-duotone-dark .cm-fat-cursor .CodeMirror-cursor { background: #ffad5c; /* background: #ffad5c80; */ opacity: .5;}
17+
/* end cursor */
18+
19+
.cm-s-duotone-dark span.cm-atom, .cm-s-duotone-dark span.cm-number, .cm-s-duotone-dark span.cm-keyword, .cm-s-duotone-dark span.cm-variable, .cm-s-duotone-dark span.cm-attribute, .cm-s-duotone-dark span.cm-quote, .cm-s-duotone-dark span.cm-hr, .cm-s-duotone-dark span.cm-link { color: #ffcc99; }
20+
21+
.cm-s-duotone-dark span.cm-property { color: #9a86fd; }
22+
.cm-s-duotone-dark span.cm-punctuation, .cm-s-duotone-dark span.cm-unit, .cm-s-duotone-dark span.cm-negative { color: #e09142; }
23+
.cm-s-duotone-dark span.cm-string { color: #ffb870; }
24+
.cm-s-duotone-dark span.cm-operator { color: #ffad5c; }
25+
.cm-s-duotone-dark span.cm-positive { color: #6a51e6; }
26+
27+
.cm-s-duotone-dark span.cm-variable-2, .cm-s-duotone-dark span.cm-variable-3, .cm-s-duotone-dark span.cm-string-2, .cm-s-duotone-dark span.cm-url { color: #7a63ee; }
28+
.cm-s-duotone-dark span.cm-def, .cm-s-duotone-dark span.cm-tag, .cm-s-duotone-dark span.cm-builtin, .cm-s-duotone-dark span.cm-qualifier, .cm-s-duotone-dark span.cm-header, .cm-s-duotone-dark span.cm-em { color: #eeebff; }
29+
.cm-s-duotone-dark span.cm-bracket, .cm-s-duotone-dark span.cm-comment { color: #6c6783; }
30+
31+
/* using #f00 red for errors, don't think any of the colorscheme variables will stand out enough, ... maybe by giving it a background-color ... */
32+
.cm-s-duotone-dark span.cm-error, .cm-s-duotone-dark span.cm-invalidchar { color: #f00; }
33+
34+
.cm-s-duotone-dark span.cm-header { font-weight: normal; }
35+
.cm-s-duotone-dark .CodeMirror-matchingbracket { text-decoration: underline; color: #eeebff !important; }

‎theme/duotone-light.css‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/*
2+
Name: DuoTone-Light
3+
Author: by Bram de Haan, adapted from DuoTone themes by Simurai (http://simurai.com/projects/2016/01/01/duotone-themes)
4+
5+
CodeMirror template by Jan T. Sott (https://github.com/idleberg), adapted by Bram de Haan (https://github.com/atelierbram/)
6+
*/
7+
8+
.cm-s-duotone-light.CodeMirror { background: #faf8f5; color: #b29762; }
9+
.cm-s-duotone-light div.CodeMirror-selected { background: #e3dcce !important; }
10+
.cm-s-duotone-light .CodeMirror-gutters { background: #faf8f5; border-right: 0px; }
11+
.cm-s-duotone-light .CodeMirror-linenumber { color: #cdc4b1; }
12+
13+
/* begin cursor */
14+
.cm-s-duotone-light .CodeMirror-cursor { border-left: 1px solid #93abdc; /* border-left: 1px solid #93abdc80; */ border-right: .5em solid #93abdc; /* border-right: .5em solid #93abdc80; */ opacity: .5; }
15+
.cm-s-duotone-light .CodeMirror-activeline-background { background: #e3dcce; /* background: #e3dcce80; */ opacity: .5; }
16+
.cm-s-duotone-light .cm-fat-cursor .CodeMirror-cursor { background: #93abdc; /* #93abdc80; */ opacity: .5; }
17+
/* end cursor */
18+
19+
.cm-s-duotone-light span.cm-atom, .cm-s-duotone-light span.cm-number, .cm-s-duotone-light span.cm-keyword, .cm-s-duotone-light span.cm-variable, .cm-s-duotone-light span.cm-attribute, .cm-s-duotone-light span.cm-quote, .cm-s-duotone-light-light span.cm-hr, .cm-s-duotone-light-light span.cm-link { color: #063289; }
20+
21+
.cm-s-duotone-light span.cm-property { color: #b29762; }
22+
.cm-s-duotone-light span.cm-punctuation, .cm-s-duotone-light span.cm-unit, .cm-s-duotone-light span.cm-negative { color: #063289; }
23+
.cm-s-duotone-light span.cm-string, .cm-s-duotone-light span.cm-operator { color: #1659df; }
24+
.cm-s-duotone-light span.cm-positive { color: #896724; }
25+
26+
.cm-s-duotone-light span.cm-variable-2, .cm-s-duotone-light span.cm-variable-3, .cm-s-duotone-light span.cm-string-2, .cm-s-duotone-light span.cm-url { color: #896724; }
27+
.cm-s-duotone-light span.cm-def, .cm-s-duotone-light span.cm-tag, .cm-s-duotone-light span.cm-builtin, .cm-s-duotone-light span.cm-qualifier, .cm-s-duotone-light span.cm-header, .cm-s-duotone-light span.cm-em { color: #2d2006; }
28+
.cm-s-duotone-light span.cm-bracket, .cm-s-duotone-light span.cm-comment { color: #b6ad9a; }
29+
30+
/* using #f00 red for errors, don't think any of the colorscheme variables will stand out enough, ... maybe by giving it a background-color ... */
31+
/* .cm-s-duotone-light span.cm-error { background: #896724; color: #728fcb; } */
32+
.cm-s-duotone-light span.cm-error, .cm-s-duotone-light span.cm-invalidchar { color: #f00; }
33+
34+
.cm-s-duotone-light span.cm-header { font-weight: normal; }
35+
.cm-s-duotone-light .CodeMirror-matchingbracket { text-decoration: underline; color: #faf8f5 !important; }
36+

0 commit comments

Comments
 (0)