diff --git a/docs/javascript/fix-codeblock-console-copy-button.js b/docs/javascript/fix-codeblock-console-copy-button.js new file mode 100644 index 00000000..3e81c845 --- /dev/null +++ b/docs/javascript/fix-codeblock-console-copy-button.js @@ -0,0 +1,42 @@ +document.addEventListener("DOMContentLoaded", function() { + fixCopyOnlyUserSelectable(); +}); + +function fixCopyOnlyUserSelectable() { + buttonsToFix = document.querySelectorAll( + '.language-console button.md-clipboard'); + if (buttonsToFix.length) + console.log('Fixing copy-to-clipboard text of console code-blocks.'); + buttonsToFix.forEach((btn) => { + var content = extractUserSelectable(btn.dataset.clipboardTarget); + btn.dataset.clipboardText = content; + }); +} + +function extractUserSelectable(selector) { + var result = ''; + var element = document.querySelector(selector); + + // Attempt to remove the non-selectable sections based on style, + // but we haven't seen this work reliably... + element.childNodes.forEach((child) => { + if (child instanceof Element) { + var s=window.getComputedStyle(child); + if (s.getPropertyValue('user-select') == 'none' || + s.getPropertyValue('-webkit-user-select') == 'none' || + s.getPropertyValue('-ms-user-select') == 'none') + { + return; + } + } + result += child.textContent; + }); + + // ... so we fall back to simple but effective: + // remove "$ " and "# " prompt at start of lines in code + result = result.replace(/^[\s]?[\$#]\s+/gm, "") + + // remove empty lines + result = result.replace(/^\s*\n/gm, '') + return result; +} diff --git a/docs/style.css b/docs/style.css new file mode 100644 index 00000000..b05cd280 --- /dev/null +++ b/docs/style.css @@ -0,0 +1,7 @@ +/* prevent selection of prefix and output for console syntax */ +.language-console .gp, .language-console .go { + user-select: none; + -webkit-user-select: none; /* Chrome/Safari */ + -ms-user-select: none; /* IE10+ */ + color: !important pink; +} diff --git a/docs/tutorial/getting_started.md b/docs/tutorial/getting_started.md index 76420a84..c28f8ce3 100644 --- a/docs/tutorial/getting_started.md +++ b/docs/tutorial/getting_started.md @@ -19,14 +19,14 @@ If you have no idea what an MTA is then [this may be a good primer](https://en.w We recommend upgrading to a newer OS as soon as possible. - ``` + ```console $ sudo yum-config-manager --add-repo=\ https://openrepo.kumomta.com/files/kumomta-centos.repo $ sudo yum install kumomta-dev ``` === "Rocky" - ``` + ```console $ sudo dnf -y install dnf-plugins-core $ sudo dnf config-manager \ --add-repo \ @@ -35,7 +35,7 @@ If you have no idea what an MTA is then [this may be a good primer](https://en.w ``` === "Ubuntu 22.04 LTS" - ``` + ```console $ sudo apt install -y curl gnupg ca-certificates $ curl -fsSL https://openrepo.kumomta.com/kumomta-ubuntu-22/public.gpg | sudo gpg --yes --dearmor -o /usr/share/keyrings/kumomta.gpg $ curl -fsSL https://openrepo.kumomta.com/files/kumomta-ubuntu22.list | sudo tee /etc/apt/sources.list.d/kumomta.list > /dev/null @@ -44,7 +44,7 @@ If you have no idea what an MTA is then [this may be a good primer](https://en.w ``` === "Ubuntu 20.04 LTS" - ``` + ```console $ sudo apt install -y curl gnupg ca-certificates $ curl -fsSL https://openrepo.kumomta.com/kumomta-ubuntu-20/public.gpg | sudo gpg --yes --dearmor -o /usr/share/keyrings/kumomta.gpg $ curl -fsSL https://openrepo.kumomta.com/files/kumomta-ubuntu20.list | sudo tee /etc/apt/sources.list.d/kumomta.list > /dev/null diff --git a/mkdocs-base.yml b/mkdocs-base.yml index 7e433f99..2c1d94ce 100644 --- a/mkdocs-base.yml +++ b/mkdocs-base.yml @@ -28,6 +28,7 @@ theme: features: - content.action.edit - content.action.view + - content.code.copy - content.tabs.link - navigation.footer - navigation.indexes @@ -52,10 +53,21 @@ plugins: - "SUMMARY.md" - "book.toml" +extra_css: + - style.css +extra_javascript: + - javascript/fix-codeblock-console-copy-button.js + markdown_extensions: - admonition - pymdownx.details - def_list + - pymdownx.highlight: + anchor_linenums: true + line_spans: __span + pygments_lang_class: true + - pymdownx.inlinehilite + - pymdownx.snippets - pymdownx.tasklist: custom_checkbox: true - pymdownx.tabbed: