Improve docs theme (#717)

* Revert "Revert "New getting started guide (#715)""

This reverts commit dc4ba25b01254ed1c2088c081e8c861172ae58a4.

* style: update docs theme

* style: implement feedback

* feat: remove FOUC

* Update docs/src/pages/404.astro

Co-authored-by: Caleb Jasik <calebjasik@jasik.xyz>

* Fix 404 title prop

* chore: implement feedback

* fix: ul, ol styles

* fix: center logo on mobile

* fix: improve navbar header contrast

* fix: improve logo overlap

* fix: `.nav-link` radius

* fix: small mobile tweaks

* feat: improve nav styles

* feat: improve embed styles

* fix: feedback items

* fix: make header sticky on mobile

Co-authored-by: Caleb Jasik <calebjasik@jasik.xyz>

1 files changed, 37 insertions, 0 deletions

diff --git a/docs/public/nav.js b/docs/public/nav.js
new file mode 100644
index 000000000..93fadcd61
--- /dev/null
+++ b/docs/public/nav.js
@@ -0,0 +1,37 @@
+const nav = document.querySelector('body > header');
+
+if (!window.matchMedia('(prefers-reduced-motion)').matches) {
+  window.addEventListener('scroll', onScroll, { passive: true });
+}
+
+let prev = -1;
+let prevDir = 0;
+let threshold = 32;
+
+function onScroll() {
+  const curr = window.scrollY;
+  const dir = curr > prev ? 1 : -1;
+  
+  if (curr < threshold) {
+    show();
+    document.documentElement.classList.add('initial');
+  } else if (dir !== prevDir) {
+    if (dir === 1) {
+      hide();
+    } else {
+      show();
+    }
+  }
+  
+  prev = curr;
+}
+
+const hide = () => {
+  nav.classList.add('hidden')
+  document.documentElement.classList.add('scrolled');
+  document.documentElement.classList.remove('initial');
+};
+const show = () => {
+  nav.classList.remove('hidden');
+  document.documentElement.classList.remove('scrolled');
+}