templates/layouts/categorized_list.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61

<section class="l-section l-section--fullscreen">
    <div class="c-ascii">
        <pre class="c-ascii__fixed-content u-dn@sm-lo">
                                                                                                                           
  |                  |       |      '      '            '      '             '   |       |            '      '          |  
  |                  |     ' |      '      '            '      '             '   |       |            '      '          |  
' |                  |  .    |      '      '            '      '             '   |    :  |            '      '          |  
  |               __~|  |    |      '      '            '      '             '   | |     |            '      '          | |
  |__          ,(    |'      |_     '      '            '       <strong>//\_</strong>         '   | '  .  |            '      '          | '
 '|   )~._   _(    . )      .|  )   '      <strong>____,...,______..,_~``  -`..,</strong>     '   |    '  |        . ( '      '          |  
  |,     __´  )  (   |   |   |    `  <strong>_,~´"'  ,               .    ,~--´</strong>      '  _|  | .  |~~.__ ´     '      '__,.      |  
| |  _.~(    _       |  '   ~(    <strong>,-"    _.-|~/  |..,____,) ,/,,"'</strong>           '_( | '     |)     )  .  '     (     )~-_  | '
  | (_     (    ´    |    (  '    <strong>\__,~"´   /:) /       |:\ \</strong>              ,~(    ) .  | |  )    `,   '   _/- ..  ,  _) |  
   ´   (  .      :  /    :        .   :    <strong>(:/\_-,      \:.\_-,</strong>      .  \ .\      .  :    \  .    ) . ' ,(      .      /   </pre>

            <pre class="c-ascii__fixed-content u-dn@sm-hi">
                                                                  
  |     |            '    '             '   |     |        '    ' 
  | '   |            '    '             '   |     |        '    ' 
  |     |            '    '             '   |     |        '    ' 
  |   . |            '    '     <strong>//\__</strong>   '   |  .  |        '    ' 
  |     |        <strong>_.~-"""-----~``  ,-´</strong>   '   |'    |        '    ' 
  | |  '|     <strong>.´  ,~'\ ).,__,)/,,"</strong>      '   |  |  |        '    ' 
 _|     |_    <strong>`~´   (/\\,   (/\\,</strong>      _'  _| '   |_      _'    '_</pre>
    </div>

    <div class="l-container l-container--pad-x l-container--pad-y l-container--content">
        <div class="s-headlines s-colored-links">
            <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>

$body$
        </div>

        <div class="c-post-list">
            $for(pages.by_category)$
                <h2 class="c-post-list__category-header">
                    $it.name$
                </h2>
                $for(it.pages)$
                    <a href="$it.url.rel$" class="c-post-list__post c-card">
                        <div class="c-card__content c-post-list__post-title">
                            $it.title$
                        </div>
                        $if(it.category.show_date)$
                            <time datetime="$it.date.yyyy_mm_dd$" class="c-post-list__post-date c-card__content">
                                <span class="u-dn@sm-hi">
                                    $it.date.short$
                                </span>
                                <span class="u-dn@sm-lo">
                                    $it.date.long$
                                </span>
                            </time>
                        $endif$
                    </a>
                $endfor$
            $endfor$
        </div>
    </div>
</section>