conflict fixes

docs/_static/codeblocks.css

@@ -112,6 +112,7 @@
 :root[data-theme="dark"] .highlight .ni { color: #d0d0d0; } /* Name.Entity */
 :root[data-theme="dark"] .highlight .ne { color: #bbbbbb; } /* Name.Exception */
 :root[data-theme="dark"] .highlight .nf { color: #6494d8; } /* Name.Function */
+:root[data-theme="dark"] .highlight .fm { color: #6494d8; } /* Name.Function.Magic */
 :root[data-theme="dark"] .highlight .nl { color: #d0d0d0; } /* Name.Label */
 :root[data-theme="dark"] .highlight .nn { color: #6494d8;} /* Name.Namespace */
 :root[data-theme="dark"] .highlight .nx { color: #d0d0d0; } /* Name.Other */

docs/_static/custom.js

@@ -5,6 +5,7 @@ let bottomHeightThreshold, sections;
 let hamburgerToggle;
 let mobileSearch;
 let sidebar;
+let toTop;
 
 class Modal {
   constructor(element) {
@@ -49,12 +50,19 @@ class SearchBar {
 
 }
 
+function scrollToTop() {
+  window.scrollTo({ top: 0, behavior: 'smooth' });
+}
+
 document.addEventListener('DOMContentLoaded', () => {
   mobileSearch = new SearchBar();
 
   bottomHeightThreshold = document.documentElement.scrollHeight - 30;
   sections = document.querySelectorAll('section');
   hamburgerToggle = document.getElementById('hamburger-toggle');
+  
+  toTop = document.getElementById('to-top');
+  toTop.hidden = !(window.scrollY > 0);
 
   if (hamburgerToggle) {
     hamburgerToggle.addEventListener('click', (e) => {
@@ -76,6 +84,16 @@ document.addEventListener('DOMContentLoaded', () => {
     // insert ourselves after the element
     parent.insertBefore(table, element.nextSibling);
   });
+
+  window.addEventListener('scroll', () => {
+    toTop.hidden = !(window.scrollY > 0);
+  });
+});
+
+document.addEventListener('keydown', (event) => {
+  if (event.code == "Escape" && activeModal) {
+    activeModal.close();
+  }
 });
 
 document.addEventListener('keydown', (event) => {

docs/_static/settings.js

@@ -94,10 +94,13 @@ function updateSetting(element) {
   }
 }
 
+for (const setting of settings) {
+  setting.load();
+}
+
 document.addEventListener('DOMContentLoaded', () => {
   settingsModal = new Modal(document.querySelector('div#settings.modal'));
   for (const setting of settings) {
-    setting.load();
     setting.setElement();
   }
 });

docs/_static/style.css

@@ -19,6 +19,7 @@ Historically however, thanks to:
 /* CSS variables would go here */
 :root {
   --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  --monospace-font-family: 'Consolas', 'Menlo', 'Deja Vu Sans Mono', 'Bitstream Vera Sans Mono', monospace;
 
   /* palette goes here */
   --white: #ffffff;
@@ -96,6 +97,8 @@ Historically however, thanks to:
   --rtd-ad-background: var(--grey-2);
   --rtd-ad-main-text: var(--grey-6);
   --rtd-ad-small-text: var(--grey-4);
+  --rtd-version-background: #272525;
+  --rtd-version-main-text: #fcfcfc;
   --attribute-table-title: var(--grey-6);
   --attribute-table-entry-border: var(--grey-3);
   --attribute-table-entry-text: var(--grey-5);
@@ -103,6 +106,7 @@ Historically however, thanks to:
   --attribute-table-entry-hover-background: var(--grey-2);
   --attribute-table-entry-hover-text: var(--blue-2);
   --attribute-table-badge: var(--grey-7);
+  --highlighted-text: rgb(252, 233, 103);
 }
 
 :root[data-font="serif"] {
@@ -162,6 +166,7 @@ Historically however, thanks to:
   --attribute-table-entry-hover-background: var(--grey-6);
   --attribute-table-entry-hover-text: var(--blue-1);
   --attribute-table-badge: var(--grey-4);
+  --highlighted-text: rgba(250, 166, 26, 0.2);
 }
 
 img[src$="snake_dark.svg"]  {
@@ -247,6 +252,7 @@ header > nav {
   display: flex;
   flex-direction: row;
   justify-content: flex-end;
+  align-items: center;
 }
 
 header > nav a {
@@ -265,6 +271,12 @@ header > nav.mobile-only {
 
 header > nav.mobile-only .search {
   width: 100%;
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: -1;
+  padding-top: 0;
+  transition: top 0.5s ease-in-out;
 }
 
 header > nav.mobile-only .search-wrapper {
@@ -316,6 +328,11 @@ header > nav > a:hover {
 
   cursor: pointer;
 }
+
+.sub-header option {
+    color: black;
+}
+
 .sub-header > select:focus {
   outline: none;
 }
@@ -380,12 +397,12 @@ aside h3 {
   position: relative;
   line-height: 0.5em;
   transition: transform 0.4s;
-  transform: rotate(0deg);
+  transform: rotate(-90deg);
 }
 
 .expanded {
   transition: transform 0.4s;
-  transform: rotate(-90deg);
+  transform: rotate(0deg);
 }
 
 .ref-internal-padding {
@@ -567,6 +584,37 @@ div.modal input {
   cursor: pointer;
 }
 
+/* scroll to top button */
+
+#to-top {
+  position: fixed;
+  bottom: 50px;
+  right: 20px;
+
+  cursor: pointer;
+}
+
+#to-top.is-rtd {
+  bottom: 90px;
+}
+
+#to-top > span {
+  display: block;
+
+  width: auto;
+  height: 30px;
+  padding: 0 6px;
+
+  background-color: var(--rtd-version-background);
+  color: var(--rtd-version-main-text);
+}
+
+#to-top span {
+  line-height: 30px;
+  font-size: 90%;
+  text-align: center;
+}
+
 /* copy button */
 
 .relative-copy {
@@ -855,7 +903,7 @@ dl.field-list {
 /* internal references are forced to bold for some reason */
 a.reference.internal > strong {
   font-weight: unset;
-  font-family: monospace;
+  font-family: var(--monospace-font-family);
 }
 
 /* exception hierarchy */
@@ -950,7 +998,7 @@ pre {
 }
 
 pre, code {
-  font-family: 'Consolas', 'Menlo', 'Deja Vu Sans Mono', 'Bitstream Vera Sans Mono', monospace;
+  font-family: var(--monospace-font-family);
   font-size: 0.9em;
   overflow-wrap: break-word;
 }
@@ -1007,6 +1055,13 @@ dd {
   margin-left: 1.5em;
 }
 
+dt:target, span.highlighted {
+    background-color: var(--highlighted-text);
+}
+
+rect.highlighted {
+    fill: var(--highlighted-text);
+}
 
 .container.operations {
   padding: 10px;