From 452370772f1f08b325d7cab9f9aba1294e6191a9 Mon Sep 17 00:00:00 2001 From: Winner Crespo Date: Thu, 5 Jul 2018 16:52:38 -0400 Subject: [PATCH] Adding VS Code's Night Owl theme (#379) --- .all-contributorsrc | 10 +++++ README.md | 2 +- components/Meta.js | 1 + lib/constants.js | 4 ++ lib/custom/themes/night-owl.css | 75 +++++++++++++++++++++++++++++++++ 5 files changed, 91 insertions(+), 1 deletion(-) create mode 100644 lib/custom/themes/night-owl.css diff --git a/.all-contributorsrc b/.all-contributorsrc index 287cc1e..f912f52 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -293,6 +293,16 @@ "contributions": [ "code" ] + }, + { + "login": "wistcc", + "name": "Winner Crespo", + "avatar_url": "https://avatars0.githubusercontent.com/u/4671080?v=4", + "profile": "http://winnercrespo.com", + "contributions": [ + "code", + "design" + ] } ], "repoType": "github" diff --git a/README.md b/README.md index 7ac873a..3263841 100644 --- a/README.md +++ b/README.md @@ -76,5 +76,5 @@ Thanks goes out to all these wonderful people ([emoji key](https://github.com/ke | [
otobrglez](https://github.com/otobrglez)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=otobrglez "Code") | [
darahak](https://github.com/darahak)
[πŸ“–](https://github.com/dawnlabs/carbon/commits?author=darahak "Documentation") | [
dom96](https://github.com/dom96)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=dom96 "Code") | [
elrumordelaluz](https://github.com/elrumordelaluz)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=elrumordelaluz "Code") | [
cjb](https://github.com/cjb)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=cjb "Code") | [
Krzysztof-Cieslak](https://github.com/Krzysztof-Cieslak)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=Krzysztof-Cieslak "Code") | [
fernahh](https://github.com/fernahh)
[πŸ“–](https://github.com/dawnlabs/carbon/commits?author=fernahh "Documentation") | | [
g3r4n](https://github.com/g3r4n)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=g3r4n "Code") | [
Mat Gadd](http://drarok.com/)
[πŸ›](https://github.com/dawnlabs/carbon/issues?q=author%3ADrarok "Bug reports") [πŸ’»](https://github.com/dawnlabs/carbon/commits?author=Drarok "Code") | [
Brad Davies](https://bradlab.co.uk)
[πŸ›](https://github.com/dawnlabs/carbon/issues?q=author%3Avarbrad "Bug reports") [πŸ’»](https://github.com/dawnlabs/carbon/commits?author=varbrad "Code") | [
Rafael CΓ’mara](http://www.rafaelcamaram.com/)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=rafaelcamaram "Code") | [
Gleb Bahmutov](https://glebbahmutov.com/)
[⚠️](https://github.com/dawnlabs/carbon/commits?author=bahmutov "Tests") [πŸ”§](#tool-bahmutov "Tools") | [
IvΓ‘n MunguΓ­a](https://ivan-munguia.netlify.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=warborn "Code") | [
Dillon Mulroy](https://dillonmulroy.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=dmmulroy "Code") | | [
Nihad Abbasov](https://github.com/NARKOZ)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=NARKOZ "Code") | [
Hugo Torzuoli](https://torzuolih.github.io)
[πŸ“–](https://github.com/dawnlabs/carbon/commits?author=TorzuoliH "Documentation") | [
Bruno C. Couto](https://github.com/bruno02221)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=bruno02221 "Code") | [
Mark Molnar](https://github.com/molnarmark)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=molnarmark "Code") | [
Takahiko Inayama](https://www.behance.net/tetra2000)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=TETRA2000 "Code") | [
François Martin](https://github.com/martinfrancois)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=martinfrancois "Code") | [
Raphael Amorim](http://raphamorim.io)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=raphamorim "Code") | -| [
Camron Flanders](http://camronflanders.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=camflan "Code") | [
Eric Adamski](https://ericadamski.github.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=ericadamski "Code") | +| [
Camron Flanders](http://camronflanders.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=camflan "Code") | [
Eric Adamski](https://ericadamski.github.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=ericadamski "Code") | [
Winner Crespo](http://winnercrespo.com)
[πŸ’»](https://github.com/dawnlabs/carbon/commits?author=wistcc "Code") [🎨](#design-wistcc "Design") | diff --git a/components/Meta.js b/components/Meta.js index 3d23303..2999631 100644 --- a/components/Meta.js +++ b/components/Meta.js @@ -8,6 +8,7 @@ import '../static/react-crop.css' import '../static/react-spinner.css' import '../lib/custom/themes/one-dark.css' import '../lib/custom/themes/verminal.css' +import '../lib/custom/themes/night-owl.css' export default () => { const onBrowser = typeof window !== 'undefined' diff --git a/lib/constants.js b/lib/constants.js index 10ae695..24c67ac 100644 --- a/lib/constants.js +++ b/lib/constants.js @@ -55,6 +55,10 @@ export const THEMES = [ id: 'monokai', name: 'Monokai' }, + { + id: 'night-owl', + name: 'Night Owl', + }, { id: 'oceanic-next', name: 'Oceanic Next' diff --git a/lib/custom/themes/night-owl.css b/lib/custom/themes/night-owl.css new file mode 100644 index 0000000..0c862a1 --- /dev/null +++ b/lib/custom/themes/night-owl.css @@ -0,0 +1,75 @@ +/* + Name: night-owl 1.1.1 + Author: Sarah Drasner (https://github.com/sdras) + Original VS Code theme (https://github.com/sdras/night-owl-vscode-theme) +*/ +/* basic */ +.CodeMirror.cm-s-night-owl { + font-family: Menlo, Consolas, 'DejaVu Sans Mono', monospace; + font-weight: 350; + font-size: 18px; + color: #abb2bf; + background-color: #011627; + } + .cm-s-night-owl .CodeMirror-selected {background-color: #1d3b53 !important;} + .cm-s-night-owl .CodeMirror-gutter, + .cm-s-night-owl .CodeMirror-gutters { + border: none; + background-color: #011627; + } + .cm-s-night-owl .CodeMirror-linenumber, + .cm-s-night-owl .CodeMirror-linenumbers { + color: #5f7e97 !important; + background-color: transparent; + } + .cm-s-night-owl .CodeMirror-lines { + color: #abb2bf !important; + background-color: transparent; + } + .cm-s-night-owl .CodeMirror-cursor {border-left: 2px solid #7e57c2 !important;} + /* addon: edit/machingbrackets.js & addon: edit/matchtags.js */ + .cm-s-night-owl .CodeMirror-matchingbracket, + .cm-s-night-owl .CodeMirror-matchingtag { + border-bottom: 2px solid #c792ea; + color: #abb2bf !important; + background-color: transparent; + } + .cm-s-night-owl .CodeMirror-nonmatchingbracket { + border-bottom: 2px solid #e06c75; + color: #abb2bf !important; + background-color: transparent; + } + /* addon: fold/foldgutter.js */ + .cm-s-night-owl .CodeMirror-foldmarker, + .cm-s-night-owl .CodeMirror-foldgutter, + .cm-s-night-owl .CodeMirror-foldgutter-open, + .cm-s-night-owl .CodeMirror-foldgutter-folded { + border: none; + text-shadow: none; + color: #5c6370 !important; + background-color: transparent; + } + /* addon: selection/active-line.js */ + .cm-s-night-owl .CodeMirror-activeline-background {background-color: #01121f;} + /* basic syntax */ + .cm-s-night-owl .cm-quote {color: #5c6370;font-style: italic;} + .cm-s-night-owl .cm-negative {color: #e06c75;} + .cm-s-night-owl .cm-positive {color: #e06c75;} + .cm-s-night-owl .cm-strong {color: #F78C6C;font-weight: bold;} + .cm-s-night-owl .cm-em {color: #c792ea;font-style: italic;} + .cm-s-night-owl .cm-attribute {color: #F78C6C;} + .cm-s-night-owl .cm-link {color: #ecc48d;border-bottom: solid 1px #ecc48d;} + .cm-s-night-owl .cm-keyword {color: #c792ea;font-style: italic;} + .cm-s-night-owl .cm-def {color: #82AAFF;} + .cm-s-night-owl .cm-atom {color: #F78C6C;} + .cm-s-night-owl .cm-number {color: #F78C6C;} + .cm-s-night-owl .cm-property {color: #fff;} + .cm-s-night-owl .cm-qualifier {color: #F78C6C;} + .cm-s-night-owl .cm-variable {color: #82AAFF;} + .cm-s-night-owl .cm-variable-2 {color: #82AAFF;} + .cm-s-night-owl .cm-string {color: #ecc48d;} + .cm-s-night-owl .cm-string-2 {color: #addb67ff;} + .cm-s-night-owl .cm-operator {color: #c792ea;} + .cm-s-night-owl .cm-meta {color: #7fdbca;} + .cm-s-night-owl .cm-comment {color: #5c6370;font-style: italic;} + .cm-s-night-owl .cm-error {color: #e06c75;} \ No newline at end of file