9 files changed, 67 insertions, 2 deletions

diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index c3c62db..b01e415 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -50,12 +50,17 @@ code {
 }
 
 pre {
-    margin:     ($line-height * 1rem) 0 0;
-    overflow-x: auto;
+    margin:      ($line-height * 1rem) 0 0;
+    overflow-x:  auto;
+    line-height: 1.4;
 
     code {
         color: currentColor;
     }
+
+    strong {
+        //font-weight: normal;
+    }
 }
 
 strong {
diff --git a/assets/css/_fonts.scss b/assets/css/_fonts.scss
index 1a1e72a..c0d2ac1 100644
--- a/assets/css/_fonts.scss
+++ b/assets/css/_fonts.scss
@@ -21,3 +21,19 @@
     font-display: swap;
     src:          url('/GaretVariable.woff2') format('woff2-variations');
 }
+
+@font-face {
+    font-family:  'Iosevka Term SS09';
+    font-style:   normal;
+    font-weight:  normal;
+    font-display: swap;
+    src:          url('/iosevka-term-ss09-regular.woff2') format('woff2');
+}
+
+@font-face {
+    font-family:  'Iosevka Term SS09';
+    font-style:   normal;
+    font-weight:  bold;
+    font-display: swap;
+    src:          url('/iosevka-term-ss09-bold.woff2') format('woff2');
+}
diff --git a/assets/css/components/_ascii.scss b/assets/css/components/_ascii.scss
new file mode 100644
index 0000000..b32cbfd
--- /dev/null
+++ b/assets/css/components/_ascii.scss
@@ -0,0 +1,25 @@
+@include namespace('ascii') {
+    @include store((
+        --colors: (
+            --fg:     prop(--colors --fg-hi, $global: true),
+            --border: prop(--colors --fg-hi, $global: true),
+        )
+    ));
+
+    @include component(namespace()) {
+        padding-left: 0;
+        overflow:     hidden;
+        border-left:  0;
+        color:        prop(--colors --fg);
+        font-size:    1rem;
+
+        &::after {
+            content:     str-repeat('░', 120);
+            display:     block;
+            margin-top:  1 / 16 * 2em;
+            padding-top: 1 / 16 * 2em;
+            border-top:  1px solid prop(--colors --border);
+            color:       prop(--colors --fg);
+        }
+    }
+}
diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss
index bc41849..dc56724 100644
--- a/assets/css/components/_post-list.scss
+++ b/assets/css/components/_post-list.scss
@@ -44,6 +44,7 @@
 
         @include element('post-title') {
             color:       prop(--colors --post --idle-fg);
+            //font-size:   1 / 16 * 17em;
             font-weight: normal;
         }
 
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 30878fe..241bad5 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -22,6 +22,7 @@
 @import 'components/landing-banner';
 @import 'components/footer';
 @import 'components/card';
+@import 'components/ascii';
 @import 'components/project';
 @import 'components/post-list';
 
diff --git a/assets/fonts/iosevka-term-ss09-bold.ttf b/assets/fonts/iosevka-term-ss09-bold.ttf
new file mode 100644
index 0000000..d2c15c1
--- /dev/null
+++ b/assets/fonts/iosevka-term-ss09-bold.ttf
diff --git a/assets/fonts/iosevka-term-ss09-regular.ttf b/assets/fonts/iosevka-term-ss09-regular.ttf
new file mode 100644
index 0000000..39e247d
--- /dev/null
+++ b/assets/fonts/iosevka-term-ss09-regular.ttf
diff --git a/content/9thPK7O3xn/index.md b/content/9thPK7O3xn/index.md
index 2545092..ec475bd 100644
--- a/content/9thPK7O3xn/index.md
+++ b/content/9thPK7O3xn/index.md
@@ -3,5 +3,20 @@ title:  Personal
 layout: categorized_list
 ---
 
+<pre class="c-ascii u-dn@sm-lo">
+' |      '     '             '     '            '   | |    |           '     '  
+  |      '     '             '       <strong>//\_</strong>       '   | ' .  |           '     '  
+ .|      '      <strong>____,...,______..,_~``  -`..,</strong>   '   |    ' |           '     '  
+  |       <strong>_,~´"'  ,               .    ,~--´</strong>    '  _|  | . |~~.__      '     '  
+| |    <strong>,-"    _.-|~/  |..,____,) ,/,,"'</strong>         '_( | '    |)    )     '     '  
+ '|    <strong>\__,~"´   /:) /       |:\ \</strong>            ,~(    ) . | |  )   `,   '   _,--.
+   \   .   :    <strong>(:/\_-,      \:.\_-,</strong>    .  \ .\      .  :   \  .   ) . ' ,/     </pre>
+
+<pre class="c-ascii u-dn@sm-hi">
+.|   <strong>                  //\__</strong>      '  .'      |  . |           ' . ' 
+ |   <strong>   _.~-"""-----~``  ,-´</strong>      '   '      |'   |           '   ' 
+'|   <strong>.´  ,~'\ ).,__,)/,,"   </strong>      ' . '      |  | |           '  .' 
+ |_  <strong>`~´   (/\\,   (/\\,    </strong>     _'   '_    _| '  |_         _'   '_</pre>
+
 Welcome to the personal section of my website!
 Here you can find content I don't want to be easily accessible for all visitors, which is why I haven't linked this section anywhere.
diff --git a/templates/base.html b/templates/base.html
index a5d29b5..27f8f20 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -26,6 +26,8 @@
     <link rel="preload" href="/IBMPlexSans-Regular.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
     <link rel="preload" href="/IBMPlexSans-Bold.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
     <link rel="preload" href="/GaretVariable.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+    <link rel="preload" href="/iosevka-term-ss09-regular.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+    <link rel="preload" href="/iosevka-term-ss09-bold.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
 
     <link rel="stylesheet" href="/style.css" />
 </head>