switch to monokai as default syntax highlight theme
This commit is contained in:
parent
7b66abd49c
commit
fbbae1dc55
|
@ -897,7 +897,7 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) {
|
||||||
|
|
||||||
### Code syntax highlighting
|
### Code syntax highlighting
|
||||||
|
|
||||||
By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. To enable syntax highlighting, you'll have to load the highlight plugin ([plugin/highlight/highlight.js](plugin/highlight/highlight.js)) and a highlight.js CSS theme (Reveal comes packaged with the zenburn theme: [lib/css/zenburn.css](lib/css/zenburn.css)).
|
By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. To enable syntax highlighting, you'll have to load the highlight plugin ([plugin/highlight/highlight.js](plugin/highlight/highlight.js)) and a highlight.js CSS theme (Reveal comes packaged with the Monokai themes: [lib/css/monokai.css](lib/css/monokai.css)).
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
Reveal.initialize({
|
Reveal.initialize({
|
||||||
|
|
|
@ -153,7 +153,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -11,8 +11,8 @@ section.has-light-background, section.has-light-background h1, section.has-light
|
||||||
* GLOBAL STYLES
|
* GLOBAL STYLES
|
||||||
*********************************************/
|
*********************************************/
|
||||||
body {
|
body {
|
||||||
background: #222;
|
background: #191919;
|
||||||
background-color: #222; }
|
background-color: #191919; }
|
||||||
|
|
||||||
.reveal {
|
.reveal {
|
||||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||||
|
@ -149,7 +149,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
@ -270,4 +270,4 @@ body {
|
||||||
*********************************************/
|
*********************************************/
|
||||||
@media print {
|
@media print {
|
||||||
.backgrounds {
|
.backgrounds {
|
||||||
background-color: #222; } }
|
background-color: #191919; } }
|
||||||
|
|
|
@ -152,7 +152,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -155,7 +155,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -153,7 +153,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -147,7 +147,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -149,7 +149,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -152,7 +152,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -156,7 +156,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -153,7 +153,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
|
|
||||||
|
|
||||||
// Override theme settings (see ../template/settings.scss)
|
// Override theme settings (see ../template/settings.scss)
|
||||||
$backgroundColor: #222;
|
$backgroundColor: #191919;
|
||||||
|
|
||||||
$mainColor: #fff;
|
$mainColor: #fff;
|
||||||
$headingColor: #fff;
|
$headingColor: #fff;
|
||||||
|
|
|
@ -167,7 +167,7 @@ body {
|
||||||
|
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
|
|
||||||
box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
|
|
|
@ -149,7 +149,7 @@ body {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); }
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
|
@ -19,7 +19,7 @@
|
||||||
<link rel="stylesheet" href="css/theme/black.css" id="theme">
|
<link rel="stylesheet" href="css/theme/black.css" id="theme">
|
||||||
|
|
||||||
<!-- Theme used for syntax highlighting of code -->
|
<!-- Theme used for syntax highlighting of code -->
|
||||||
<link rel="stylesheet" href="lib/css/zenburn.css">
|
<link rel="stylesheet" href="lib/css/monokai.css">
|
||||||
|
|
||||||
<!-- Printing and PDF exports -->
|
<!-- Printing and PDF exports -->
|
||||||
<script>
|
<script>
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
<link rel="stylesheet" href="css/theme/black.css">
|
<link rel="stylesheet" href="css/theme/black.css">
|
||||||
|
|
||||||
<!-- Theme used for syntax highlighting of code -->
|
<!-- Theme used for syntax highlighting of code -->
|
||||||
<link rel="stylesheet" href="lib/css/zenburn.css">
|
<link rel="stylesheet" href="lib/css/monokai.css">
|
||||||
|
|
||||||
<!-- Printing and PDF exports -->
|
<!-- Printing and PDF exports -->
|
||||||
<script>
|
<script>
|
||||||
|
@ -41,7 +41,7 @@
|
||||||
{ src: 'plugin/markdown/marked.js' },
|
{ src: 'plugin/markdown/marked.js' },
|
||||||
{ src: 'plugin/markdown/markdown.js' },
|
{ src: 'plugin/markdown/markdown.js' },
|
||||||
{ src: 'plugin/notes/notes.js', async: true },
|
{ src: 'plugin/notes/notes.js', async: true },
|
||||||
{ src: 'plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } }
|
{ src: 'plugin/highlight/highlight.js', async: true }
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
71
lib/css/monokai.css
Normal file
71
lib/css/monokai.css
Normal file
|
@ -0,0 +1,71 @@
|
||||||
|
/*
|
||||||
|
Monokai style - ported by Luigi Maselli - http://grigio.org
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
display: block;
|
||||||
|
overflow-x: auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
background: #272822;
|
||||||
|
color: #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-tag,
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-strong,
|
||||||
|
.hljs-name {
|
||||||
|
color: #f92672;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-code {
|
||||||
|
color: #66d9ef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-class .hljs-title {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-symbol,
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-link {
|
||||||
|
color: #bf79db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-bullet,
|
||||||
|
.hljs-subst,
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-emphasis,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-builtin-name,
|
||||||
|
.hljs-selector-attr,
|
||||||
|
.hljs-selector-pseudo,
|
||||||
|
.hljs-addition,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-template-tag,
|
||||||
|
.hljs-template-variable {
|
||||||
|
color: #a6e22e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-deletion,
|
||||||
|
.hljs-meta {
|
||||||
|
color: #75715e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-doctag,
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-section,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-selector-id {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
|
@ -9,7 +9,7 @@
|
||||||
<link rel="stylesheet" href="../../css/reveal.css">
|
<link rel="stylesheet" href="../../css/reveal.css">
|
||||||
<link rel="stylesheet" href="../../css/theme/white.css" id="theme">
|
<link rel="stylesheet" href="../../css/theme/white.css" id="theme">
|
||||||
|
|
||||||
<link rel="stylesheet" href="../../lib/css/zenburn.css">
|
<link rel="stylesheet" href="../../lib/css/monokai.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user