diff --git a/src/renderer/html_handlebars/hbs_renderer.rs b/src/renderer/html_handlebars/hbs_renderer.rs
index 8429fa16..b8cdfdbd 100644
--- a/src/renderer/html_handlebars/hbs_renderer.rs
+++ b/src/renderer/html_handlebars/hbs_renderer.rs
@@ -177,6 +177,7 @@ impl Renderer for HtmlHandlebars {
book.write_file("jquery.js", &theme.jquery)?;
book.write_file("highlight.css", &theme.highlight_css)?;
book.write_file("tomorrow-night.css", &theme.tomorrow_night_css)?;
+ book.write_file("ayu-highlight.css", &theme.ayu_highlight_css)?;
book.write_file("highlight.js", &theme.highlight_js)?;
book.write_file("clipboard.min.js", &theme.clipboard_js)?;
book.write_file("store.js", &theme.store_js)?;
diff --git a/src/theme/ayu-highlight.css b/src/theme/ayu-highlight.css
new file mode 100644
index 00000000..786063fc
--- /dev/null
+++ b/src/theme/ayu-highlight.css
@@ -0,0 +1,71 @@
+/*
+Based off of the Ayu theme
+Original by Dempfi (https://github.com/dempfi/ayu)
+*/
+
+.hljs {
+ display: block;
+ overflow-x: auto;
+ background: #191f26;
+ color: #e6e1cf;
+ padding: 0.5em;
+}
+
+.hljs-comment,
+.hljs-quote,
+.hljs-meta {
+ color: #5c6773;
+ font-style: italic;
+}
+
+.hljs-variable,
+.hljs-template-variable,
+.hljs-attribute,
+.hljs-attr,
+.hljs-regexp,
+.hljs-link,
+.hljs-selector-id,
+.hljs-selector-class {
+ color: #ff7733;
+}
+
+.hljs-number,
+.hljs-builtin-name,
+.hljs-literal,
+.hljs-type,
+.hljs-params {
+ color: #ffee99;
+}
+
+.hljs-string,
+.hljs-bullet {
+ color: #b8cc52;
+}
+
+.hljs-title,
+.hljs-built_in,
+.hljs-section {
+ color: #ffb454;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-symbol {
+ color: #ff7733;
+}
+
+.hljs-name {
+ color: #36a3d9;
+}
+
+.hljs-tag {
+ color: #00568d;
+}
+
+.hljs-emphasis {
+ font-style: italic;
+}
+
+.hljs-strong {
+ font-weight: bold;
+}
diff --git a/src/theme/book.css b/src/theme/book.css
index b531b96f..970ae36e 100644
--- a/src/theme/book.css
+++ b/src/theme/book.css
@@ -398,6 +398,7 @@ table thead td {
vertical-align: middle;
padding: 0.1em 0.3em;
border-radius: 3px;
+ color: #6e6b5e;
}
.light a:hover > .hljs {
text-decoration: underline;
@@ -516,6 +517,7 @@ table thead td {
vertical-align: middle;
padding: 0.1em 0.3em;
border-radius: 3px;
+ color: #c5c8c6;
}
.coal a:hover > .hljs {
text-decoration: underline;
@@ -634,6 +636,7 @@ table thead td {
vertical-align: middle;
padding: 0.1em 0.3em;
border-radius: 3px;
+ color: #c5c8c6;
}
.navy a:hover > .hljs {
text-decoration: underline;
@@ -752,6 +755,7 @@ table thead td {
vertical-align: middle;
padding: 0.1em 0.3em;
border-radius: 3px;
+ color: #6e6b5e;
}
.rust a:hover > .hljs {
text-decoration: underline;
@@ -775,6 +779,125 @@ table thead td {
.rust pre > .result {
margin-top: 10px;
}
+.ayu {
+ color: #c5c5c5;
+ background-color: #0f1419;
+/* Inline code */
+}
+.ayu .content .header:link,
+.ayu .content .header:visited {
+ color: #c5c5c5;
+ pointer: cursor;
+}
+.ayu .content .header:link:hover,
+.ayu .content .header:visited:hover {
+ text-decoration: none;
+}
+.ayu .sidebar {
+ background-color: #14191f;
+ color: #c8c9db;
+}
+.ayu .chapter li {
+ color: #5c6773;
+}
+.ayu .chapter li a {
+ color: #c8c9db;
+}
+.ayu .chapter li .active,
+.ayu .chapter li a:hover {
+/* Animate color change */
+ color: #ffb454;
+}
+.ayu .chapter .spacer {
+ background-color: #2d334f;
+}
+.ayu .menu-bar,
+.ayu .menu-bar:visited,
+.ayu .nav-chapters,
+.ayu .nav-chapters:visited,
+.ayu .mobile-nav-chapters,
+.ayu .mobile-nav-chapters:visited {
+ color: #737480;
+}
+.ayu .menu-bar i:hover,
+.ayu .nav-chapters:hover,
+.ayu .mobile-nav-chapters i:hover {
+ color: #b7b9cc;
+}
+.ayu .mobile-nav-chapters i:hover {
+ color: #c8c9db;
+}
+.ayu .mobile-nav-chapters {
+ background-color: #14191f;
+}
+.ayu .content a:link,
+.ayu a:visited,
+.ayu a > .hljs {
+ color: #0096cf;
+}
+.ayu .theme-popup {
+ color: #c5c5c5;
+ background: #14191f;
+ border: 1px solid #5c6773;
+}
+.ayu .theme-popup .theme:hover {
+ background-color: #191f26;
+}
+.ayu .theme-popup .default {
+ color: #737480;
+}
+.ayu blockquote {
+ margin: 20px 0;
+ padding: 0 20px;
+ color: #c5c5c5;
+ background-color: #262933;
+ border-top: 0.1em solid #2f333f;
+ border-bottom: 0.1em solid #2f333f;
+}
+.ayu table td {
+ border-color: #182028;
+}
+.ayu table tbody tr:nth-child(2n) {
+ background: #141b22;
+}
+.ayu table thead {
+ background: #324354;
+}
+.ayu table thead td {
+ border: none;
+}
+.ayu table thead tr {
+ border: 1px #324354 solid;
+}
+.ayu :not(pre) > .hljs {
+ display: inline-block;
+ vertical-align: middle;
+ padding: 0.1em 0.3em;
+ border-radius: 3px;
+ color: #ffb454;
+}
+.ayu a:hover > .hljs {
+ text-decoration: underline;
+}
+.ayu pre {
+ position: relative;
+}
+.ayu pre > .buttons {
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ color: #c8c9db;
+ cursor: pointer;
+}
+.ayu pre > .buttons :hover {
+ color: #ffb454;
+}
+.ayu pre > .buttons i {
+ margin-left: 8px;
+}
+.ayu pre > .result {
+ margin-top: 10px;
+}
@media only print {
#sidebar,
#menu-bar,
diff --git a/src/theme/book.js b/src/theme/book.js
index 98babec8..86b47d09 100644
--- a/src/theme/book.js
+++ b/src/theme/book.js
@@ -92,7 +92,8 @@ $( document ).ready(function() {
.append($('
Light
(default)'))
.append($('
Rust
'))
.append($('
Coal
'))
- .append($('
Navy
'));
+ .append($('
Navy
'))
+ .append($('
Ayu
'));
popup.insertAfter(this);
@@ -108,9 +109,15 @@ $( document ).ready(function() {
function set_theme(theme) {
if (theme == 'coal' || theme == 'navy') {
+ $("[href='ayu-highlight.css']").prop('disabled', true);
$("[href='tomorrow-night.css']").prop('disabled', false);
$("[href='highlight.css']").prop('disabled', true);
+ } else if (theme == 'ayu') {
+ $("[href='ayu-highlight.css']").prop('disabled', false);
+ $("[href='tomorrow-night.css']").prop('disabled', true);
+ $("[href='highlight.css']").prop('disabled', true);
} else {
+ $("[href='ayu-highlight.css']").prop('disabled', true);
$("[href='tomorrow-night.css']").prop('disabled', true);
$("[href='highlight.css']").prop('disabled', false);
}
diff --git a/src/theme/index.hbs b/src/theme/index.hbs
index 27464213..bf316f5f 100644
--- a/src/theme/index.hbs
+++ b/src/theme/index.hbs
@@ -20,6 +20,7 @@
+
{{#each additional_css}}
diff --git a/src/theme/mod.rs b/src/theme/mod.rs
index cff8ef4e..8b218e51 100644
--- a/src/theme/mod.rs
+++ b/src/theme/mod.rs
@@ -10,6 +10,7 @@ pub static JS: &'static [u8] = include_bytes!("book.js");
pub static HIGHLIGHT_JS: &'static [u8] = include_bytes!("highlight.js");
pub static TOMORROW_NIGHT_CSS: &'static [u8] = include_bytes!("tomorrow-night.css");
pub static HIGHLIGHT_CSS: &'static [u8] = include_bytes!("highlight.css");
+pub static AYU_HIGHLIGHT_CSS: &'static [u8] = include_bytes!("ayu-highlight.css");
pub static JQUERY: &'static [u8] = include_bytes!("jquery-2.1.4.min.js");
pub static CLIPBOARD_JS: &'static [u8] = include_bytes!("clipboard.min.js");
pub static STORE_JS: &'static [u8] = include_bytes!("store.js");
@@ -37,6 +38,7 @@ pub struct Theme {
pub js: Vec
,
pub highlight_css: Vec,
pub tomorrow_night_css: Vec,
+ pub ayu_highlight_css: Vec,
pub highlight_js: Vec,
pub clipboard_js: Vec,
pub store_js: Vec,
@@ -54,6 +56,7 @@ impl Theme {
js: JS.to_owned(),
highlight_css: HIGHLIGHT_CSS.to_owned(),
tomorrow_night_css: TOMORROW_NIGHT_CSS.to_owned(),
+ ayu_highlight_css: AYU_HIGHLIGHT_CSS.to_owned(),
highlight_js: HIGHLIGHT_JS.to_owned(),
clipboard_js: CLIPBOARD_JS.to_owned(),
store_js: STORE_JS.to_owned(),
@@ -123,6 +126,12 @@ impl Theme {
let _ = f.read_to_end(&mut theme.tomorrow_night_css);
}
+ // ayu-highlight.css
+ if let Ok(mut f) = File::open(&src.join("ayu-highlight.css")) {
+ theme.ayu_highlight_css.clear();
+ let _ = f.read_to_end(&mut theme.ayu_highlight_css);
+ }
+
theme
}
}
diff --git a/src/theme/stylus/themes/ayu.styl b/src/theme/stylus/themes/ayu.styl
new file mode 100644
index 00000000..fb79dd8b
--- /dev/null
+++ b/src/theme/stylus/themes/ayu.styl
@@ -0,0 +1,30 @@
+$theme-name = 'ayu'
+
+$bg = #0f1419
+$fg = #c5c5c5
+
+$sidebar-bg = #14191f
+$sidebar-fg = #c8c9db
+$sidebar-non-existant = #5c6773
+$sidebar-active = #ffb454
+$sidebar-spacer = #2d334f
+
+$icons = #737480
+$icons-hover = #b7b9cc
+
+$links = #0096cf
+
+$inline-code-color = #ffb454
+
+$theme-popup-bg = #14191f
+$theme-popup-border = #5c6773
+$theme-hover = #191f26
+
+$quote-bg = #262933
+$quote-border = lighten($quote-bg, 5%)
+
+$table-border-color = lighten($bg, 5%)
+$table-header-bg = lighten($bg, 20%)
+$table-alternate-bg = lighten($bg, 3%)
+
+@import 'base'
diff --git a/src/theme/stylus/themes/base.styl b/src/theme/stylus/themes/base.styl
index 9538906b..9bc90568 100644
--- a/src/theme/stylus/themes/base.styl
+++ b/src/theme/stylus/themes/base.styl
@@ -105,6 +105,7 @@
vertical-align: middle;
padding: 0.1em 0.3em;
border-radius: 3px;
+ color: $inline-code-color;
}
a:hover > .hljs {
diff --git a/src/theme/stylus/themes/coal.styl b/src/theme/stylus/themes/coal.styl
index 8864d3c2..82119b1b 100644
--- a/src/theme/stylus/themes/coal.styl
+++ b/src/theme/stylus/themes/coal.styl
@@ -14,6 +14,8 @@ $icons-hover = #b3c0cc
$links = #2b79a2
+$inline-code-color = #c5c8c6;
+
$theme-popup-bg = #141617
$theme-popup-border = #43484d
$theme-hover = #1f2124
diff --git a/src/theme/stylus/themes/index.styl b/src/theme/stylus/themes/index.styl
index f364b5aa..be06b6fc 100644
--- a/src/theme/stylus/themes/index.styl
+++ b/src/theme/stylus/themes/index.styl
@@ -2,3 +2,4 @@
@import 'coal'
@import 'navy'
@import 'rust'
+@import 'ayu'
diff --git a/src/theme/stylus/themes/light.styl b/src/theme/stylus/themes/light.styl
index 05cbb7f9..f6495b70 100644
--- a/src/theme/stylus/themes/light.styl
+++ b/src/theme/stylus/themes/light.styl
@@ -14,6 +14,8 @@ $icons-hover = #333333
$links = #4183c4
+$inline-code-color = #6e6b5e;
+
$theme-popup-bg = #fafafa
$theme-popup-border = #cccccc
$theme-hover = #e6e6e6
diff --git a/src/theme/stylus/themes/navy.styl b/src/theme/stylus/themes/navy.styl
index 7a761965..826f8fc2 100644
--- a/src/theme/stylus/themes/navy.styl
+++ b/src/theme/stylus/themes/navy.styl
@@ -14,6 +14,8 @@ $icons-hover = #b7b9cc
$links = #2b79a2
+$inline-code-color = #c5c8c6;
+
$theme-popup-bg = #161923
$theme-popup-border = #737480
$theme-hover = #282e40
diff --git a/src/theme/stylus/themes/rust.styl b/src/theme/stylus/themes/rust.styl
index a44915d9..12c7ed42 100644
--- a/src/theme/stylus/themes/rust.styl
+++ b/src/theme/stylus/themes/rust.styl
@@ -14,6 +14,8 @@ $icons-hover = #262625
$links = #2b79a2
+$inline-code-color = #6e6b5e;
+
$theme-popup-bg = #e1e1db
$theme-popup-border = #b38f6b
$theme-hover = #99908a