chore: More CSS tweaks

packages/css-theme/src/_components.scss

@@ -10,4 +10,5 @@
 @import 'components/linedrawing';
 @import 'components/modelgraph';
 @import 'components/search';
+@import 'components/prevnext';
 @import 'components/zoombox';

packages/css-theme/src/_elements.scss

@@ -7,3 +7,4 @@
 @import 'elements/button';
 @import 'elements/jargon';
 @import 'elements/mark';
+@import 'elements/defs';

packages/css-theme/src/_typography.scss

@@ -7,14 +7,6 @@ h6,
 button {
   @include title-font;
 }
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  color: $oc-gray-7;
-}
 h1 {
   font-size: 3.5rem;
   font-weight: 700;
@@ -56,6 +48,10 @@ h6 a.anchor {
   margin-left: -20px;
   margin-right: 4px;
 }
+h5 + p,
+h6 + p {
+  margin-top: -0.5rem;
+}
 .theme-wrapper.light {
   h1,
   h2,

packages/css-theme/src/components/_prevnext.scss

@@ -0,0 +1,10 @@
+div.prev-next {
+  margin: 4rem 0 0;
+  display: flex;
+  flex-direction: row;
+  align-content: center;
+  justify-content: space-between;
+  padding: 9px;
+  border-top: 1px solid $oc-gray-3;
+  color: transparent;
+}

packages/css-theme/src/elements/_defs.scss

@@ -0,0 +1,34 @@
+// Shadow dom
+g#notch {
+  circle.note {
+    stroke: $oc-violet-5;
+    fill: none;
+  }
+  circle.fill-note {
+    fill: $oc-violet-5;
+    stroke: none;
+  }
+}
+g#bnotch {
+  path,
+  circle {
+    stroke: $oc-violet-5;
+    fill: none;
+  }
+}
+g#button {
+  circle.btn {
+    stroke: $oc-violet-5;
+    fill: none;
+  }
+  circle.hole {
+    fill: $oc-violet-5;
+    stroke: none;
+  }
+}
+g#buttonhole {
+  path {
+    stroke: $oc-violet-5;
+    fill: none;
+  }
+}