Additional Theme
add tests for additional-themes Update book.js sanitized default sanitize the id name in the DOM catch error if attempting to select or deselect a non-existent theme. sanitize theme names Update book.js Update book.js Update book.js Revert "Update book.js" This reverts commit 0ed9477bf418c48615f7f48fe6209874603401fc. Update book.js Update config.rs Revert "Update hbs_renderer.rs" This reverts commit 54ad1d530003e8000b725da96cced424e572445c. Revert "Update config.rs" This reverts commit 06909a72e5675979f1d686bc2a127b8d77491295. Revert "Update hbs_renderer.rs" This reverts commit dc0f9595619dd4ede3f2812d370112ef55ba8f54. Update hbs_renderer.rs Update hbs_renderer.rs Update config.rs Update book.js Additional Theme
This commit is contained in:
parent
660cbfa6ce
commit
a132734ea0
|
@ -536,6 +536,8 @@ pub struct HtmlConfig {
|
||||||
pub google_analytics: Option<String>,
|
pub google_analytics: Option<String>,
|
||||||
/// Additional CSS stylesheets to include in the rendered page's `<head>`.
|
/// Additional CSS stylesheets to include in the rendered page's `<head>`.
|
||||||
pub additional_css: Vec<PathBuf>,
|
pub additional_css: Vec<PathBuf>,
|
||||||
|
/// Additional theme.
|
||||||
|
pub additional_theme: Vec<PathBuf>,
|
||||||
/// Additional JS scripts to include at the bottom of the rendered page's
|
/// Additional JS scripts to include at the bottom of the rendered page's
|
||||||
/// `<body>`.
|
/// `<body>`.
|
||||||
pub additional_js: Vec<PathBuf>,
|
pub additional_js: Vec<PathBuf>,
|
||||||
|
@ -595,6 +597,7 @@ impl Default for HtmlConfig {
|
||||||
copy_fonts: true,
|
copy_fonts: true,
|
||||||
google_analytics: None,
|
google_analytics: None,
|
||||||
additional_css: Vec::new(),
|
additional_css: Vec::new(),
|
||||||
|
additional_theme: Vec::new(),
|
||||||
additional_js: Vec::new(),
|
additional_js: Vec::new(),
|
||||||
fold: Fold::default(),
|
fold: Fold::default(),
|
||||||
playground: Playground::default(),
|
playground: Playground::default(),
|
||||||
|
@ -801,6 +804,7 @@ mod tests {
|
||||||
curly-quotes = true
|
curly-quotes = true
|
||||||
google-analytics = "123456"
|
google-analytics = "123456"
|
||||||
additional-css = ["./foo/bar/baz.css"]
|
additional-css = ["./foo/bar/baz.css"]
|
||||||
|
additional-theme = ["foobar"]
|
||||||
git-repository-url = "https://foo.com/"
|
git-repository-url = "https://foo.com/"
|
||||||
git-repository-icon = "fa-code-fork"
|
git-repository-icon = "fa-code-fork"
|
||||||
|
|
||||||
|
@ -848,6 +852,7 @@ mod tests {
|
||||||
curly_quotes: true,
|
curly_quotes: true,
|
||||||
google_analytics: Some(String::from("123456")),
|
google_analytics: Some(String::from("123456")),
|
||||||
additional_css: vec![PathBuf::from("./foo/bar/baz.css")],
|
additional_css: vec![PathBuf::from("./foo/bar/baz.css")],
|
||||||
|
additional_theme: vec![PathBuf::from("foobar")],
|
||||||
theme: Some(PathBuf::from("./themedir")),
|
theme: Some(PathBuf::from("./themedir")),
|
||||||
default_theme: Some(String::from("rust")),
|
default_theme: Some(String::from("rust")),
|
||||||
playground: playground_should_be,
|
playground: playground_should_be,
|
||||||
|
@ -1028,6 +1033,7 @@ mod tests {
|
||||||
curly-quotes = true
|
curly-quotes = true
|
||||||
google-analytics = "123456"
|
google-analytics = "123456"
|
||||||
additional-css = ["custom.css", "custom2.css"]
|
additional-css = ["custom.css", "custom2.css"]
|
||||||
|
additional-theme = ["barfoo"]
|
||||||
additional-js = ["custom.js"]
|
additional-js = ["custom.js"]
|
||||||
"#;
|
"#;
|
||||||
|
|
||||||
|
@ -1053,6 +1059,7 @@ mod tests {
|
||||||
curly_quotes: true,
|
curly_quotes: true,
|
||||||
google_analytics: Some(String::from("123456")),
|
google_analytics: Some(String::from("123456")),
|
||||||
additional_css: vec![PathBuf::from("custom.css"), PathBuf::from("custom2.css")],
|
additional_css: vec![PathBuf::from("custom.css"), PathBuf::from("custom2.css")],
|
||||||
|
additional_theme: vec![PathBuf::from("barfoo")],
|
||||||
additional_js: vec![PathBuf::from("custom.js")],
|
additional_js: vec![PathBuf::from("custom.js")],
|
||||||
..Default::default()
|
..Default::default()
|
||||||
};
|
};
|
||||||
|
|
|
@ -715,6 +715,18 @@ fn make_data(
|
||||||
data.insert("additional_css".to_owned(), json!(css));
|
data.insert("additional_css".to_owned(), json!(css));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Add check to see if there are additional themes
|
||||||
|
if !html_config.additional_theme.is_empty() {
|
||||||
|
let mut theme = Vec::new();
|
||||||
|
for name in &html_config.additional_theme {
|
||||||
|
match name.strip_prefix(root) {
|
||||||
|
Ok(p) => theme.push(p.to_str().expect("Could not convert to str")),
|
||||||
|
Err(_) => theme.push(name.to_str().expect("Could not convert to str")),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
data.insert("additional_theme".to_owned(), json!(theme));
|
||||||
|
}
|
||||||
|
|
||||||
// Add check to see if there is an additional script
|
// Add check to see if there is an additional script
|
||||||
if !html_config.additional_js.is_empty() {
|
if !html_config.additional_js.is_empty() {
|
||||||
let mut js = Vec::new();
|
let mut js = Vec::new();
|
||||||
|
|
|
@ -305,7 +305,9 @@ function playground_text(playground, hidden = true) {
|
||||||
themePopup.querySelectorAll('.theme-selected').forEach(function (el) {
|
themePopup.querySelectorAll('.theme-selected').forEach(function (el) {
|
||||||
el.classList.remove('theme-selected');
|
el.classList.remove('theme-selected');
|
||||||
});
|
});
|
||||||
themePopup.querySelector("button#" + get_theme()).classList.add('theme-selected');
|
try {
|
||||||
|
themePopup.querySelector("button#" + get_theme()).classList.add('theme-selected');
|
||||||
|
} catch (e) { }
|
||||||
}
|
}
|
||||||
|
|
||||||
function hideThemes() {
|
function hideThemes() {
|
||||||
|
@ -318,9 +320,9 @@ function playground_text(playground, hidden = true) {
|
||||||
var theme;
|
var theme;
|
||||||
try { theme = localStorage.getItem('mdbook-theme'); } catch (e) { }
|
try { theme = localStorage.getItem('mdbook-theme'); } catch (e) { }
|
||||||
if (theme === null || theme === undefined) {
|
if (theme === null || theme === undefined) {
|
||||||
return default_theme;
|
return default_theme.replace(/\W+/g, '_').toLowerCase();
|
||||||
} else {
|
} else {
|
||||||
return theme;
|
return theme.replace(/\W+/g, '_').toLowerCase();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -331,13 +333,17 @@ function playground_text(playground, hidden = true) {
|
||||||
stylesheets.ayuHighlight.disabled = true;
|
stylesheets.ayuHighlight.disabled = true;
|
||||||
stylesheets.tomorrowNight.disabled = false;
|
stylesheets.tomorrowNight.disabled = false;
|
||||||
stylesheets.highlight.disabled = true;
|
stylesheets.highlight.disabled = true;
|
||||||
|
|
||||||
ace_theme = "ace/theme/tomorrow_night";
|
ace_theme = "ace/theme/tomorrow_night";
|
||||||
} else if (theme == 'ayu') {
|
} else if (theme == 'ayu') {
|
||||||
stylesheets.ayuHighlight.disabled = false;
|
stylesheets.ayuHighlight.disabled = false;
|
||||||
stylesheets.tomorrowNight.disabled = true;
|
stylesheets.tomorrowNight.disabled = true;
|
||||||
stylesheets.highlight.disabled = true;
|
stylesheets.highlight.disabled = true;
|
||||||
ace_theme = "ace/theme/tomorrow_night";
|
ace_theme = "ace/theme/tomorrow_night";
|
||||||
|
} else if (theme == 'rust' || theme == 'light') {
|
||||||
|
stylesheets.ayuHighlight.disabled = true;
|
||||||
|
stylesheets.tomorrowNight.disabled = true;
|
||||||
|
stylesheets.highlight.disabled = false;
|
||||||
|
ace_theme = "ace/theme/dawn";
|
||||||
} else {
|
} else {
|
||||||
stylesheets.ayuHighlight.disabled = true;
|
stylesheets.ayuHighlight.disabled = true;
|
||||||
stylesheets.tomorrowNight.disabled = true;
|
stylesheets.tomorrowNight.disabled = true;
|
||||||
|
@ -355,17 +361,23 @@ function playground_text(playground, hidden = true) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
var previousTheme = get_theme();
|
var previousTheme = get_theme().replace(/\W+/g, '_').toLowerCase();
|
||||||
|
var selectedTheme = theme.replace(/\W+/g, '_').toLowerCase();
|
||||||
if (store) {
|
if (store) {
|
||||||
try { localStorage.setItem('mdbook-theme', theme); } catch (e) { }
|
try { localStorage.setItem('mdbook-theme', selectedTheme); } catch (e) { }
|
||||||
}
|
}
|
||||||
|
|
||||||
html.classList.remove(previousTheme);
|
try {
|
||||||
html.classList.add(theme);
|
html.classList.remove( previousTheme );
|
||||||
|
html.classList.add( selectedTheme );
|
||||||
|
} catch (e) { }
|
||||||
|
|
||||||
updateThemeSelected();
|
updateThemeSelected();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Sanitize theme id names
|
||||||
|
themePopup.querySelectorAll("button").forEach(e=>{e.id=e.id.replace(/\W+/g, '_').toLowerCase();});
|
||||||
|
|
||||||
// Set theme
|
// Set theme
|
||||||
var theme = get_theme();
|
var theme = get_theme();
|
||||||
|
|
||||||
|
|
|
@ -59,6 +59,7 @@
|
||||||
<script>
|
<script>
|
||||||
var path_to_root = "{{ path_to_root }}";
|
var path_to_root = "{{ path_to_root }}";
|
||||||
var default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "{{ preferred_dark_theme }}" : "{{ default_theme }}";
|
var default_theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "{{ preferred_dark_theme }}" : "{{ default_theme }}";
|
||||||
|
default_theme = default_theme.replace(/\W+/g, '_').toLowerCase();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Work around some values being stored in localStorage wrapped in quotes -->
|
<!-- Work around some values being stored in localStorage wrapped in quotes -->
|
||||||
|
@ -83,8 +84,10 @@
|
||||||
try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
|
try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
|
||||||
if (theme === null || theme === undefined) { theme = default_theme; }
|
if (theme === null || theme === undefined) { theme = default_theme; }
|
||||||
var html = document.querySelector('html');
|
var html = document.querySelector('html');
|
||||||
html.classList.remove('{{ default_theme }}')
|
try {
|
||||||
html.classList.add(theme);
|
html.classList.remove('{{ default_theme }}');
|
||||||
|
html.classList.add(theme.replace(/\W+/g, '_').toLowerCase());
|
||||||
|
} catch(e) { }
|
||||||
var body = document.querySelector('body');
|
var body = document.querySelector('body');
|
||||||
body.classList.remove('no-js')
|
body.classList.remove('no-js')
|
||||||
body.classList.add('js');
|
body.classList.add('js');
|
||||||
|
@ -156,6 +159,9 @@
|
||||||
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
|
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
|
||||||
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
|
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
|
||||||
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
|
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
|
||||||
|
{{#each additional_theme}}
|
||||||
|
<li role="none"><button role="menuitem" class="theme" id="{{ this }}">{{ this }}</button></li>
|
||||||
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
{{#if search_enabled}}
|
{{#if search_enabled}}
|
||||||
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
|
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
|
||||||
|
|
|
@ -9,6 +9,8 @@ edition = "2018"
|
||||||
|
|
||||||
[output.html]
|
[output.html]
|
||||||
mathjax-support = true
|
mathjax-support = true
|
||||||
|
additional-css = ["orange.css"]
|
||||||
|
additional-theme = ["Orange"]
|
||||||
|
|
||||||
[output.html.playground]
|
[output.html.playground]
|
||||||
editable = true
|
editable = true
|
||||||
|
|
|
@ -0,0 +1,39 @@
|
||||||
|
.orange {
|
||||||
|
--bg: #f6f6ef;
|
||||||
|
--fg: Black;
|
||||||
|
|
||||||
|
--sidebar-bg: #ff6600;
|
||||||
|
--sidebar-fg: Black;
|
||||||
|
--sidebar-non-existant: color-mix(in srgb, var(--sidebar-bg) 75%, Black);
|
||||||
|
--sidebar-active: White;
|
||||||
|
--sidebar-spacer: color-mix(in srgb, var(--sidebar-bg) 95%, Black);
|
||||||
|
|
||||||
|
--scrollbar: #8F8F8F;
|
||||||
|
|
||||||
|
--icons: #747474;
|
||||||
|
--icons-hover: #000000;
|
||||||
|
|
||||||
|
--links: #828282;
|
||||||
|
|
||||||
|
--inline-code-color: Black
|
||||||
|
|
||||||
|
--theme-popup-bg: #fafafa;
|
||||||
|
--theme-popup-border: #cccccc;
|
||||||
|
--theme-hover: #e6e6e6;
|
||||||
|
|
||||||
|
--quote-bg: #e9e9ed;
|
||||||
|
--quote-border: #8f8f9d;
|
||||||
|
|
||||||
|
--table-border-color: hsl(0, 0%, 95%);
|
||||||
|
--table-header-bg: hsl(0, 0%, 80%);
|
||||||
|
--table-alternate-bg: hsl(0, 0%, 97%);
|
||||||
|
|
||||||
|
--searchbar-border-color: #aaa;
|
||||||
|
--searchbar-bg: #fafafa;
|
||||||
|
--searchbar-fg: #000;
|
||||||
|
--searchbar-shadow-color: #aaa;
|
||||||
|
--searchresults-header-fg: #666;
|
||||||
|
--searchresults-border-color: #888;
|
||||||
|
--searchresults-li-bg: #e4f2fe;
|
||||||
|
--search-mark-bg: #a2cff5;
|
||||||
|
}
|
Loading…
Reference in New Issue