[RM] delete tachyons

1 files changed, 214 insertions, 0 deletions

diff --git a/assets/css/input.css b/assets/css/input.css
new file mode 100644
index 0000000..6243110
--- /dev/null
+++ b/assets/css/input.css
@@ -0,0 +1,214 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.baskerville {
+  font-family: baskerville, serif;
+}
+
+blockquote::before {
+  font-family: "Font Awesome 6 Free";
+  color: #79c753;
+  content: "\f10d";
+  font-weight: 900;
+  font-size: 2rem;
+  position: absolute;
+  left: 10px;
+  top: -15px;
+}
+
+@layer base {
+  blockquote {
+    @apply border-l-4 p-6 py-1 m-8 relative border-lime-500 baskerville;
+  }
+  blockquote p:last-of-type {
+    @apply text-center uppercase mt-4 tracking-wide;
+  }
+  h1 {
+    @apply text-5xl font-bold my-4;
+  }
+  h2 {
+    @apply text-4xl font-bold my-4;
+  }
+  h3 {
+    @apply text-3xl font-bold my-4;
+  }
+  h4 {
+    @apply text-2xl font-bold my-4;
+  }
+  h5 {
+    @apply text-xl font-bold my-4;
+  }
+  h6 {
+    @apply text-lg font-bold my-4;
+  }
+}
+
+@layer components {
+  #hero {
+    text-shadow: 2px 2px 3px black;
+  }
+  .main-content {
+    p {
+      @apply my-4 text-xl;
+      code {
+        @apply text-blue-500 px-1;
+      }
+    }
+  }
+  .main-content a {
+    @apply px-1 text-lime-500;
+  }
+  .main-content a[href^="http"]::after {
+    content: "";
+    width: 11px;
+    height: 11px;
+    margin-left: 4px;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    display: inline-block;
+  }
+  .main-content {
+    dl {
+      @apply px-8 text-xl;
+    }
+    dt {
+      @apply font-bold;
+    }
+    dd {
+      @apply ml-8;
+    }
+    .highlight {
+      .chroma {
+        @apply p-1 overflow-x-scroll;
+      }
+    }
+  }
+  .cv-entry,
+  .cv-honor {
+    @apply ml-4 pl-8 pb-2 relative;
+    .cv-role {
+      @apply m-0;
+    }
+    .cv-host,
+    .cv-date,
+    .cv-location {
+      @apply font-light m-0 p-0;
+    }
+    .cv-host::before {
+      font-family: "Font Awesome 6 Free";
+      content: "\f1ad";
+      font-weight: 900;
+      margin: 0 0.5rem;
+    }
+    .cv-location::before {
+      font-family: "Font Awesome 6 Free";
+      content: "\f041";
+      font-weight: 900;
+      margin: 0 0.5rem;
+    }
+    p {
+      @apply text-base my-2;
+    }
+    ul {
+      all: revert;
+    }
+  }
+  .cv-entry {
+    @apply border-l border-gray-400;
+    .cv-role::before {
+      content: "";
+      position: absolute;
+      width: 2rem;
+      height: 2rem;
+      background-color: #79c753;
+      border-radius: 50%;
+      transform: translateX(-50%);
+      left: 0;
+    }
+    .cv-date,
+    .cv-location {
+      @apply inline-block;
+    }
+    .cv-date::before {
+      font-family: "Font Awesome 6 Free";
+      content: "\f133";
+      font-weight: 900;
+      margin: 0 0.5rem;
+    }
+  }
+
+  .cv-honor {
+    .cv-role {
+      @apply ml-12 text-xl;
+    }
+    .cv-date {
+      top: 0.05rem;
+      @apply absolute left-0 text-xl;
+    }
+    .cv-date::before {
+      font-family: "Font Awesome 6 Free";
+      color: #ffb700;
+      content: "\f559";
+      font-weight: 900;
+      margin: 0 0.5rem;
+    }
+  }
+  .comment {
+    @apply my-2 pl-4 border-l border-lime-500 relative;
+    h3,
+    h4,
+    h5,
+    h6 {
+      @apply my-0 pl-2;
+      &::before {
+        font-family: "Font Awesome 6 Free";
+        color: #79c753;
+        content: "\f075";
+        font-weight: 900;
+        font-size: 2rem;
+        position: absolute;
+        left: -0.75rem;
+        top: -1rem;
+        transform: scaleX(-1);
+      }
+    }
+  }
+
+  /* https://lubna.dev/articles/create-css-only-image-gallery/ */
+  .gallery {
+    --max-img-width: 72rem;
+    --max-img-height: 48rem;
+    max-width: var(--max-img-width);
+    padding-top: min(66%, var(--max-img-height));
+
+    input:checked + img {
+      opacity: 1;
+    }
+    input:checked ~ label > img {
+      @apply shadow-md shadow-lime-500;
+    }
+  }
+}
+
+@layer utilities {
+  @font-face {
+    font-family: "BerkshireSwash-Regular";
+    font-display: optional;
+    src:
+      url("/css/fonts/BerkshireSwash-Regular.ttf.woff") format("woff"),
+      url("/css/fonts/BerkshireSwash-Regular.ttf.svg#BerkshireSwash-Regular")
+        format("svg"),
+      url("/css/fonts/BerkshireSwash-Regular.ttf.eot"),
+      url("/css/fonts/BerkshireSwash-Regular.ttf.eot?#iefix")
+        format("embedded-opentype");
+    font-weight: normal;
+    font-style: normal;
+  }
+
+  .berkshire-swash {
+    font-family: "BerkshireSwash-Regular";
+  }
+}