IBM VGA fonts, major changes to typography, update site-search.

1 files changed, 26 insertions, 14 deletions

diff --git a/assets/css/main.css b/assets/css/main.css
index 1b4341b..0500000 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1,6 +1,13 @@
+@font-face {
+  font-family: 'Nouveau IBM Stretch';
+  src: url('/assets/fonts/Nouveau_IBM_Stretch.ttf') format('truetype');
+}
+
 :root {
   --main-bg-color: #202020;
   --main-fg-color: #00B140;
+  --font-family: 'Nouveau IBM Stretch', 'Roboto Mono', monospace;
+  --text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color);
 }
 
 *,
@@ -16,21 +23,21 @@ body {
   text-decoration-skip: ink;
   color: var(--main-fg-color);
   padding-top: 10px;
-  font-family: 'Roboto Mono', monospace;
+  font-family: var(--font-family);
   background-color: var(--main-bg-color);
   background-size: 2px 2px;
-  text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color);
+  /* text-shadow: var(--text-shadow); */
 }
 
 ::selection {
-    color: var(--main-bg-color);
-    background: var(--main-fg-color);
-    text-shadow: 0 0 1px var(--main-bg-color), 0 0 6px var(--main-bg-color);
+  color: var(--main-bg-color);
+  background: var(--main-fg-color);
+  /* text-shadow: var(--text-shadow); */
 }
 ::-moz-selection {
-    color: var(--main-bg-color);
-    background: var(--main-fg-color);
-    text-shadow: 0 0 1px var(--main-bg-color), 0 0 6px var(--main-bg-color);
+  color: var(--main-bg-color);
+  background: var(--main-fg-color);
+  /* text-shadow: var(--text-shadow); */
 }
 
 .footer {
@@ -196,6 +203,11 @@ pre::-webkit-scrollbar {
   display: none;
 }
 
+code {
+  line-height: 2.8rem;
+  font-family: var(--font-family);
+}
+
 .typewriter-1 {
   overflow: hidden;
   white-space: nowrap;
@@ -221,12 +233,12 @@ pre::-webkit-scrollbar {
 .typewriter-2::after {
   filter: brightness(0.9);
   background-color: var(--main-fg-color);
-  box-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color);
+  /* box-shadow: var(--text-shadow); */
   content: '';
   display: inline-block;
-  width: 1.3rem;
-  height: 1.9rem;
-  margin-left: -8px;
+  width: 0.9rem;
+  height: 1.45rem;
+  margin-left: -6px;
   animation: cursor-blink 1s steps(1, start) infinite;
   animation-delay: 3.5s;
 }
@@ -242,7 +254,7 @@ pre::-webkit-scrollbar {
   border-color: var(--main-fg-color);
   color: var(--main-fg-color) !important;
   background-color: var(--main-bg-color);
-  text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color);
+  /* text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color); */
 }
 
 #search-btn {
@@ -250,5 +262,5 @@ pre::-webkit-scrollbar {
   border-color: var(--main-fg-color);
   color: var(--main-fg-color);
   background-color: var(--main-bg-color);
-  text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color);
+  /* text-shadow: 0 0 1px var(--main-fg-color), 0 0 6px var(--main-fg-color); */
 }