update ui (#29)
This commit is contained in:
Adrian Timpau
GitHub
parent
c96406514d
commit
389cc6a8f2
|
|
@ -8,5 +8,6 @@ multilingual = false
|
|||
src = "src"
|
||||
|
||||
[output.html]
|
||||
git-repository-url="https://github.com/wormhole-foundation/xdapp-book"
|
||||
default-theme= "ayu"
|
||||
git-repository-url="https://github.com/wormhole-foundation/xdapp-book"
|
||||
additional-js = ["src/static/solidity.min.js"]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,337 @@
|
|||
hljs.registerLanguage(
|
||||
"solidity",
|
||||
(() => {
|
||||
"use strict";
|
||||
function e() {
|
||||
try {
|
||||
return !0;
|
||||
} catch (e) {
|
||||
return !1;
|
||||
}
|
||||
}
|
||||
var a =
|
||||
/-?(\b0[xX]([a-fA-F0-9]_?)*[a-fA-F0-9]|(\b[1-9](_?\d)*(\.((\d_?)*\d)?)?|\.\d(_?\d)*)([eE][-+]?\d(_?\d)*)?|\b0)(?!\w|\$)/;
|
||||
e() && (a = a.source.replace(/\\b/g, "(?<!\\$)\\b"));
|
||||
var s = { className: "number", begin: a, relevance: 0 },
|
||||
n = {
|
||||
keyword:
|
||||
"assembly let function if switch case default for leave break continue u256 jump jumpi stop return revert selfdestruct invalid",
|
||||
built_in:
|
||||
"add sub mul div sdiv mod smod exp not lt gt slt sgt eq iszero and or xor byte shl shr sar addmod mulmod signextend keccak256 pc pop dup1 dup2 dup3 dup4 dup5 dup6 dup7 dup8 dup9 dup10 dup11 dup12 dup13 dup14 dup15 dup16 swap1 swap2 swap3 swap4 swap5 swap6 swap7 swap8 swap9 swap10 swap11 swap12 swap13 swap14 swap15 swap16 mload mstore mstore8 sload sstore msize gas address balance selfbalance caller callvalue calldataload calldatasize calldatacopy codesize codecopy extcodesize extcodecopy returndatasize returndatacopy extcodehash create create2 call callcode delegatecall staticcall log0 log1 log2 log3 log4 chainid origin gasprice basefee blockhash coinbase timestamp number difficulty gaslimit",
|
||||
literal: "true false",
|
||||
},
|
||||
i = {
|
||||
className: "string",
|
||||
begin: /\bhex'(([0-9a-fA-F]{2}_?)*[0-9a-fA-F]{2})?'/,
|
||||
},
|
||||
t = {
|
||||
className: "string",
|
||||
begin: /\bhex"(([0-9a-fA-F]{2}_?)*[0-9a-fA-F]{2})?"/,
|
||||
};
|
||||
function r(e) {
|
||||
return e.inherit(e.APOS_STRING_MODE, { begin: /(\bunicode)?'/ });
|
||||
}
|
||||
function l(e) {
|
||||
return e.inherit(e.QUOTE_STRING_MODE, { begin: /(\bunicode)?"/ });
|
||||
}
|
||||
var o = {
|
||||
SOL_ASSEMBLY_KEYWORDS: n,
|
||||
baseAssembly: (e) => {
|
||||
var a = r(e),
|
||||
o = l(e),
|
||||
c = /[A-Za-z_$][A-Za-z_$0-9.]*/,
|
||||
d = e.inherit(e.TITLE_MODE, {
|
||||
begin: /[A-Za-z$_][0-9A-Za-z$_]*/,
|
||||
lexemes: c,
|
||||
keywords: n,
|
||||
}),
|
||||
u = {
|
||||
className: "params",
|
||||
begin: /\(/,
|
||||
end: /\)/,
|
||||
excludeBegin: !0,
|
||||
excludeEnd: !0,
|
||||
lexemes: c,
|
||||
keywords: n,
|
||||
contains: [e.C_LINE_COMMENT_MODE, e.C_BLOCK_COMMENT_MODE, a, o, s],
|
||||
},
|
||||
_ = {
|
||||
className: "operator",
|
||||
begin: /:=|->/,
|
||||
};
|
||||
return {
|
||||
keywords: n,
|
||||
lexemes: c,
|
||||
contains: [
|
||||
a,
|
||||
o,
|
||||
i,
|
||||
t,
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
s,
|
||||
_,
|
||||
{
|
||||
className: "function",
|
||||
lexemes: c,
|
||||
beginKeywords: "function",
|
||||
end: "{",
|
||||
excludeEnd: !0,
|
||||
contains: [
|
||||
d,
|
||||
u,
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
_,
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
solAposStringMode: r,
|
||||
solQuoteStringMode: l,
|
||||
HEX_APOS_STRING_MODE: i,
|
||||
HEX_QUOTE_STRING_MODE: t,
|
||||
SOL_NUMBER: s,
|
||||
isNegativeLookbehindAvailable: e,
|
||||
};
|
||||
const {
|
||||
baseAssembly: c,
|
||||
solAposStringMode: d,
|
||||
solQuoteStringMode: u,
|
||||
HEX_APOS_STRING_MODE: _,
|
||||
HEX_QUOTE_STRING_MODE: m,
|
||||
SOL_NUMBER: b,
|
||||
isNegativeLookbehindAvailable: E,
|
||||
} = o;
|
||||
return (e) => {
|
||||
for (var a = d(e), s = u(e), n = [], i = 0; i < 32; i++) n[i] = i + 1;
|
||||
var t = n.map((e) => 8 * e),
|
||||
r = [];
|
||||
for (i = 0; i <= 80; i++) r[i] = i;
|
||||
var l = n.map((e) => "bytes" + e).join(" ") + " ",
|
||||
o = t.map((e) => "uint" + e).join(" ") + " ",
|
||||
g = t.map((e) => "int" + e).join(" ") + " ",
|
||||
M = [].concat.apply(
|
||||
[],
|
||||
t.map((e) => r.map((a) => e + "x" + a))
|
||||
),
|
||||
p = {
|
||||
keyword:
|
||||
"var bool string int uint " +
|
||||
g +
|
||||
o +
|
||||
"byte bytes " +
|
||||
l +
|
||||
"fixed ufixed " +
|
||||
M.map((e) => "fixed" + e).join(" ") +
|
||||
" " +
|
||||
M.map((e) => "ufixed" + e).join(" ") +
|
||||
" enum struct mapping address new delete if else for while continue break return throw emit try catch revert unchecked _ function modifier event constructor fallback receive error virtual override constant immutable anonymous indexed storage memory calldata external public internal payable pure view private returns import from as using pragma contract interface library is abstract type assembly",
|
||||
literal:
|
||||
"true false wei gwei szabo finney ether seconds minutes hours days weeks years",
|
||||
built_in:
|
||||
"self this super selfdestruct suicide now msg block tx abi blockhash gasleft assert require Error Panic sha3 sha256 keccak256 ripemd160 ecrecover addmod mulmod log0 log1 log2 log3 log4",
|
||||
},
|
||||
O = { className: "operator", begin: /[+\-!~*\/%<>&^|=]/ },
|
||||
C = /[A-Za-z_$][A-Za-z_$0-9]*/,
|
||||
N = {
|
||||
className: "params",
|
||||
begin: /\(/,
|
||||
end: /\)/,
|
||||
excludeBegin: !0,
|
||||
excludeEnd: !0,
|
||||
lexemes: C,
|
||||
keywords: p,
|
||||
contains: [
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
a,
|
||||
s,
|
||||
b,
|
||||
"self",
|
||||
],
|
||||
},
|
||||
f = {
|
||||
begin: /\.\s*/,
|
||||
end: /[^A-Za-z0-9$_\.]/,
|
||||
excludeBegin: !0,
|
||||
excludeEnd: !0,
|
||||
keywords: {
|
||||
built_in:
|
||||
"gas value selector address length push pop send transfer call callcode delegatecall staticcall balance code codehash wrap unwrap name creationCode runtimeCode interfaceId min max",
|
||||
},
|
||||
relevance: 2,
|
||||
},
|
||||
y = e.inherit(e.TITLE_MODE, {
|
||||
begin: /[A-Za-z$_][0-9A-Za-z$_]*/,
|
||||
lexemes: C,
|
||||
keywords: p,
|
||||
}),
|
||||
w = {
|
||||
className: "built_in",
|
||||
begin: (E() ? "(?<!\\$)\\b" : "\\b") + "(gas|value|salt)(?=:)",
|
||||
};
|
||||
function x(e, a) {
|
||||
return {
|
||||
begin: (E() ? "(?<!\\$)\\b" : "\\b") + e + "\\.\\s*",
|
||||
end: /[^A-Za-z0-9$_\.]/,
|
||||
excludeBegin: !1,
|
||||
excludeEnd: !0,
|
||||
lexemes: C,
|
||||
keywords: { built_in: e + " " + a },
|
||||
contains: [f],
|
||||
relevance: 10,
|
||||
};
|
||||
}
|
||||
var h = c(e),
|
||||
v = e.inherit(h, {
|
||||
contains: h.contains.concat([
|
||||
{
|
||||
begin: /\./,
|
||||
end: /[^A-Za-z0-9$.]/,
|
||||
excludeBegin: !0,
|
||||
excludeEnd: !0,
|
||||
keywords: { built_in: "slot offset length address selector" },
|
||||
relevance: 2,
|
||||
},
|
||||
{
|
||||
begin: /_/,
|
||||
end: /[^A-Za-z0-9$.]/,
|
||||
excludeBegin: !0,
|
||||
excludeEnd: !0,
|
||||
keywords: { built_in: "slot offset" },
|
||||
relevance: 2,
|
||||
},
|
||||
]),
|
||||
});
|
||||
return {
|
||||
aliases: ["sol"],
|
||||
keywords: p,
|
||||
lexemes: C,
|
||||
contains: [
|
||||
a,
|
||||
s,
|
||||
_,
|
||||
m,
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
b,
|
||||
w,
|
||||
O,
|
||||
{
|
||||
className: "function",
|
||||
lexemes: C,
|
||||
beginKeywords:
|
||||
"function modifier event constructor fallback receive error",
|
||||
end: /[{;]/,
|
||||
excludeEnd: !0,
|
||||
contains: [y, N, w, e.C_LINE_COMMENT_MODE, e.C_BLOCK_COMMENT_MODE],
|
||||
illegal: /%/,
|
||||
},
|
||||
x("msg", "gas value data sender sig"),
|
||||
x(
|
||||
"block",
|
||||
"blockhash coinbase difficulty gaslimit basefee number timestamp chainid"
|
||||
),
|
||||
x("tx", "gasprice origin"),
|
||||
x(
|
||||
"abi",
|
||||
"decode encode encodePacked encodeWithSelector encodeWithSignature encodeCall"
|
||||
),
|
||||
x("bytes", "concat"),
|
||||
f,
|
||||
{
|
||||
className: "class",
|
||||
lexemes: C,
|
||||
beginKeywords: "contract interface library",
|
||||
end: "{",
|
||||
excludeEnd: !0,
|
||||
illegal: /[:"\[\]]/,
|
||||
contains: [
|
||||
{ beginKeywords: "is", lexemes: C },
|
||||
y,
|
||||
N,
|
||||
w,
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
],
|
||||
},
|
||||
{
|
||||
lexemes: C,
|
||||
beginKeywords: "struct enum",
|
||||
end: "{",
|
||||
excludeEnd: !0,
|
||||
illegal: /[:"\[\]]/,
|
||||
contains: [y, e.C_LINE_COMMENT_MODE, e.C_BLOCK_COMMENT_MODE],
|
||||
},
|
||||
{
|
||||
beginKeywords: "import",
|
||||
end: ";",
|
||||
lexemes: C,
|
||||
keywords: "import from as",
|
||||
contains: [
|
||||
y,
|
||||
a,
|
||||
s,
|
||||
_,
|
||||
m,
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
O,
|
||||
],
|
||||
},
|
||||
{
|
||||
beginKeywords: "using",
|
||||
end: ";",
|
||||
lexemes: C,
|
||||
keywords: "using for",
|
||||
contains: [y, e.C_LINE_COMMENT_MODE, e.C_BLOCK_COMMENT_MODE, O],
|
||||
},
|
||||
{
|
||||
className: "meta",
|
||||
beginKeywords: "pragma",
|
||||
end: ";",
|
||||
lexemes: C,
|
||||
keywords: {
|
||||
keyword: "pragma solidity experimental abicoder",
|
||||
built_in: "ABIEncoderV2 SMTChecker v1 v2",
|
||||
},
|
||||
contains: [
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
e.inherit(a, {
|
||||
className: "meta-string",
|
||||
}),
|
||||
e.inherit(s, { className: "meta-string" }),
|
||||
],
|
||||
},
|
||||
{
|
||||
beginKeywords: "assembly",
|
||||
end: /\b\B/,
|
||||
contains: [
|
||||
e.C_LINE_COMMENT_MODE,
|
||||
e.C_BLOCK_COMMENT_MODE,
|
||||
e.inherit(v, {
|
||||
begin: "{",
|
||||
end: "}",
|
||||
endsParent: !0,
|
||||
contains: v.contains.concat([
|
||||
e.inherit(v, {
|
||||
begin: "{",
|
||||
end: "}",
|
||||
contains: v.contains.concat(["self"]),
|
||||
}),
|
||||
]),
|
||||
}),
|
||||
],
|
||||
},
|
||||
],
|
||||
illegal: /#/,
|
||||
};
|
||||
};
|
||||
})()
|
||||
);
|
||||
|
||||
// Ugly hack to reload HLJS
|
||||
hljs.initHighlightingOnLoad();
|
||||
|
|
@ -0,0 +1,755 @@
|
|||
"use strict";
|
||||
|
||||
// Fix back button cache problem
|
||||
window.onunload = function () {};
|
||||
|
||||
// Global variable, shared between modules
|
||||
function playground_text(playground) {
|
||||
let code_block = playground.querySelector("code");
|
||||
|
||||
if (window.ace && code_block.classList.contains("editable")) {
|
||||
let editor = window.ace.edit(code_block);
|
||||
return editor.getValue();
|
||||
} else {
|
||||
return code_block.textContent;
|
||||
}
|
||||
}
|
||||
|
||||
(function codeSnippets() {
|
||||
function fetch_with_timeout(url, options, timeout = 6000) {
|
||||
return Promise.race([
|
||||
fetch(url, options),
|
||||
new Promise((_, reject) =>
|
||||
setTimeout(() => reject(new Error("timeout")), timeout)
|
||||
),
|
||||
]);
|
||||
}
|
||||
|
||||
var playgrounds = Array.from(document.querySelectorAll(".playground"));
|
||||
if (playgrounds.length > 0) {
|
||||
fetch_with_timeout("https://play.rust-lang.org/meta/crates", {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
method: "POST",
|
||||
mode: "cors",
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((response) => {
|
||||
// get list of crates available in the rust playground
|
||||
let playground_crates = response.crates.map((item) => item["id"]);
|
||||
playgrounds.forEach((block) =>
|
||||
handle_crate_list_update(block, playground_crates)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
function handle_crate_list_update(playground_block, playground_crates) {
|
||||
// update the play buttons after receiving the response
|
||||
update_play_button(playground_block, playground_crates);
|
||||
|
||||
// and install on change listener to dynamically update ACE editors
|
||||
if (window.ace) {
|
||||
let code_block = playground_block.querySelector("code");
|
||||
if (code_block.classList.contains("editable")) {
|
||||
let editor = window.ace.edit(code_block);
|
||||
editor.addEventListener("change", function (e) {
|
||||
update_play_button(playground_block, playground_crates);
|
||||
});
|
||||
// add Ctrl-Enter command to execute rust code
|
||||
editor.commands.addCommand({
|
||||
name: "run",
|
||||
bindKey: {
|
||||
win: "Ctrl-Enter",
|
||||
mac: "Ctrl-Enter",
|
||||
},
|
||||
exec: (_editor) => run_rust_code(playground_block),
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// updates the visibility of play button based on `no_run` class and
|
||||
// used crates vs ones available on http://play.rust-lang.org
|
||||
function update_play_button(pre_block, playground_crates) {
|
||||
var play_button = pre_block.querySelector(".play-button");
|
||||
|
||||
// skip if code is `no_run`
|
||||
if (pre_block.querySelector("code").classList.contains("no_run")) {
|
||||
play_button.classList.add("hidden");
|
||||
return;
|
||||
}
|
||||
|
||||
// get list of `extern crate`'s from snippet
|
||||
var txt = playground_text(pre_block);
|
||||
var re = /extern\s+crate\s+([a-zA-Z_0-9]+)\s*;/g;
|
||||
var snippet_crates = [];
|
||||
var item;
|
||||
while ((item = re.exec(txt))) {
|
||||
snippet_crates.push(item[1]);
|
||||
}
|
||||
|
||||
// check if all used crates are available on play.rust-lang.org
|
||||
var all_available = snippet_crates.every(function (elem) {
|
||||
return playground_crates.indexOf(elem) > -1;
|
||||
});
|
||||
|
||||
if (all_available) {
|
||||
play_button.classList.remove("hidden");
|
||||
} else {
|
||||
play_button.classList.add("hidden");
|
||||
}
|
||||
}
|
||||
|
||||
function run_rust_code(code_block) {
|
||||
var result_block = code_block.querySelector(".result");
|
||||
if (!result_block) {
|
||||
result_block = document.createElement("code");
|
||||
result_block.className = "result hljs language-bash";
|
||||
|
||||
code_block.append(result_block);
|
||||
}
|
||||
|
||||
let text = playground_text(code_block);
|
||||
let classes = code_block.querySelector("code").classList;
|
||||
let edition = "2015";
|
||||
if (classes.contains("edition2018")) {
|
||||
edition = "2018";
|
||||
} else if (classes.contains("edition2021")) {
|
||||
edition = "2021";
|
||||
}
|
||||
var params = {
|
||||
version: "stable",
|
||||
optimize: "0",
|
||||
code: text,
|
||||
edition: edition,
|
||||
};
|
||||
|
||||
if (text.indexOf("#![feature") !== -1) {
|
||||
params.version = "nightly";
|
||||
}
|
||||
|
||||
result_block.innerText = "Running...";
|
||||
|
||||
fetch_with_timeout("https://play.rust-lang.org/evaluate.json", {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
method: "POST",
|
||||
mode: "cors",
|
||||
body: JSON.stringify(params),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((response) => {
|
||||
if (response.result.trim() === "") {
|
||||
result_block.innerText = "No output";
|
||||
result_block.classList.add("result-no-output");
|
||||
} else {
|
||||
result_block.innerText = response.result;
|
||||
result_block.classList.remove("result-no-output");
|
||||
}
|
||||
})
|
||||
.catch(
|
||||
(error) =>
|
||||
(result_block.innerText =
|
||||
"Playground Communication: " + error.message)
|
||||
);
|
||||
}
|
||||
|
||||
// Syntax highlighting Configuration
|
||||
hljs.configure({
|
||||
tabReplace: " ", // 4 spaces
|
||||
languages: [], // Languages used for auto-detection
|
||||
});
|
||||
|
||||
let code_nodes = Array.from(document.querySelectorAll("code"))
|
||||
// Don't highlight `inline code` blocks in headers.
|
||||
.filter(function (node) {
|
||||
return !node.parentElement.classList.contains("header");
|
||||
});
|
||||
|
||||
if (window.ace) {
|
||||
// language-rust class needs to be removed for editable
|
||||
// blocks or highlightjs will capture events
|
||||
code_nodes
|
||||
.filter(function (node) {
|
||||
return node.classList.contains("editable");
|
||||
})
|
||||
.forEach(function (block) {
|
||||
block.classList.remove("language-rust");
|
||||
});
|
||||
|
||||
Array;
|
||||
code_nodes
|
||||
.filter(function (node) {
|
||||
return !node.classList.contains("editable");
|
||||
})
|
||||
.forEach(function (block) {
|
||||
hljs.highlightBlock(block);
|
||||
});
|
||||
} else {
|
||||
code_nodes.forEach(function (block) {
|
||||
hljs.highlightBlock(block);
|
||||
});
|
||||
}
|
||||
|
||||
// Adding the hljs class gives code blocks the color css
|
||||
// even if highlighting doesn't apply
|
||||
code_nodes.forEach(function (block) {
|
||||
block.classList.add("hljs");
|
||||
});
|
||||
|
||||
Array.from(document.querySelectorAll("code.language-rust")).forEach(function (
|
||||
block
|
||||
) {
|
||||
var lines = Array.from(block.querySelectorAll(".boring"));
|
||||
// If no lines were hidden, return
|
||||
if (!lines.length) {
|
||||
return;
|
||||
}
|
||||
block.classList.add("hide-boring");
|
||||
|
||||
var buttons = document.createElement("div");
|
||||
buttons.className = "buttons";
|
||||
buttons.innerHTML =
|
||||
'<button class="fa fa-eye" title="Show hidden lines" aria-label="Show hidden lines"></button>';
|
||||
|
||||
// add expand button
|
||||
var pre_block = block.parentNode;
|
||||
pre_block.insertBefore(buttons, pre_block.firstChild);
|
||||
|
||||
pre_block.querySelector(".buttons").addEventListener("click", function (e) {
|
||||
if (e.target.classList.contains("fa-eye")) {
|
||||
e.target.classList.remove("fa-eye");
|
||||
e.target.classList.add("fa-eye-slash");
|
||||
e.target.title = "Hide lines";
|
||||
e.target.setAttribute("aria-label", e.target.title);
|
||||
|
||||
block.classList.remove("hide-boring");
|
||||
} else if (e.target.classList.contains("fa-eye-slash")) {
|
||||
e.target.classList.remove("fa-eye-slash");
|
||||
e.target.classList.add("fa-eye");
|
||||
e.target.title = "Show hidden lines";
|
||||
e.target.setAttribute("aria-label", e.target.title);
|
||||
|
||||
block.classList.add("hide-boring");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (window.playground_copyable) {
|
||||
Array.from(document.querySelectorAll("pre code")).forEach(function (block) {
|
||||
var pre_block = block.parentNode;
|
||||
if (!pre_block.classList.contains("playground")) {
|
||||
var buttons = pre_block.querySelector(".buttons");
|
||||
if (!buttons) {
|
||||
buttons = document.createElement("div");
|
||||
buttons.className = "buttons";
|
||||
pre_block.insertBefore(buttons, pre_block.firstChild);
|
||||
}
|
||||
|
||||
var clipButton = document.createElement("button");
|
||||
clipButton.className = "fa fa-copy clip-button";
|
||||
clipButton.title = "Copy to clipboard";
|
||||
clipButton.setAttribute("aria-label", clipButton.title);
|
||||
clipButton.innerHTML = '<i class="tooltiptext"></i>';
|
||||
|
||||
buttons.insertBefore(clipButton, buttons.firstChild);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Process playground code blocks
|
||||
Array.from(document.querySelectorAll(".playground")).forEach(function (
|
||||
pre_block
|
||||
) {
|
||||
// Add play button
|
||||
var buttons = pre_block.querySelector(".buttons");
|
||||
if (!buttons) {
|
||||
buttons = document.createElement("div");
|
||||
buttons.className = "buttons";
|
||||
pre_block.insertBefore(buttons, pre_block.firstChild);
|
||||
}
|
||||
|
||||
var runCodeButton = document.createElement("button");
|
||||
runCodeButton.className = "fa fa-play play-button";
|
||||
runCodeButton.hidden = true;
|
||||
runCodeButton.title = "Run this code";
|
||||
runCodeButton.setAttribute("aria-label", runCodeButton.title);
|
||||
|
||||
buttons.insertBefore(runCodeButton, buttons.firstChild);
|
||||
runCodeButton.addEventListener("click", function (e) {
|
||||
run_rust_code(pre_block);
|
||||
});
|
||||
|
||||
if (window.playground_copyable) {
|
||||
var copyCodeClipboardButton = document.createElement("button");
|
||||
copyCodeClipboardButton.className = "fa fa-copy clip-button";
|
||||
copyCodeClipboardButton.innerHTML = '<i class="tooltiptext"></i>';
|
||||
copyCodeClipboardButton.title = "Copy to clipboard";
|
||||
copyCodeClipboardButton.setAttribute(
|
||||
"aria-label",
|
||||
copyCodeClipboardButton.title
|
||||
);
|
||||
|
||||
buttons.insertBefore(copyCodeClipboardButton, buttons.firstChild);
|
||||
}
|
||||
|
||||
let code_block = pre_block.querySelector("code");
|
||||
if (window.ace && code_block.classList.contains("editable")) {
|
||||
var undoChangesButton = document.createElement("button");
|
||||
undoChangesButton.className = "fa fa-history reset-button";
|
||||
undoChangesButton.title = "Undo changes";
|
||||
undoChangesButton.setAttribute("aria-label", undoChangesButton.title);
|
||||
|
||||
buttons.insertBefore(undoChangesButton, buttons.firstChild);
|
||||
|
||||
undoChangesButton.addEventListener("click", function () {
|
||||
let editor = window.ace.edit(code_block);
|
||||
editor.setValue(editor.originalCode);
|
||||
editor.clearSelection();
|
||||
});
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
// (function themes() {
|
||||
// var html = document.querySelector("html");
|
||||
// var themeToggleButton = document.getElementById("theme-toggle");
|
||||
// var themePopup = document.getElementById("theme-list");
|
||||
// var themeColorMetaTag = document.querySelector('meta[name="theme-color"]');
|
||||
// var stylesheets = {
|
||||
// ayuHighlight: document.querySelector("[href$='ayu-highlight.css']"),
|
||||
// tomorrowNight: document.querySelector("[href$='tomorrow-night.css']"),
|
||||
// highlight: document.querySelector("[href$='highlight.css']"),
|
||||
// };
|
||||
|
||||
// function showThemes() {
|
||||
// themePopup.style.display = "block";
|
||||
// themeToggleButton.setAttribute("aria-expanded", true);
|
||||
// themePopup.querySelector("button#" + get_theme()).focus();
|
||||
// }
|
||||
|
||||
// function hideThemes() {
|
||||
// themePopup.style.display = "none";
|
||||
// themeToggleButton.setAttribute("aria-expanded", false);
|
||||
// themeToggleButton.focus();
|
||||
// }
|
||||
|
||||
// function get_theme() {
|
||||
// var theme;
|
||||
// try {
|
||||
// theme = localStorage.getItem("mdbook-theme");
|
||||
// } catch (e) {}
|
||||
// if (theme === null || theme === undefined) {
|
||||
// return default_theme;
|
||||
// } else {
|
||||
// return theme;
|
||||
// }
|
||||
// }
|
||||
|
||||
// function set_theme(theme, store = true) {
|
||||
// let ace_theme;
|
||||
|
||||
// if (theme == "coal" || theme == "navy") {
|
||||
// stylesheets.ayuHighlight.disabled = true;
|
||||
// stylesheets.tomorrowNight.disabled = false;
|
||||
// stylesheets.highlight.disabled = true;
|
||||
|
||||
// ace_theme = "ace/theme/tomorrow_night";
|
||||
// } else if (theme == "ayu") {
|
||||
// stylesheets.ayuHighlight.disabled = false;
|
||||
// stylesheets.tomorrowNight.disabled = true;
|
||||
// stylesheets.highlight.disabled = true;
|
||||
// ace_theme = "ace/theme/tomorrow_night";
|
||||
// } else {
|
||||
// stylesheets.ayuHighlight.disabled = true;
|
||||
// stylesheets.tomorrowNight.disabled = true;
|
||||
// stylesheets.highlight.disabled = false;
|
||||
// ace_theme = "ace/theme/dawn";
|
||||
// }
|
||||
|
||||
// setTimeout(function () {
|
||||
// themeColorMetaTag.content = getComputedStyle(
|
||||
// document.body
|
||||
// ).backgroundColor;
|
||||
// }, 1);
|
||||
|
||||
// if (window.ace && window.editors) {
|
||||
// window.editors.forEach(function (editor) {
|
||||
// editor.setTheme(ace_theme);
|
||||
// });
|
||||
// }
|
||||
|
||||
// var previousTheme = get_theme();
|
||||
|
||||
// if (store) {
|
||||
// try {
|
||||
// localStorage.setItem("mdbook-theme", theme);
|
||||
// } catch (e) {}
|
||||
// }
|
||||
|
||||
// html.classList.remove(previousTheme);
|
||||
// html.classList.add(theme);
|
||||
// }
|
||||
|
||||
// // Set theme
|
||||
// var theme = get_theme();
|
||||
|
||||
// set_theme(theme, false);
|
||||
|
||||
// themeToggleButton.addEventListener("click", function () {
|
||||
// if (themePopup.style.display === "block") {
|
||||
// hideThemes();
|
||||
// } else {
|
||||
// showThemes();
|
||||
// }
|
||||
// });
|
||||
|
||||
// themePopup.addEventListener("click", function (e) {
|
||||
// var theme;
|
||||
// if (e.target.className === "theme") {
|
||||
// theme = e.target.id;
|
||||
// } else if (e.target.parentElement.className === "theme") {
|
||||
// theme = e.target.parentElement.id;
|
||||
// } else {
|
||||
// return;
|
||||
// }
|
||||
// set_theme(theme);
|
||||
// });
|
||||
|
||||
// themePopup.addEventListener("focusout", function (e) {
|
||||
// // e.relatedTarget is null in Safari and Firefox on macOS (see workaround below)
|
||||
// if (
|
||||
// !!e.relatedTarget &&
|
||||
// !themeToggleButton.contains(e.relatedTarget) &&
|
||||
// !themePopup.contains(e.relatedTarget)
|
||||
// ) {
|
||||
// hideThemes();
|
||||
// }
|
||||
// });
|
||||
|
||||
// // Should not be needed, but it works around an issue on macOS & iOS: https://github.com/rust-lang/mdBook/issues/628
|
||||
// document.addEventListener("click", function (e) {
|
||||
// if (
|
||||
// themePopup.style.display === "block" &&
|
||||
// !themeToggleButton.contains(e.target) &&
|
||||
// !themePopup.contains(e.target)
|
||||
// ) {
|
||||
// hideThemes();
|
||||
// }
|
||||
// });
|
||||
|
||||
// document.addEventListener("keydown", function (e) {
|
||||
// if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) {
|
||||
// return;
|
||||
// }
|
||||
// if (!themePopup.contains(e.target)) {
|
||||
// return;
|
||||
// }
|
||||
|
||||
// switch (e.key) {
|
||||
// case "Escape":
|
||||
// e.preventDefault();
|
||||
// hideThemes();
|
||||
// break;
|
||||
// case "ArrowUp":
|
||||
// e.preventDefault();
|
||||
// var li = document.activeElement.parentElement;
|
||||
// if (li && li.previousElementSibling) {
|
||||
// li.previousElementSibling.querySelector("button").focus();
|
||||
// }
|
||||
// break;
|
||||
// case "ArrowDown":
|
||||
// e.preventDefault();
|
||||
// var li = document.activeElement.parentElement;
|
||||
// if (li && li.nextElementSibling) {
|
||||
// li.nextElementSibling.querySelector("button").focus();
|
||||
// }
|
||||
// break;
|
||||
// case "Home":
|
||||
// e.preventDefault();
|
||||
// themePopup.querySelector("li:first-child button").focus();
|
||||
// break;
|
||||
// case "End":
|
||||
// e.preventDefault();
|
||||
// themePopup.querySelector("li:last-child button").focus();
|
||||
// break;
|
||||
// }
|
||||
// });
|
||||
// })();
|
||||
|
||||
(function sidebar() {
|
||||
var html = document.querySelector("html");
|
||||
var sidebar = document.getElementById("sidebar");
|
||||
var sidebarLinks = document.querySelectorAll("#sidebar a");
|
||||
var sidebarToggleButton = document.getElementById("sidebar-toggle");
|
||||
var sidebarResizeHandle = document.getElementById("sidebar-resize-handle");
|
||||
var firstContact = null;
|
||||
|
||||
function showSidebar() {
|
||||
html.classList.remove("sidebar-hidden");
|
||||
html.classList.add("sidebar-visible");
|
||||
Array.from(sidebarLinks).forEach(function (link) {
|
||||
link.setAttribute("tabIndex", 0);
|
||||
});
|
||||
sidebarToggleButton.setAttribute("aria-expanded", true);
|
||||
sidebar.setAttribute("aria-hidden", false);
|
||||
try {
|
||||
localStorage.setItem("mdbook-sidebar", "visible");
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
var sidebarAnchorToggles = document.querySelectorAll("#sidebar a.toggle");
|
||||
|
||||
function toggleSection(ev) {
|
||||
ev.currentTarget.parentElement.classList.toggle("expanded");
|
||||
}
|
||||
|
||||
Array.from(sidebarAnchorToggles).forEach(function (el) {
|
||||
el.addEventListener("click", toggleSection);
|
||||
});
|
||||
|
||||
function hideSidebar() {
|
||||
html.classList.remove("sidebar-visible");
|
||||
html.classList.add("sidebar-hidden");
|
||||
Array.from(sidebarLinks).forEach(function (link) {
|
||||
link.setAttribute("tabIndex", -1);
|
||||
});
|
||||
sidebarToggleButton.setAttribute("aria-expanded", false);
|
||||
sidebar.setAttribute("aria-hidden", true);
|
||||
try {
|
||||
localStorage.setItem("mdbook-sidebar", "hidden");
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
// Toggle sidebar
|
||||
sidebarToggleButton.addEventListener("click", function sidebarToggle() {
|
||||
if (html.classList.contains("sidebar-hidden")) {
|
||||
var current_width = parseInt(
|
||||
document.documentElement.style.getPropertyValue("--sidebar-width"),
|
||||
10
|
||||
);
|
||||
if (current_width < 150) {
|
||||
document.documentElement.style.setProperty("--sidebar-width", "150px");
|
||||
}
|
||||
showSidebar();
|
||||
} else if (html.classList.contains("sidebar-visible")) {
|
||||
hideSidebar();
|
||||
} else {
|
||||
if (getComputedStyle(sidebar)["transform"] === "none") {
|
||||
hideSidebar();
|
||||
} else {
|
||||
showSidebar();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
sidebarResizeHandle.addEventListener("mousedown", initResize, false);
|
||||
|
||||
function initResize(e) {
|
||||
window.addEventListener("mousemove", resize, false);
|
||||
window.addEventListener("mouseup", stopResize, false);
|
||||
html.classList.add("sidebar-resizing");
|
||||
}
|
||||
function resize(e) {
|
||||
var pos = e.clientX - sidebar.offsetLeft;
|
||||
if (pos < 20) {
|
||||
hideSidebar();
|
||||
} else {
|
||||
if (html.classList.contains("sidebar-hidden")) {
|
||||
showSidebar();
|
||||
}
|
||||
pos = Math.min(pos, window.innerWidth - 100);
|
||||
document.documentElement.style.setProperty("--sidebar-width", pos + "px");
|
||||
}
|
||||
}
|
||||
//on mouseup remove windows functions mousemove & mouseup
|
||||
function stopResize(e) {
|
||||
html.classList.remove("sidebar-resizing");
|
||||
window.removeEventListener("mousemove", resize, false);
|
||||
window.removeEventListener("mouseup", stopResize, false);
|
||||
}
|
||||
|
||||
document.addEventListener(
|
||||
"touchstart",
|
||||
function (e) {
|
||||
firstContact = {
|
||||
x: e.touches[0].clientX,
|
||||
time: Date.now(),
|
||||
};
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
|
||||
document.addEventListener(
|
||||
"touchmove",
|
||||
function (e) {
|
||||
if (!firstContact) return;
|
||||
|
||||
var curX = e.touches[0].clientX;
|
||||
var xDiff = curX - firstContact.x,
|
||||
tDiff = Date.now() - firstContact.time;
|
||||
|
||||
if (tDiff < 250 && Math.abs(xDiff) >= 150) {
|
||||
if (
|
||||
xDiff >= 0 &&
|
||||
firstContact.x < Math.min(document.body.clientWidth * 0.25, 300)
|
||||
)
|
||||
showSidebar();
|
||||
else if (xDiff < 0 && curX < 300) hideSidebar();
|
||||
|
||||
firstContact = null;
|
||||
}
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
|
||||
// Scroll sidebar to current active section
|
||||
var activeSection = document
|
||||
.getElementById("sidebar")
|
||||
.querySelector(".active");
|
||||
if (activeSection) {
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView
|
||||
activeSection.scrollIntoView({ block: "center" });
|
||||
}
|
||||
})();
|
||||
|
||||
(function chapterNavigation() {
|
||||
document.addEventListener("keydown", function (e) {
|
||||
if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) {
|
||||
return;
|
||||
}
|
||||
if (window.search && window.search.hasFocus()) {
|
||||
return;
|
||||
}
|
||||
|
||||
switch (e.key) {
|
||||
case "ArrowRight":
|
||||
e.preventDefault();
|
||||
var nextButton = document.querySelector(".nav-chapters.next");
|
||||
if (nextButton) {
|
||||
window.location.href = nextButton.href;
|
||||
}
|
||||
break;
|
||||
case "ArrowLeft":
|
||||
e.preventDefault();
|
||||
var previousButton = document.querySelector(".nav-chapters.previous");
|
||||
if (previousButton) {
|
||||
window.location.href = previousButton.href;
|
||||
}
|
||||
break;
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
||||
(function clipboard() {
|
||||
var clipButtons = document.querySelectorAll(".clip-button");
|
||||
|
||||
function hideTooltip(elem) {
|
||||
elem.firstChild.innerText = "";
|
||||
elem.className = "fa fa-copy clip-button";
|
||||
}
|
||||
|
||||
function showTooltip(elem, msg) {
|
||||
elem.firstChild.innerText = msg;
|
||||
elem.className = "fa fa-copy tooltipped";
|
||||
}
|
||||
|
||||
var clipboardSnippets = new ClipboardJS(".clip-button", {
|
||||
text: function (trigger) {
|
||||
hideTooltip(trigger);
|
||||
let playground = trigger.closest("pre");
|
||||
return playground_text(playground);
|
||||
},
|
||||
});
|
||||
|
||||
Array.from(clipButtons).forEach(function (clipButton) {
|
||||
clipButton.addEventListener("mouseout", function (e) {
|
||||
hideTooltip(e.currentTarget);
|
||||
});
|
||||
});
|
||||
|
||||
clipboardSnippets.on("success", function (e) {
|
||||
e.clearSelection();
|
||||
showTooltip(e.trigger, "Copied!");
|
||||
});
|
||||
|
||||
clipboardSnippets.on("error", function (e) {
|
||||
showTooltip(e.trigger, "Clipboard error!");
|
||||
});
|
||||
})();
|
||||
|
||||
(function scrollToTop() {
|
||||
var menuTitle = document.querySelector(".menu-title");
|
||||
|
||||
menuTitle.addEventListener("click", function () {
|
||||
document.scrollingElement.scrollTo({ top: 0, behavior: "smooth" });
|
||||
});
|
||||
})();
|
||||
|
||||
(function controllMenu() {
|
||||
var menu = document.getElementById("menu-bar");
|
||||
|
||||
(function controllPosition() {
|
||||
var scrollTop = document.scrollingElement.scrollTop;
|
||||
var prevScrollTop = scrollTop;
|
||||
var minMenuY = -menu.clientHeight - 50;
|
||||
// When the script loads, the page can be at any scroll (e.g. if you reforesh it).
|
||||
menu.style.top = scrollTop + "px";
|
||||
// Same as parseInt(menu.style.top.slice(0, -2), but faster
|
||||
var topCache = menu.style.top.slice(0, -2);
|
||||
menu.classList.remove("sticky");
|
||||
var stickyCache = false; // Same as menu.classList.contains('sticky'), but faster
|
||||
document.addEventListener(
|
||||
"scroll",
|
||||
function () {
|
||||
scrollTop = Math.max(document.scrollingElement.scrollTop, 0);
|
||||
// `null` means that it doesn't need to be updated
|
||||
var nextSticky = null;
|
||||
var nextTop = null;
|
||||
var scrollDown = scrollTop > prevScrollTop;
|
||||
var menuPosAbsoluteY = topCache - scrollTop;
|
||||
if (scrollDown) {
|
||||
nextSticky = false;
|
||||
if (menuPosAbsoluteY > 0) {
|
||||
nextTop = prevScrollTop;
|
||||
}
|
||||
} else {
|
||||
if (menuPosAbsoluteY > 0) {
|
||||
nextSticky = true;
|
||||
} else if (menuPosAbsoluteY < minMenuY) {
|
||||
nextTop = prevScrollTop + minMenuY;
|
||||
}
|
||||
}
|
||||
if (nextSticky === true && stickyCache === false) {
|
||||
menu.classList.add("sticky");
|
||||
stickyCache = true;
|
||||
} else if (nextSticky === false && stickyCache === true) {
|
||||
menu.classList.remove("sticky");
|
||||
stickyCache = false;
|
||||
}
|
||||
if (nextTop !== null) {
|
||||
menu.style.top = nextTop + "px";
|
||||
topCache = nextTop;
|
||||
}
|
||||
prevScrollTop = scrollTop;
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
})();
|
||||
(function controllBorder() {
|
||||
menu.classList.remove("bordered");
|
||||
document.addEventListener(
|
||||
"scroll",
|
||||
function () {
|
||||
if (menu.offsetTop === 0) {
|
||||
menu.classList.remove("bordered");
|
||||
} else {
|
||||
menu.classList.add("bordered");
|
||||
}
|
||||
},
|
||||
{ passive: true }
|
||||
);
|
||||
})();
|
||||
})();
|
||||
|
|
@ -0,0 +1,629 @@
|
|||
/* CSS for UI elements (a.k.a. chrome) */
|
||||
|
||||
@import 'variables.css';
|
||||
|
||||
::-webkit-scrollbar {
|
||||
background: var(--bg);
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--scrollbar);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
box-shadow: inset 0 0 10px rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
|
||||
html {
|
||||
scrollbar-color: var(--scrollbar) var(--bg);
|
||||
}
|
||||
|
||||
#searchresults a,
|
||||
.content a:link,
|
||||
a:visited,
|
||||
a>.hljs {
|
||||
color: var(--links);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
||||
#searchresults a:hover,
|
||||
.content a:hover {
|
||||
text-decoration: none;
|
||||
color: var(--sidebar-active);
|
||||
}
|
||||
|
||||
/* Menu Bar */
|
||||
|
||||
#menu-bar,
|
||||
#menu-bar-hover-placeholder {
|
||||
z-index: 101;
|
||||
margin: auto calc(0px - var(--page-padding));
|
||||
}
|
||||
|
||||
#menu-bar {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
background-color: var(--bg);
|
||||
border-bottom-color: var(--bg);
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
|
||||
#menu-bar.sticky,
|
||||
.js #menu-bar-hover-placeholder:hover+#menu-bar,
|
||||
.js #menu-bar:hover,
|
||||
.js.sidebar-visible #menu-bar {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
#menu-bar-hover-placeholder {
|
||||
position: sticky;
|
||||
position: -webkit-sticky;
|
||||
top: 0;
|
||||
height: var(--menu-bar-height);
|
||||
}
|
||||
|
||||
#menu-bar.bordered {
|
||||
border-bottom-color: var(--table-border-color);
|
||||
}
|
||||
|
||||
#menu-bar i,
|
||||
#menu-bar .icon-button {
|
||||
position: relative;
|
||||
padding: 0 8px;
|
||||
z-index: 10;
|
||||
line-height: var(--menu-bar-height);
|
||||
cursor: pointer;
|
||||
transition: color 0.5s;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 420px) {
|
||||
|
||||
#menu-bar i,
|
||||
#menu-bar .icon-button {
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-button {
|
||||
border: none;
|
||||
background: none;
|
||||
padding: 0;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.icon-button i {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.right-buttons {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.right-buttons a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.left-buttons {
|
||||
display: flex;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.no-js .left-buttons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-title {
|
||||
display: inline-block;
|
||||
font-weight: 200;
|
||||
font-size: 2.4rem;
|
||||
line-height: var(--menu-bar-height);
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
flex: 1;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.js .menu-title {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.menu-bar,
|
||||
.menu-bar:visited,
|
||||
.nav-chapters,
|
||||
.nav-chapters:visited,
|
||||
.mobile-nav-chapters,
|
||||
.mobile-nav-chapters:visited,
|
||||
.menu-bar .icon-button,
|
||||
.menu-bar a i {
|
||||
color: var(--icons);
|
||||
}
|
||||
|
||||
.menu-bar i:hover,
|
||||
.menu-bar .icon-button:hover,
|
||||
.nav-chapters:hover,
|
||||
.mobile-nav-chapters i:hover {
|
||||
color: var(--icons-hover);
|
||||
}
|
||||
|
||||
/* Nav Icons */
|
||||
|
||||
.nav-chapters {
|
||||
font-size: 2.5em;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: 0;
|
||||
max-width: 150px;
|
||||
min-width: 90px;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
transition: color 0.5s, background-color 0.5s;
|
||||
}
|
||||
|
||||
.nav-chapters:hover {
|
||||
text-decoration: none;
|
||||
background-color: var(--theme-hover);
|
||||
transition: background-color 0.15s, color 0.15s;
|
||||
}
|
||||
|
||||
.nav-wrapper {
|
||||
margin-top: 50px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mobile-nav-chapters {
|
||||
font-size: 2.5em;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
width: 90px;
|
||||
border-radius: 5px;
|
||||
background-color: var(--sidebar-bg);
|
||||
}
|
||||
|
||||
.previous {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.next {
|
||||
float: right;
|
||||
right: var(--page-padding);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1080px) {
|
||||
.nav-wide-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-wrapper {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1380px) {
|
||||
.sidebar-visible .nav-wide-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.sidebar-visible .nav-wrapper {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
|
||||
:not(pre)>.hljs {
|
||||
display: inline;
|
||||
padding: 0.1em 0.3em;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
:not(pre):not(a)>.hljs {
|
||||
color: var(--inline-code-color);
|
||||
overflow-x: initial;
|
||||
}
|
||||
|
||||
a:hover>.hljs {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
pre {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
pre>.buttons {
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
right: 0px;
|
||||
top: 2px;
|
||||
margin: 0px;
|
||||
padding: 2px 0px;
|
||||
|
||||
color: var(--sidebar-fg);
|
||||
cursor: pointer;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transition: visibility 0.1s linear, opacity 0.1s linear;
|
||||
}
|
||||
|
||||
pre:hover>.buttons {
|
||||
visibility: visible;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
pre>.buttons :hover {
|
||||
color: var(--sidebar-active);
|
||||
border-color: var(--icons-hover);
|
||||
background-color: var(--theme-hover);
|
||||
}
|
||||
|
||||
pre>.buttons i {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
pre>.buttons button {
|
||||
cursor: inherit;
|
||||
margin: 0px 5px;
|
||||
padding: 3px 5px;
|
||||
font-size: 14px;
|
||||
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-radius: 4px;
|
||||
border-color: var(--icons);
|
||||
background-color: var(--theme-popup-bg);
|
||||
transition: 100ms;
|
||||
transition-property: color, border-color, background-color;
|
||||
color: var(--icons);
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
pre>.buttons button {
|
||||
/* On mobile, make it easier to tap buttons. */
|
||||
padding: 0.3rem 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
pre>code {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
/* FIXME: ACE editors overlap their buttons because ACE does absolute
|
||||
positioning within the code block which breaks padding. The only solution I
|
||||
can think of is to move the padding to the outer pre tag (or insert a div
|
||||
wrapper), but that would require fixing a whole bunch of CSS rules.
|
||||
*/
|
||||
.hljs.ace_editor {
|
||||
padding: 0rem 0rem;
|
||||
}
|
||||
|
||||
pre>.result {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
|
||||
#searchresults a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
mark {
|
||||
border-radius: 2px;
|
||||
padding: 0 3px 1px 3px;
|
||||
margin: 0 -3px -1px -3px;
|
||||
background-color: var(--search-mark-bg);
|
||||
transition: background-color 300ms linear;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
mark.fade-out {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
cursor: auto;
|
||||
}
|
||||
|
||||
.searchbar-outer {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: var(--content-max-width);
|
||||
}
|
||||
|
||||
#searchbar {
|
||||
width: 100%;
|
||||
margin: 5px auto 0px auto;
|
||||
padding: 10px 16px;
|
||||
transition: box-shadow 300ms ease-in-out;
|
||||
border: 1px solid var(--searchbar-border-color);
|
||||
border-radius: 3px;
|
||||
background-color: var(--searchbar-bg);
|
||||
color: var(--searchbar-fg);
|
||||
outline: none;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
#searchbar:focus,
|
||||
#searchbar.active {
|
||||
box-shadow: 0 0 3px var(--searchbar-shadow-color);
|
||||
}
|
||||
|
||||
.searchresults-header {
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
padding: 18px 0 0 5px;
|
||||
color: var(--searchresults-header-fg);
|
||||
}
|
||||
|
||||
.searchresults-outer {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: var(--content-max-width);
|
||||
border-bottom: 1px dashed var(--searchresults-border-color);
|
||||
}
|
||||
|
||||
ul#searchresults {
|
||||
list-style: none;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
ul#searchresults li {
|
||||
margin: 10px 0px;
|
||||
padding: 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
ul#searchresults li.focus {
|
||||
background-color: var(--searchresults-li-bg);
|
||||
}
|
||||
|
||||
ul#searchresults span.teaser {
|
||||
display: block;
|
||||
clear: both;
|
||||
margin: 5px 0 0 20px;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
ul#searchresults span.teaser em {
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: var(--sidebar-width);
|
||||
font-size: 0.875em;
|
||||
box-sizing: border-box;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overscroll-behavior-y: contain;
|
||||
/* background-color: var(--sidebar-bg); */
|
||||
color: var(--sidebar-fg);
|
||||
|
||||
}
|
||||
|
||||
.sidebar-resizing {
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.js:not(.sidebar-resizing) .sidebar {
|
||||
transition: transform 0.3s;
|
||||
/* Animation: slide away */
|
||||
}
|
||||
|
||||
.sidebar code {
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.sidebar .sidebar-scrollbox {
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 10px 10px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: inline-block;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.logo svg {
|
||||
display: block;
|
||||
height: 35px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
.sidebar .sidebar-resize-handle {
|
||||
position: absolute;
|
||||
cursor: col-resize;
|
||||
width: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.js .sidebar .sidebar-resize-handle {
|
||||
cursor: col-resize;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
.sidebar-hidden .sidebar {
|
||||
transform: translateX(calc(0px - var(--sidebar-width)));
|
||||
}
|
||||
|
||||
.sidebar::-webkit-scrollbar {
|
||||
background: var(--sidebar-bg);
|
||||
|
||||
}
|
||||
|
||||
.sidebar::-webkit-scrollbar-thumb {
|
||||
background: var(--scrollbar);
|
||||
|
||||
}
|
||||
|
||||
.sidebar-visible .page-wrapper {
|
||||
transform: translateX(var(--sidebar-width));
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 620px) {
|
||||
.sidebar-visible .page-wrapper {
|
||||
transform: none;
|
||||
margin-left: var(--sidebar-width);
|
||||
}
|
||||
}
|
||||
|
||||
.chapter {
|
||||
list-style: none outside none;
|
||||
padding-left: 0;
|
||||
line-height: 2.2em;
|
||||
}
|
||||
|
||||
.chapter ol {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.chapter li {
|
||||
display: flex;
|
||||
color: var(--sidebar-non-existant);
|
||||
}
|
||||
|
||||
.chapter li a {
|
||||
display: block;
|
||||
padding: 0;
|
||||
text-decoration: none;
|
||||
color: var(--sidebar-fg);
|
||||
}
|
||||
|
||||
.chapter li a:hover {
|
||||
color: var(--sidebar-active);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.chapter li a.active {
|
||||
color: var(--sidebar-active);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.chapter li>a.toggle {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
padding: 0 10px;
|
||||
user-select: none;
|
||||
opacity: 0.68;
|
||||
}
|
||||
|
||||
.chapter li>a.toggle div {
|
||||
transition: transform 0.5s;
|
||||
}
|
||||
|
||||
/* collapse the section */
|
||||
.chapter li:not(.expanded)+li>ol {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.chapter li.chapter-item {
|
||||
line-height: 1.5em;
|
||||
margin-top: 0.6em;
|
||||
}
|
||||
|
||||
.chapter li.expanded>a.toggle div {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.spacer {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.chapter .spacer {
|
||||
background-color: rgba(2255, 255, 255, .5);
|
||||
}
|
||||
|
||||
@media (-moz-touch-enabled: 1),
|
||||
(pointer: coarse) {
|
||||
.chapter li a {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.section {
|
||||
list-style: none outside none;
|
||||
padding-left: 20px;
|
||||
line-height: 1.9em;
|
||||
}
|
||||
|
||||
/* Theme Menu Popup */
|
||||
|
||||
.theme-popup {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: var(--menu-bar-height);
|
||||
z-index: 1000;
|
||||
border-radius: 4px;
|
||||
font-size: 0.7em;
|
||||
color: var(--fg);
|
||||
background: var(--theme-popup-bg);
|
||||
border: 1px solid var(--theme-popup-border);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.theme-popup .default {
|
||||
color: var(--icons);
|
||||
}
|
||||
|
||||
.theme-popup .theme {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 2px 10px;
|
||||
line-height: 25px;
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
background: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.theme-popup .theme:hover {
|
||||
background-color: var(--theme-hover);
|
||||
}
|
||||
|
||||
.theme-popup .theme:hover:first-child,
|
||||
.theme-popup .theme:hover:last-child {
|
||||
border-top-left-radius: inherit;
|
||||
border-top-right-radius: inherit;
|
||||
}
|
||||
|
|
@ -0,0 +1,303 @@
|
|||
/* Base styles and content styles */
|
||||
|
||||
@import 'variables.css';
|
||||
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@300&family=IBM+Plex+Mono&family=IBM+Plex+Sans:wght@300;400;700&display=swap');
|
||||
|
||||
:root {
|
||||
/* Browser default font-size is 16px, this way 1 rem = 10px */
|
||||
font-size: 62.5%;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: "IBM Plex Sans", sans-serif;
|
||||
color: var(--fg);
|
||||
background-color: var(--bg);
|
||||
text-size-adjust: none;
|
||||
-webkit-text-size-adjust: none;
|
||||
background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTI2NyIgaGVpZ2h0PSIxNTUyIiB2aWV3Qm94PSIwIDAgMTI2NyAxNTUyIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8ZyBvcGFjaXR5PSIwLjgiPgo8cGF0aCBvcGFjaXR5PSIwLjI1IiBkPSJNNzg2LjUgMTU3MkMxMjIwLjMyIDE1NzIgMTU3MiAxMjIwLjMyIDE1NzIgNzg2LjVDMTU3MiAzNTIuNjggMTIyMC4zMiAxIDc4Ni41IDFDMzUyLjY4IDEgMSAzNTIuNjggMSA3ODYuNUMxIDEyMjAuMzIgMzUyLjY4IDE1NzIgNzg2LjUgMTU3MloiIHN0cm9rZT0idXJsKCNwYWludDBfbGluZWFyXzk0NDJfNDQ5MCkiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIvPgo8cGF0aCBvcGFjaXR5PSIwLjI1IiBkPSJNODQ0LjU4OSAxMzI0LjI1QzExOTAuOTcgMTMyNC4yNSAxNDcxLjc3IDEwNDMuNDUgMTQ3MS43NyA2OTcuMDYxQzE0NzEuNzcgMzUwLjY3NiAxMTkwLjk3IDY5Ljg3NTQgODQ0LjU4OSA2OS44NzU0QzQ5OC4yMDMgNjkuODc1NCAyMTcuNDAzIDM1MC42NzYgMjE3LjQwMyA2OTcuMDYxQzIxNy40MDMgMTA0My40NSA0OTguMjAzIDEzMjQuMjUgODQ0LjU4OSAxMzI0LjI1WiIgc3Ryb2tlPSJ1cmwoI3BhaW50MV9saW5lYXJfOTQ0Ml80NDkwKSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIi8+CjxwYXRoIG9wYWNpdHk9IjAuMjUiIGQ9Ik05MTAuMjc3IDEwODYuMjRDMTE2OS4yMyAxMDg2LjI0IDEzNzkuMTUgODc2LjMyMSAxMzc5LjE1IDYxNy4zN0MxMzc5LjE1IDM1OC40MTkgMTE2OS4yMyAxNDguNDk4IDkxMC4yNzcgMTQ4LjQ5OEM2NTEuMzI2IDE0OC40OTggNDQxLjQwNSAzNTguNDE5IDQ0MS40MDUgNjE3LjM3QzQ0MS40MDUgODc2LjMyMSA2NTEuMzI2IDEwODYuMjQgOTEwLjI3NyAxMDg2LjI0WiIgc3Ryb2tlPSJ1cmwoI3BhaW50Ml9saW5lYXJfOTQ0Ml80NDkwKSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIi8+CjxwYXRoIG9wYWNpdHk9IjAuMjUiIGQ9Ik05NjUuMzAzIDIzMC45NTJDNzc5Ljg4OCAyMjkuNDY5IDYyOC4zNzcgMzc4LjU3NSA2MjYuODk0IDU2My45OUM2MjUuNDEgNzQ5LjQwNSA3NzQuNTE2IDkwMC45MTYgOTU5LjkzMSA5MDIuMzk5QzExNDUuMzUgOTAzLjg4MiAxMjk2Ljg2IDc1NC43NzYgMTI5OC4zNCA1NjkuMzYxQzEyOTkuODIgMzgzLjk0NiAxMTUwLjcyIDIzMi40MzUgOTY1LjMwMyAyMzAuOTUyWiIgc3Ryb2tlPSJ1cmwoI3BhaW50M19saW5lYXJfOTQ0Ml80NDkwKSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIi8+CjwvZz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl85NDQyXzQ0OTAiIHgxPSIxMjIyLjk1IiB5MT0iNTIuMjc4OSIgeDI9IjY3NC42MTkiIHkyPSIxMTE1LjczIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IndoaXRlIi8+CjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0id2hpdGUiIHN0b3Atb3BhY2l0eT0iMCIvPgo8L2xpbmVhckdyYWRpZW50Pgo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MV9saW5lYXJfOTQ0Ml80NDkwIiB4MT0iMTIwNy4yMiIgeTE9IjE2NS41MzciIHgyPSI3ODAuMDkzIiB5Mj0iMTEzOS44NCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSJ3aGl0ZSIvPgo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IndoaXRlIiBzdG9wLW9wYWNpdHk9IjAiLz4KPC9saW5lYXJHcmFkaWVudD4KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDJfbGluZWFyXzk0NDJfNDQ5MCIgeDE9IjE0MzUuNjUiIHkxPSI0LjQ5NTkzIiB4Mj0iNzIwLjY1MyIgeTI9IjEwODYuMDIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4KPHN0b3Agc3RvcC1jb2xvcj0id2hpdGUiLz4KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSJ3aGl0ZSIgc3RvcC1vcGFjaXR5PSIwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQzX2xpbmVhcl85NDQyXzQ0OTAiIHgxPSIxMzA4LjYxIiB5MT0iNjguNTkzOCIgeDI9Ijc2MS40NDQiIHkyPSI5NjguMzA2IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CjxzdG9wIHN0b3AtY29sb3I9IndoaXRlIi8+CjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0id2hpdGUiIHN0b3Atb3BhY2l0eT0iMCIvPgo8L2xpbmVhckdyYWRpZW50Pgo8L2RlZnM+Cjwvc3ZnPgo=");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right top 60px;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-size: 1.6em;
|
||||
line-height: 1.71;
|
||||
font-weight: 300;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: "IBM Plex Mono", Consolas, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace, monospace !important;
|
||||
font-size: 0.875em;
|
||||
/* please adjust the ace font size accordingly in editor.js */
|
||||
}
|
||||
|
||||
/* make long words/inline code not x overflow */
|
||||
main {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
/* make wide tables scroll if they overflow */
|
||||
.table-wrapper {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
/* Don't change font size in headers. */
|
||||
h1 code,
|
||||
h2 code,
|
||||
h3 code,
|
||||
h4 code,
|
||||
h5 code,
|
||||
h6 code {
|
||||
font-size: unset;
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.boring {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.hide-boring .boring {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Chakra petch';
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
margin-top: 2.5em;
|
||||
font-family: 'Chakra petch';
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h4,
|
||||
h5 {
|
||||
margin-top: 2em;
|
||||
font-family: 'Chakra petch';
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.header+.header h3,
|
||||
.header+.header h4,
|
||||
.header+.header h5 {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
h1:target::before,
|
||||
h2:target::before,
|
||||
h3:target::before,
|
||||
h4:target::before,
|
||||
h5:target::before,
|
||||
h6:target::before {
|
||||
display: inline-block;
|
||||
content: "»";
|
||||
margin-left: -30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
/* This is broken on Safari as of version 14, but is fixed
|
||||
in Safari Technology Preview 117 which I think will be Safari 14.2.
|
||||
https://bugs.webkit.org/show_bug.cgi?id=218076
|
||||
*/
|
||||
:target {
|
||||
scroll-margin-top: calc(var(--menu-bar-height) + 0.5em);
|
||||
}
|
||||
|
||||
.page {
|
||||
outline: 0;
|
||||
padding: 0 var(--page-padding);
|
||||
margin-top: calc(0px - var(--menu-bar-height));
|
||||
/* Compensate for the #menu-bar-hover-placeholder */
|
||||
}
|
||||
|
||||
.page-wrapper {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.js:not(.sidebar-resizing) .page-wrapper {
|
||||
transition: margin-left 0.3s ease, transform 0.3s ease;
|
||||
/* Animation: slide away */
|
||||
}
|
||||
|
||||
.content {
|
||||
overflow-y: auto;
|
||||
padding: 0 5px 50px 5px;
|
||||
}
|
||||
|
||||
.content main {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: var(--content-max-width);
|
||||
}
|
||||
|
||||
.content p {
|
||||
line-height: 1.45em;
|
||||
}
|
||||
|
||||
.content ol {
|
||||
line-height: 1.45em;
|
||||
}
|
||||
|
||||
.content ul {
|
||||
line-height: 1.45em;
|
||||
}
|
||||
|
||||
.content a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.content a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.content img,
|
||||
.content video {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.content .header:link,
|
||||
.content .header:visited {
|
||||
color: var(--fg);
|
||||
}
|
||||
|
||||
.content .header:link,
|
||||
.content .header:visited:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.content .header:hover {
|
||||
text-decoration: none;
|
||||
color: var(--sidebar-active);
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 0 auto;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table td {
|
||||
padding: 3px 20px;
|
||||
border: 1px var(--table-border-color) solid;
|
||||
}
|
||||
|
||||
table thead {
|
||||
background: var(--table-header-bg);
|
||||
}
|
||||
|
||||
table thead td {
|
||||
font-weight: 700;
|
||||
border: none;
|
||||
}
|
||||
|
||||
table thead th {
|
||||
padding: 3px 20px;
|
||||
}
|
||||
|
||||
table thead tr {
|
||||
border: 1px var(--table-header-bg) solid;
|
||||
}
|
||||
|
||||
/* Alternate background colors for rows */
|
||||
table tbody tr:nth-child(2n) {
|
||||
background: var(--table-alternate-bg);
|
||||
}
|
||||
|
||||
|
||||
blockquote {
|
||||
margin: 20px 0;
|
||||
padding: 0 20px;
|
||||
color: var(--fg);
|
||||
background-color: var(--quote-bg);
|
||||
border-top: .1em solid var(--quote-border);
|
||||
border-bottom: .1em solid var(--quote-border);
|
||||
}
|
||||
|
||||
|
||||
:not(.footnote-definition)+.footnote-definition,
|
||||
.footnote-definition+ :not(.footnote-definition) {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.footnote-definition {
|
||||
font-size: 0.9em;
|
||||
margin: 0.5em 0;
|
||||
}
|
||||
|
||||
.footnote-definition p {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.tooltiptext {
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
color: #fff;
|
||||
background-color: #333;
|
||||
transform: translateX(-50%);
|
||||
/* Center by moving tooltip 50% of its width left */
|
||||
left: -8px;
|
||||
/* Half of the width of the icon */
|
||||
top: -35px;
|
||||
font-size: 0.8em;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
padding: 5px 8px;
|
||||
margin: 5px;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.tooltipped .tooltiptext {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.chapter>li.expanded:first-of-type,
|
||||
.chapter li.part-title {
|
||||
color: var(--sidebar-fg);
|
||||
margin: 5px 0px;
|
||||
padding-left: 0;
|
||||
font-weight: bold;
|
||||
font-family: 'Chakra Petch';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-size: 18.66px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.chapter ol {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.chapter>li.expanded {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.chapter .chapter-item {
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
font-weight: 300;
|
||||
|
||||
}
|
||||
|
||||
.chapter>li.chapter-item:empty {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.result-no-output {
|
||||
font-style: italic;
|
||||
}
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
#sidebar,
|
||||
#menu-bar,
|
||||
.nav-chapters,
|
||||
.mobile-nav-chapters {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#page-wrapper.page-wrapper {
|
||||
transform: none;
|
||||
margin-left: 0px;
|
||||
overflow-y: initial;
|
||||
}
|
||||
|
||||
#content {
|
||||
max-width: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.page {
|
||||
overflow-y: initial;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: #666666;
|
||||
border-radius: 5px;
|
||||
|
||||
/* Force background to be printed in Chrome */
|
||||
-webkit-print-color-adjust: exact;
|
||||
}
|
||||
|
||||
pre>.buttons {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited,
|
||||
a:active,
|
||||
a:hover {
|
||||
color: #4183c4;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
page-break-inside: avoid;
|
||||
page-break-after: avoid;
|
||||
color: #000;
|
||||
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
page-break-inside: avoid;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.fa {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,252 @@
|
|||
/* Globals */
|
||||
|
||||
:root {
|
||||
--sidebar-width: 300px;
|
||||
--page-padding: 15px;
|
||||
--content-max-width: 950px;
|
||||
--menu-bar-height: 50px;
|
||||
}
|
||||
|
||||
/* Themes */
|
||||
|
||||
.ayu {
|
||||
--bg: #000;
|
||||
--fg: #fff;
|
||||
|
||||
--sidebar-bg: #000;
|
||||
--sidebar-fg: #fff;
|
||||
--sidebar-non-existant: #5c6773;
|
||||
--sidebar-active: #d0a3f8;
|
||||
--sidebar-spacer: #2d334f;
|
||||
|
||||
--scrollbar: var(--sidebar-fg);
|
||||
|
||||
--icons: #fff;
|
||||
--icons-hover: rgba(255, 255, 255, .7);
|
||||
|
||||
--links: #fff;
|
||||
|
||||
--inline-code-color: #fff;
|
||||
|
||||
--theme-popup-bg: #14191f;
|
||||
--theme-popup-border: #5c6773;
|
||||
--theme-hover: #2e2e2e;
|
||||
|
||||
--quote-bg: hsl(226, 15%, 17%);
|
||||
--quote-border: hsl(226, 15%, 22%);
|
||||
|
||||
--table-border-color: hsl(210, 25%, 13%);
|
||||
--table-header-bg: hsl(210, 25%, 28%);
|
||||
--table-alternate-bg: hsl(210, 25%, 11%);
|
||||
|
||||
--searchbar-border-color: #848484;
|
||||
--searchbar-bg: #424242;
|
||||
--searchbar-fg: #fff;
|
||||
--searchbar-shadow-color: #d4c89f;
|
||||
--searchresults-header-fg: #666;
|
||||
--searchresults-border-color: #888;
|
||||
--searchresults-li-bg: #252932;
|
||||
--search-mark-bg: #e3b171;
|
||||
}
|
||||
|
||||
.coal {
|
||||
--bg: hsl(200, 7%, 8%);
|
||||
--fg: #98a3ad;
|
||||
|
||||
--sidebar-bg: #292c2f;
|
||||
--sidebar-fg: #a1adb8;
|
||||
--sidebar-non-existant: #505254;
|
||||
--sidebar-active: #3473ad;
|
||||
--sidebar-spacer: #393939;
|
||||
|
||||
--scrollbar: var(--sidebar-fg);
|
||||
|
||||
--icons: #43484d;
|
||||
--icons-hover: #b3c0cc;
|
||||
|
||||
--links: #2b79a2;
|
||||
|
||||
--inline-code-color: #c5c8c6;
|
||||
|
||||
--theme-popup-bg: #141617;
|
||||
--theme-popup-border: #43484d;
|
||||
--theme-hover: #1f2124;
|
||||
|
||||
--quote-bg: hsl(234, 21%, 18%);
|
||||
--quote-border: hsl(234, 21%, 23%);
|
||||
|
||||
--table-border-color: hsl(200, 7%, 13%);
|
||||
--table-header-bg: hsl(200, 7%, 28%);
|
||||
--table-alternate-bg: hsl(200, 7%, 11%);
|
||||
|
||||
--searchbar-border-color: #aaa;
|
||||
--searchbar-bg: #b7b7b7;
|
||||
--searchbar-fg: #000;
|
||||
--searchbar-shadow-color: #aaa;
|
||||
--searchresults-header-fg: #666;
|
||||
--searchresults-border-color: #98a3ad;
|
||||
--searchresults-li-bg: #2b2b2f;
|
||||
--search-mark-bg: #355c7d;
|
||||
}
|
||||
|
||||
.light {
|
||||
--bg: hsl(0, 0%, 100%);
|
||||
--fg: hsl(0, 0%, 0%);
|
||||
|
||||
--sidebar-bg: #fafafa;
|
||||
--sidebar-fg: hsl(0, 0%, 0%);
|
||||
--sidebar-non-existant: #aaaaaa;
|
||||
--sidebar-active: #1f1fff;
|
||||
--sidebar-spacer: #f4f4f4;
|
||||
|
||||
--scrollbar: #8F8F8F;
|
||||
|
||||
--icons: #747474;
|
||||
--icons-hover: #000000;
|
||||
|
||||
--links: #20609f;
|
||||
|
||||
--inline-code-color: #301900;
|
||||
|
||||
--theme-popup-bg: #fafafa;
|
||||
--theme-popup-border: #cccccc;
|
||||
--theme-hover: #e6e6e6;
|
||||
|
||||
--quote-bg: hsl(197, 37%, 96%);
|
||||
--quote-border: hsl(197, 37%, 91%);
|
||||
|
||||
--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;
|
||||
}
|
||||
|
||||
.navy {
|
||||
--bg: hsl(226, 23%, 11%);
|
||||
--fg: #bcbdd0;
|
||||
|
||||
--sidebar-bg: #282d3f;
|
||||
--sidebar-fg: #c8c9db;
|
||||
--sidebar-non-existant: #505274;
|
||||
--sidebar-active: #2b79a2;
|
||||
--sidebar-spacer: #2d334f;
|
||||
|
||||
--scrollbar: var(--sidebar-fg);
|
||||
|
||||
--icons: #737480;
|
||||
--icons-hover: #b7b9cc;
|
||||
|
||||
--links: #2b79a2;
|
||||
|
||||
--inline-code-color: #c5c8c6;
|
||||
|
||||
--theme-popup-bg: #161923;
|
||||
--theme-popup-border: #737480;
|
||||
--theme-hover: #282e40;
|
||||
|
||||
--quote-bg: hsl(226, 15%, 17%);
|
||||
--quote-border: hsl(226, 15%, 22%);
|
||||
|
||||
--table-border-color: hsl(226, 23%, 16%);
|
||||
--table-header-bg: hsl(226, 23%, 31%);
|
||||
--table-alternate-bg: hsl(226, 23%, 14%);
|
||||
|
||||
--searchbar-border-color: #aaa;
|
||||
--searchbar-bg: #aeaec6;
|
||||
--searchbar-fg: #000;
|
||||
--searchbar-shadow-color: #aaa;
|
||||
--searchresults-header-fg: #5f5f71;
|
||||
--searchresults-border-color: #5c5c68;
|
||||
--searchresults-li-bg: #242430;
|
||||
--search-mark-bg: #a2cff5;
|
||||
}
|
||||
|
||||
.rust {
|
||||
--bg: hsl(60, 9%, 87%);
|
||||
--fg: #262625;
|
||||
|
||||
--sidebar-bg: #3b2e2a;
|
||||
--sidebar-fg: #c8c9db;
|
||||
--sidebar-non-existant: #505254;
|
||||
--sidebar-active: #e69f67;
|
||||
--sidebar-spacer: #45373a;
|
||||
|
||||
--scrollbar: var(--sidebar-fg);
|
||||
|
||||
--icons: #737480;
|
||||
--icons-hover: #262625;
|
||||
|
||||
--links: #2b79a2;
|
||||
|
||||
--inline-code-color: #6e6b5e;
|
||||
|
||||
--theme-popup-bg: #e1e1db;
|
||||
--theme-popup-border: #b38f6b;
|
||||
--theme-hover: #99908a;
|
||||
|
||||
--quote-bg: hsl(60, 5%, 75%);
|
||||
--quote-border: hsl(60, 5%, 70%);
|
||||
|
||||
--table-border-color: hsl(60, 9%, 82%);
|
||||
--table-header-bg: #b3a497;
|
||||
--table-alternate-bg: hsl(60, 9%, 84%);
|
||||
|
||||
--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: #dec2a2;
|
||||
--search-mark-bg: #e69f67;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.light.no-js {
|
||||
--bg: hsl(200, 7%, 8%);
|
||||
--fg: #98a3ad;
|
||||
|
||||
--sidebar-bg: #292c2f;
|
||||
--sidebar-fg: #a1adb8;
|
||||
--sidebar-non-existant: #505254;
|
||||
--sidebar-active: #3473ad;
|
||||
--sidebar-spacer: #393939;
|
||||
|
||||
--scrollbar: var(--sidebar-fg);
|
||||
|
||||
--icons: #43484d;
|
||||
--icons-hover: #b3c0cc;
|
||||
|
||||
--links: #2b79a2;
|
||||
|
||||
--inline-code-color: #c5c8c6;
|
||||
|
||||
--theme-popup-bg: #141617;
|
||||
--theme-popup-border: #43484d;
|
||||
--theme-hover: #1f2124;
|
||||
|
||||
--quote-bg: hsl(234, 21%, 18%);
|
||||
--quote-border: hsl(234, 21%, 23%);
|
||||
|
||||
--table-border-color: hsl(200, 7%, 13%);
|
||||
--table-header-bg: hsl(200, 7%, 28%);
|
||||
--table-alternate-bg: hsl(200, 7%, 11%);
|
||||
|
||||
--searchbar-border-color: #aaa;
|
||||
--searchbar-bg: #b7b7b7;
|
||||
--searchbar-fg: #000;
|
||||
--searchbar-shadow-color: #aaa;
|
||||
--searchresults-header-fg: #666;
|
||||
--searchresults-border-color: #98a3ad;
|
||||
--searchresults-li-bg: #2b2b2f;
|
||||
--search-mark-bg: #355c7d;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
|
|
@ -0,0 +1,22 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 199.7 184.2">
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
svg { fill: white; }
|
||||
}
|
||||
</style>
|
||||
<path d="M189.5,36.8c0.2,2.8,0,5.1-0.6,6.8L153,162c-0.6,2.1-2,3.7-4.2,5c-2.2,1.2-4.4,1.9-6.7,1.9H31.4c-9.6,0-15.3-2.8-17.3-8.4
|
||||
c-0.8-2.2-0.8-3.9,0.1-5.2c0.9-1.2,2.4-1.8,4.6-1.8H123c7.4,0,12.6-1.4,15.4-4.1s5.7-8.9,8.6-18.4l32.9-108.6
|
||||
c1.8-5.9,1-11.1-2.2-15.6S169.9,0,164,0H72.7c-1,0-3.1,0.4-6.1,1.1l0.1-0.4C64.5,0.2,62.6,0,61,0.1s-3,0.5-4.3,1.4
|
||||
c-1.3,0.9-2.4,1.8-3.2,2.8S52,6.5,51.2,8.1c-0.8,1.6-1.4,3-1.9,4.3s-1.1,2.7-1.8,4.2c-0.7,1.5-1.3,2.7-2,3.7c-0.5,0.6-1.2,1.5-2,2.5
|
||||
s-1.6,2-2.2,2.8s-0.9,1.5-1.1,2.2c-0.2,0.7-0.1,1.8,0.2,3.2c0.3,1.4,0.4,2.4,0.4,3.1c-0.3,3-1.4,6.9-3.3,11.6
|
||||
c-1.9,4.7-3.6,8.1-5.1,10.1c-0.3,0.4-1.2,1.3-2.6,2.7c-1.4,1.4-2.3,2.6-2.6,3.7c-0.3,0.4-0.3,1.5-0.1,3.4c0.3,1.8,0.4,3.1,0.3,3.8
|
||||
c-0.3,2.7-1.3,6.3-3,10.8c-1.7,4.5-3.4,8.2-5,11c-0.2,0.5-0.9,1.4-2,2.8c-1.1,1.4-1.8,2.5-2,3.4c-0.2,0.6-0.1,1.8,0.1,3.4
|
||||
c0.2,1.6,0.2,2.8-0.1,3.6c-0.6,3-1.8,6.7-3.6,11c-1.8,4.3-3.6,7.9-5.4,11c-0.5,0.8-1.1,1.7-2,2.8c-0.8,1.1-1.5,2-2,2.8
|
||||
s-0.8,1.6-1,2.5c-0.1,0.5,0,1.3,0.4,2.3c0.3,1.1,0.4,1.9,0.4,2.6c-0.1,1.1-0.2,2.6-0.5,4.4c-0.2,1.8-0.4,2.9-0.4,3.2
|
||||
c-1.8,4.8-1.7,9.9,0.2,15.2c2.2,6.2,6.2,11.5,11.9,15.8c5.7,4.3,11.7,6.4,17.8,6.4h110.7c5.2,0,10.1-1.7,14.7-5.2s7.7-7.8,9.2-12.9
|
||||
l33-108.6c1.8-5.8,1-10.9-2.2-15.5C194.9,39.7,192.6,38,189.5,36.8z M59.6,122.8L73.8,80c0,0,7,0,10.8,0s28.8-1.7,25.4,17.5
|
||||
c-3.4,19.2-18.8,25.2-36.8,25.4S59.6,122.8,59.6,122.8z M78.6,116.8c4.7-0.1,18.9-2.9,22.1-17.1S89.2,86.3,89.2,86.3l-8.9,0
|
||||
l-10.2,30.5C70.2,116.9,74,116.9,78.6,116.8z M75.3,68.7L89,26.2h9.8l0.8,34l23.6-34h9.9l-13.6,42.5h-7.1l12.5-35.4l-24.5,35.4h-6.8
|
||||
l-0.8-35L82,68.7H75.3z"/>
|
||||
</svg>
|
||||
<!-- Original image Copyright Dave Gandy — CC BY 4.0 License -->
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
|
|
@ -0,0 +1,79 @@
|
|||
/*
|
||||
|
||||
An Old Hope – Star Wars Syntax (c) Gustavo Costa <gusbemacbe@gmail.com>
|
||||
Original theme - Ocean Dark Theme – by https://github.com/gavsiu
|
||||
Based on Jesse Leite's Atom syntax theme 'An Old Hope' – https://github.com/JesseLeite/an-old-hope-syntax-atom
|
||||
|
||||
*/
|
||||
|
||||
/* Death Star Comment */
|
||||
.hljs-comment,
|
||||
.hljs-quote {
|
||||
color: #B6B18B;
|
||||
}
|
||||
|
||||
/* Darth Vader */
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-tag,
|
||||
.hljs-name,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-regexp,
|
||||
.hljs-deletion {
|
||||
color: #EB3C54;
|
||||
}
|
||||
|
||||
/* Threepio */
|
||||
.hljs-number,
|
||||
.hljs-built_in,
|
||||
.hljs-builtin-name,
|
||||
.hljs-literal,
|
||||
.hljs-type,
|
||||
.hljs-params,
|
||||
.hljs-meta,
|
||||
.hljs-link {
|
||||
color: #E7CE56;
|
||||
}
|
||||
|
||||
/* Luke Skywalker */
|
||||
.hljs-attribute {
|
||||
color: #EE7C2B;
|
||||
}
|
||||
|
||||
/* Obi Wan Kenobi */
|
||||
.hljs-string,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-addition {
|
||||
color: #4FB4D7;
|
||||
}
|
||||
|
||||
/* Yoda */
|
||||
.hljs-title,
|
||||
.hljs-section {
|
||||
color: #78BB65;
|
||||
}
|
||||
|
||||
/* Mace Windu */
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag {
|
||||
color: #B45EA4;
|
||||
}
|
||||
|
||||
/* Millenium Falcon */
|
||||
.hljs {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
background: #1C1D21;
|
||||
color: #c0c5ce;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.hljs-emphasis {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue