global: snapshot

website/styles/nav.css

@@ -0,0 +1,69 @@
+nav {
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  user-select: none;
+  -webkit-user-select: none;
+
+  ul {
+    list-style: none;
+    padding: 0;
+  }
+
+  > ul > li {
+    text-transform: uppercase;
+
+    & + * {
+      margin-top: 1.25rem;
+    }
+
+    > details,
+    > label {
+      ul {
+        margin-left: 0.25rem;
+      }
+    }
+
+    a,
+    summary {
+      padding: 0.25rem 0;
+    }
+
+    ul {
+      color: var(--off-color);
+      overflow: hidden;
+
+      li {
+        text-transform: lowercase;
+        display: block;
+        position: relative;
+        padding-left: 0.75rem;
+        border-left: 1px;
+      }
+    }
+  }
+
+  li[data-highlight] {
+    > details > summary,
+    > a {
+      text-transform: uppercase;
+      color: var(--color);
+    }
+
+    > details > summary > small {
+      opacity: 1;
+    }
+
+    > a::after,
+    > details:not([open]) > summary::after {
+      color: var(--orange) !important;
+      content: "";
+      background-color: var(--orange);
+      width: 0.375rem;
+      height: 0.375rem;
+      border-radius: 9999px;
+      display: inline-block;
+      margin-bottom: 0.125rem;
+      margin-left: 0.375rem;
+    }
+  }
+}