From 9466fb4fe0ca1cb3038005e38d60e406595a1408 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Thu, 13 May 2021 20:59:24 +0200 Subject: Better integration of ASCII art --- assets/css/_basics.scss | 9 +-------- assets/css/components/_ascii.scss | 14 +++++++++++--- assets/css/scopes/_body.scss | 7 +++++++ content/9thPK7O3xn/index.md | 15 --------------- templates/layouts/categorized_list.html | 27 ++++++++++++++++++++++++++- 5 files changed, 45 insertions(+), 27 deletions(-) diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss index b01e415..e216c01 100644 --- a/assets/css/_basics.scss +++ b/assets/css/_basics.scss @@ -50,7 +50,7 @@ code { } pre { - margin: ($line-height * 1rem) 0 0; + margin: 0; overflow-x: auto; line-height: 1.4; @@ -171,10 +171,3 @@ hr { border: 0; background-color: prop(--colors --obj-hi); } - -blockquote, -pre { - margin: ($line-height * 1rem) 0 0 1px; - padding-left: calc(#{prop(--dims --indent)} - 3px); - border-left: 3px solid prop(--colors --obj); -} diff --git a/assets/css/components/_ascii.scss b/assets/css/components/_ascii.scss index b32cbfd..7b5d269 100644 --- a/assets/css/components/_ascii.scss +++ b/assets/css/components/_ascii.scss @@ -7,19 +7,27 @@ )); @include component(namespace()) { - padding-left: 0; overflow: hidden; - border-left: 0; color: prop(--colors --fg); + font-family: $font-fam--mono; font-size: 1rem; + line-height: 1.4; &::after { - content: str-repeat('░', 120); + content: str-repeat('░', 500); display: block; margin-top: 1 / 16 * 2em; padding-top: 1 / 16 * 2em; border-top: 1px solid prop(--colors --border); color: prop(--colors --fg); } + + @include element('fixed-content') { + display: inline-block; + position: relative; + left: 50%; + overflow: visible; + transform: translateX(-50%); + } } } diff --git a/assets/css/scopes/_body.scss b/assets/css/scopes/_body.scss index 96231ad..b44e083 100644 --- a/assets/css/scopes/_body.scss +++ b/assets/css/scopes/_body.scss @@ -23,6 +23,13 @@ max-width: 100%; } + blockquote, + pre { + margin: ($line-height * 1rem) 0 0; + padding-left: calc(#{prop(--dims --indent, $global: true)} - 3px); + border-left: 3px solid prop(--colors --obj, $global: true); + } + @include media('<=sm') { font-size: 1 / 16 * 17em; } diff --git a/content/9thPK7O3xn/index.md b/content/9thPK7O3xn/index.md index ec475bd..2545092 100644 --- a/content/9thPK7O3xn/index.md +++ b/content/9thPK7O3xn/index.md @@ -3,20 +3,5 @@ title: Personal layout: categorized_list --- -
-' |      '     '             '     '            '   | |    |           '     '  
-  |      '     '             '       //\_       '   | ' .  |           '     '  
- .|      '      ____,...,______..,_~``  -`..,   '   |    ' |           '     '  
-  |       _,~´"'  ,               .    ,~--´    '  _|  | . |~~.__      '     '  
-| |    ,-"    _.-|~/  |..,____,) ,/,,"'         '_( | '    |)    )     '     '  
- '|    \__,~"´   /:) /       |:\ \            ,~(    ) . | |  )   `,   '   _,--.
-   \   .   :    (:/\_-,      \:.\_-,    .  \ .\      .  :   \  .   ) . ' ,/
- -
-.|                     //\__      '  .'      |  . |           ' . ' 
- |      _.~-"""-----~``  ,-´      '   '      |'   |           '   ' 
-'|   .´  ,~'\ ).,__,)/,,"         ' . '      |  | |           '  .' 
- |_  `~´   (/\\,   (/\\,         _'   '_    _| '  |_         _'   '_
- 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/layouts/categorized_list.html b/templates/layouts/categorized_list.html index 0a881d2..7be9276 100644 --- a/templates/layouts/categorized_list.html +++ b/templates/layouts/categorized_list.html @@ -1,4 +1,29 @@ -
+
+
+ 
+                                                                                                                           
+  |                  |       |      '      '            '      '             '   |       |            '      '          |  
+  |                  |     ' |      '      '            '      '             '   |       |            '      '          |  
+' |                  |  .    |      '      '            '      '             '   |    :  |            '      '          |  
+  |               __~|  |    |      '      '            '      '             '   | |     |            '      '          | |
+  |__          ,(    |'      |_     '      '            '       //\_         '   | '  .  |            '      '          | '
+ '|   )~._   _(    . )      .|  )   '      ____,...,______..,_~``  -`..,     '   |    '  |        . ( '      '          |  
+  |,     __´  )  (   |   |   |    `  _,~´"'  ,               .    ,~--´      '  _|  | .  |~~.__ ´     '      '__,.      |  
+| |  _.~(    _       |  '   ~(    ,-"    _.-|~/  |..,____,) ,/,,"'           '_( | '     |)     )  .  '     (     )~-_  | '
+  | (_     (    ´    |    (  '    \__,~"´   /:) /       |:\ \              ,~(    ) .  | |  )    `,   '   _/- ..  ,  _) |  
+   ´   (  .      :  /    :        .   :    (:/\_-,      \:.\_-,      .  \ .\      .  :    \  .    ) . ' ,(      .      /
+ + 
+                                                                  
+  |     |            '    '             '   |     |        '    ' 
+  | '   |            '    '             '   |     |        '    ' 
+  |     |            '    '             '   |     |        '    ' 
+  |   . |            '    '     //\__   '   |  .  |        '    ' 
+  |     |        _.~-"""-----~``  ,-´   '   |'    |        '    ' 
+  | |  '|     .´  ,~'\ ).,__,)/,,"      '   |  |  |        '    ' 
+ _|     |_    `~´   (/\\,   (/\\,      _'  _| '   |_      _'    '_
+
+

$title$

-- cgit v1.2.3-70-g09d2