1 files changed, 66 insertions, 0 deletions
diff --git a/src/lib/component/Promo.svelte b/src/lib/component/Promo.svelte
new file mode 100644
index 0000000..54f57bd
--- /dev/null
+++ b/src/lib/component/Promo.svelte
@@ -0,0 +1,66 @@
+<script lang="ts"></script>
+
+<style lang="scss">
+  h2 {
+    margin: 0 0 calc(var(--padding)* 2); padding: var(--padding) calc(var(--padding) * 2);
+
+    background-color: var(--color-border);
+    color: var(--uchu-yin-7);
+    font-size: 1rem;
+    line-height: inherit;
+    position: sticky;
+    top: 0;
+    z-index: 1;
+  }
+
+  ul {
+    line-height: 1;
+    margin-left: calc(var(--list-indentation) / 2);
+    padding: 0 var(--list-indentation) 0.25rem 0;
+
+    li {
+      margin: 0; padding: 0 0 var(--baseline) calc(var(--baseline) * 2);
+      position: relative;
+
+      &::before,
+      &::after {
+        background-color: var(--color-border);
+        content: "";
+        left: 0;
+        position: absolute;
+      }
+
+      &::before {
+        width: calc(var(--list-indentation) / 2); height: 1px;
+        top: calc(var(--list-indentation) / 4);
+      }
+
+      &::after {
+        width: 1px; height: var(--list-indentation);
+        top: calc(var(--list-indentation) * -0.75);
+      }
+    }
+
+    a {
+      text-decoration: underline var(--uchu-yin-2);
+
+      span {
+        padding-left: 0.2rem;
+        position: relative;
+        text-decoration: underline var(--uchu-gray-2);
+      }
+    }
+  }
+</style>
+
+<h2>promo.webb.page</h2>
+
+<ul>
+  <li>
+    <a href="https://www.eyebuydirect.com/referral/5217807">EyeBuyDirect<span> (prescription eyewear)</span></a>
+  </li>
+
+  <li>
+    <a href="https://lnk.rise-ai.com/68SlyIVHzDVybhw">Moment<span> (iPhone photography/videography tools)</span></a>
+  </li>
+</ul>