docs: add dark mode to documentation

2023-10-03 13:03:40 +00:00 · 2020-04-20 20:23:45 +04:00
parent 7eff836a6d
commit c59854c4bb
5 changed files with 778 additions and 1 deletions
@@ -0,0 +1,622 @@
+/* links */
+
+a,
+a:visited {
+    color: #aaddff;
+}
+
+
+/* code directives */
+
+.method dt,
+.class dt,
+.data dt,
+.attribute dt,
+.function dt,
+.classmethod dt,
+.exception dt,
+.descclassname,
+.descname {
+    background-color: #2d2d2d !important;
+}
+
+.rst-content dl:not(.docutils) dt {
+    color: #aaddff;
+    background-color: #2d2d2d;
+    border-top: solid 3px #525252;
+    border-left: solid 3px #525252;
+}
+
+em.property {
+    color: #888888;
+}
+
+
+/* tables */
+
+.rst-content table.docutils thead {
+    color: #ddd;
+}
+
+.rst-content table.docutils td {
+    border: 0px;
+}
+
+.rst-content table.docutils:not(.field-list) tr:nth-child(2n-1) td {
+    background-color: #5a5a5a;
+}
+
+
+/* inlined code highlights */
+
+.xref,
+.py-meth,
+.rst-content a code {
+    color: #aaddff !important;
+    font-weight: normal !important;
+}
+
+.rst-content code {
+    color: #eee !important;
+    font-weight: normal !important;
+}
+
+code.literal {
+    background-color: #2d2d2d !important;
+    border: 1px solid #6d6d6d !important;
+}
+
+code.docutils.literal.notranslate {
+    color: #ddd;
+}
+
+
+/* notes, warnings, hints */
+
+.hint .admonition-title {
+    background: #2aa87c !important;
+}
+
+.warning .admonition-title {
+    background: #cc4444 !important;
+}
+
+.admonition-title {
+    background: #3a7ca8 !important;
+}
+
+.admonition,
+.note {
+    background-color: #2d2d2d !important;
+}
+
+
+/* table of contents */
+
+.wy-nav-content-wrap {
+    background-color: rgba(0, 0, 0, 0.6) !important;
+}
+
+.sidebar {
+    background-color: #191919 !important;
+}
+
+.sidebar-title {
+    background-color: #2b2b2b !important;
+}
+
+.wy-menu-vertical a {
+    color: #ddd;
+}
+
+.wy-menu-vertical code.docutils.literal.notranslate {
+    color: #404040;
+    background: none !important;
+    border: none !important;
+}
+
+.wy-nav-content {
+    background: #3c3c3c;
+    color: #dddddd;
+}
+
+.wy-menu-vertical li.on a,
+.wy-menu-vertical li.current>a {
+    background: #a3a3a3;
+    border-bottom: 0px !important;
+    border-top: 0px !important;
+}
+
+.wy-menu-vertical li.current {
+    background: #b3b3b3;
+}
+
+.toc-backref {
+    color: grey !important;
+}
+
+.highlight .hll {
+    background-color: #49483e
+}
+
+.highlight {
+    background: #222;
+    color: #f8f8f2
+}
+
+.highlight .c {
+    color: #888
+}
+
+
+/* Comment */
+
+.highlight .err {
+    color: #960050;
+    background-color: #1e0010
+}
+
+
+/* Error */
+
+.highlight .k {
+    color: #66d9ef
+}
+
+
+/* Keyword */
+
+.highlight .l {
+    color: #ae81ff
+}
+
+
+/* Literal */
+
+.highlight .n {
+    color: #f8f8f2
+}
+
+
+/* Name */
+
+.highlight .o {
+    color: #f92672
+}
+
+
+/* Operator */
+
+.highlight .p {
+    color: #f8f8f2
+}
+
+
+/* Punctuation */
+
+.highlight .ch {
+    color: #888
+}
+
+
+/* Comment.Hashbang */
+
+.highlight .cm {
+    color: #888
+}
+
+
+/* Comment.Multiline */
+
+.highlight .cp {
+    color: #888
+}
+
+
+/* Comment.Preproc */
+
+.highlight .cpf {
+    color: #888
+}
+
+
+/* Comment.PreprocFile */
+
+.highlight .c1 {
+    color: #888
+}
+
+
+/* Comment.Single */
+
+.highlight .cs {
+    color: #888
+}
+
+
+/* Comment.Special */
+
+.highlight .gd {
+    color: #f92672
+}
+
+
+/* Generic.Deleted */
+
+.highlight .ge {
+    font-style: italic
+}
+
+
+/* Generic.Emph */
+
+.highlight .gi {
+    color: #a6e22e
+}
+
+
+/* Generic.Inserted */
+
+.highlight .gs {
+    font-weight: bold
+}
+
+
+/* Generic.Strong */
+
+.highlight .gu {
+    color: #888
+}
+
+
+/* Generic.Subheading */
+
+.highlight .kc {
+    color: #66d9ef
+}
+
+
+/* Keyword.Constant */
+
+.highlight .kd {
+    color: #66d9ef
+}
+
+
+/* Keyword.Declaration */
+
+.highlight .kn {
+    color: #f92672
+}
+
+
+/* Keyword.Namespace */
+
+.highlight .kp {
+    color: #66d9ef
+}
+
+
+/* Keyword.Pseudo */
+
+.highlight .kr {
+    color: #66d9ef
+}
+
+
+/* Keyword.Reserved */
+
+.highlight .kt {
+    color: #66d9ef
+}
+
+
+/* Keyword.Type */
+
+.highlight .ld {
+    color: #e6db74
+}
+
+
+/* Literal.Date */
+
+.highlight .m {
+    color: #ae81ff
+}
+
+
+/* Literal.Number */
+
+.highlight .s {
+    color: #e6db74
+}
+
+
+/* Literal.String */
+
+.highlight .na {
+    color: #a6e22e
+}
+
+
+/* Name.Attribute */
+
+.highlight .nb {
+    color: #f8f8f2
+}
+
+
+/* Name.Builtin */
+
+.highlight .nc {
+    color: #a6e22e
+}
+
+
+/* Name.Class */
+
+.highlight .no {
+    color: #66d9ef
+}
+
+
+/* Name.Constant */
+
+.highlight .nd {
+    color: #a6e22e
+}
+
+
+/* Name.Decorator */
+
+.highlight .ni {
+    color: #f8f8f2
+}
+
+
+/* Name.Entity */
+
+.highlight .ne {
+    color: #a6e22e
+}
+
+
+/* Name.Exception */
+
+.highlight .nf {
+    color: #a6e22e
+}
+
+
+/* Name.Function */
+
+.highlight .nl {
+    color: #f8f8f2
+}
+
+
+/* Name.Label */
+
+.highlight .nn {
+    color: #f8f8f2
+}
+
+
+/* Name.Namespace */
+
+.highlight .nx {
+    color: #a6e22e
+}
+
+
+/* Name.Other */
+
+.highlight .py {
+    color: #f8f8f2
+}
+
+
+/* Name.Property */
+
+.highlight .nt {
+    color: #f92672
+}
+
+
+/* Name.Tag */
+
+.highlight .nv {
+    color: #f8f8f2
+}
+
+
+/* Name.Variable */
+
+.highlight .ow {
+    color: #f92672
+}
+
+
+/* Operator.Word */
+
+.highlight .w {
+    color: #f8f8f2
+}
+
+
+/* Text.Whitespace */
+
+.highlight .mb {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Bin */
+
+.highlight .mf {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Float */
+
+.highlight .mh {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Hex */
+
+.highlight .mi {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Integer */
+
+.highlight .mo {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Oct */
+
+.highlight .sa {
+    color: #e6db74
+}
+
+
+/* Literal.String.Affix */
+
+.highlight .sb {
+    color: #e6db74
+}
+
+
+/* Literal.String.Backtick */
+
+.highlight .sc {
+    color: #e6db74
+}
+
+
+/* Literal.String.Char */
+
+.highlight .dl {
+    color: #e6db74
+}
+
+
+/* Literal.String.Delimiter */
+
+.highlight .sd {
+    color: #e6db74
+}
+
+
+/* Literal.String.Doc */
+
+.highlight .s2 {
+    color: #e6db74
+}
+
+
+/* Literal.String.Double */
+
+.highlight .se {
+    color: #ae81ff
+}
+
+
+/* Literal.String.Escape */
+
+.highlight .sh {
+    color: #e6db74
+}
+
+
+/* Literal.String.Heredoc */
+
+.highlight .si {
+    color: #e6db74
+}
+
+
+/* Literal.String.Interpol */
+
+.highlight .sx {
+    color: #e6db74
+}
+
+
+/* Literal.String.Other */
+
+.highlight .sr {
+    color: #e6db74
+}
+
+
+/* Literal.String.Regex */
+
+.highlight .s1 {
+    color: #e6db74
+}
+
+
+/* Literal.String.Single */
+
+.highlight .ss {
+    color: #e6db74
+}
+
+
+/* Literal.String.Symbol */
+
+.highlight .bp {
+    color: #f8f8f2
+}
+
+
+/* Name.Builtin.Pseudo */
+
+.highlight .fm {
+    color: #a6e22e
+}
+
+
+/* Name.Function.Magic */
+
+.highlight .vc {
+    color: #f8f8f2
+}
+
+
+/* Name.Variable.Class */
+
+.highlight .vg {
+    color: #f8f8f2
+}
+
+
+/* Name.Variable.Global */
+
+.highlight .vi {
+    color: #f8f8f2
+}
+
+
+/* Name.Variable.Instance */
+
+.highlight .vm {
+    color: #f8f8f2
+}
+
+
+/* Name.Variable.Magic */
+
+.highlight .il {
+    color: #ae81ff
+}
+
+
+/* Literal.Number.Integer.Long */
@@ -0,0 +1,77 @@
+input[type=checkbox] {
+    visibility: hidden;
+    height: 0;
+    width: 0;
+    margin: 0;
+}
+
+.rst-versions .rst-current-version {
+    padding: 10px;
+    display: flex;
+    justify-content: space-between;
+}
+
+.rst-versions .rst-current-version .fa-book,
+.rst-versions .rst-current-version .fa-v,
+.rst-versions .rst-current-version .fa-caret-down {
+    height: 24px;
+    line-height: 24px;
+    vertical-align: middle;
+}
+
+.rst-versions .rst-current-version .fa-element {
+    width: 80px;
+    text-align: center;
+}
+
+.rst-versions .rst-current-version .fa-book {
+    text-align: left;
+}
+
+.rst-versions .rst-current-version .fa-v {
+    color: #27AE60;
+    text-align: right;
+}
+
+label {
+    margin: 0 auto;
+    display: inline-block;
+    justify-content: center;
+    align-items: right;
+    border-radius: 100px;
+    position: relative;
+    cursor: pointer;
+    text-indent: -9999px;
+    width: 50px;
+    height: 21px;
+    background: #000;
+}
+
+label:after {
+    border-radius: 50%;
+    position: absolute;
+    content: '';
+    background: #fff;
+    width: 15px;
+    height: 15px;
+    top: 3px;
+    left: 3px;
+    transition: ease-in-out 200ms;
+}
+
+input:checked+label {
+    background: #3a7ca8;
+}
+
+input:checked+label:after {
+    left: calc(100% - 5px);
+    transform: translateX(-100%);
+}
+
+html.transition,
+html.transition *,
+html.transition *:before,
+html.transition *:after {
+    transition: ease-in-out 200ms !important;
+    transition-delay: 0 !important;
+}
@@ -0,0 +1,38 @@
+document.addEventListener('DOMContentLoaded', function() {
+
+    function toggleCssMode(isDay) {
+        var mode = (isDay ? "Day" : "Night");
+        localStorage.setItem("css-mode", mode);
+
+        var daysheet = $('link[href="_static/pygments.css"]')[0].sheet;
+        daysheet.disabled = !isDay;
+
+        var nightsheet = $('link[href="_static/css/dark.css"]')[0];
+        if (!isDay && nightsheet === undefined) {
+            var element = document.createElement("link");
+            element.setAttribute("rel", "stylesheet");
+            element.setAttribute("type", "text/css");
+            element.setAttribute("href", "_static/css/dark.css");
+            document.getElementsByTagName("head")[0].appendChild(element);
+            return;
+        }
+        if (nightsheet !== undefined) {
+            nightsheet.sheet.disabled = isDay;
+        }
+    }
+
+    var initial = localStorage.getItem("css-mode") != "Night";
+    var checkbox = document.querySelector('input[name=mode]');
+
+    toggleCssMode(initial);
+    checkbox.checked = initial;
+
+    checkbox.addEventListener('change', function() {
+        document.documentElement.classList.add('transition');
+        window.setTimeout(() => {
+            document.documentElement.classList.remove('transition');
+        }, 1000)
+        toggleCssMode(this.checked);
+    })
+
+});