diff options
| -rw-r--r-- | assets/css/components/_post-list.scss | 20 | ||||
| -rw-r--r-- | templates/layouts/categorized_list.html | 8 |
2 files changed, 20 insertions, 8 deletions
diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss index 7787efd..764fe3f 100644 --- a/assets/css/components/_post-list.scss +++ b/assets/css/components/_post-list.scss | |||
| @@ -5,8 +5,10 @@ | |||
| 5 | --fg: prop(--colors --fg-lo, $global: true), | 5 | --fg: prop(--colors --fg-lo, $global: true), |
| 6 | ), | 6 | ), |
| 7 | --post: ( | 7 | --post: ( |
| 8 | --bg: prop(--colors --bg-lo, $global: true), | 8 | --idle-fg: hsl(210, 90%, 72%), // hsl(354, 100%, 66%), |
| 9 | --border: prop(--colors --obj-hi, $global: true), | 9 | --visited-fg: hsl(270, 60%, 75%), // hsl(354, 50%, 66%), |
| 10 | --bg: prop(--colors --bg-lo, $global: true), | ||
| 11 | --border: prop(--colors --obj-hi, $global: true), | ||
| 10 | ), | 12 | ), |
| 11 | --meta: ( | 13 | --meta: ( |
| 12 | --fg: prop(--colors --fg-hi, $global: true), | 14 | --fg: prop(--colors --fg-hi, $global: true), |
| @@ -35,15 +37,25 @@ | |||
| 35 | align-items: baseline; | 37 | align-items: baseline; |
| 36 | padding: prop(--dims --pad-y) prop(--dims --pad-x); | 38 | padding: prop(--dims --pad-y) prop(--dims --pad-x); |
| 37 | background-color: prop(--colors --post --bg); | 39 | background-color: prop(--colors --post --bg); |
| 40 | color: currentColor; | ||
| 41 | text-decoration: none; | ||
| 38 | 42 | ||
| 39 | @include next-twin-element { | 43 | @include next-twin-element { |
| 40 | border-top: 1px solid prop(--colors --post --border); | 44 | border-top: 1px solid prop(--colors --post --border); |
| 41 | } | 45 | } |
| 46 | |||
| 47 | &:visited { | ||
| 48 | @include element('post-title') { | ||
| 49 | color: prop(--colors --post --visited-fg); | ||
| 50 | } | ||
| 51 | } | ||
| 42 | } | 52 | } |
| 43 | 53 | ||
| 44 | @include element('post-title') { | 54 | @include element('post-title') { |
| 45 | margin-right: 1em; | 55 | margin-right: 1em; |
| 46 | font-size: 1 / 16 * 17em; | 56 | color: prop(--colors --post --idle-fg); |
| 57 | font-size: 1 / 16 * 17em; | ||
| 58 | text-decoration: underline; | ||
| 47 | } | 59 | } |
| 48 | 60 | ||
| 49 | @include element('post-date') { | 61 | @include element('post-date') { |
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html index 0b445ee..60729bd 100644 --- a/templates/layouts/categorized_list.html +++ b/templates/layouts/categorized_list.html | |||
| @@ -12,17 +12,17 @@ $body$ | |||
| 12 | $it.name$ | 12 | $it.name$ |
| 13 | </h2> | 13 | </h2> |
| 14 | $for(it.pages)$ | 14 | $for(it.pages)$ |
| 15 | <div class="c-post-list__post"> | 15 | <a href="$it.url.rel$" class="c-post-list__post"> |
| 16 | <a href="$it.url.rel$" class="c-post-list__post-title"> | 16 | <span class="c-post-list__post-title"> |
| 17 | $it.title$ | 17 | $it.title$ |
| 18 | </a> | 18 | </span> |
| 19 | 19 | ||
| 20 | $if(it.category.show_date)$ | 20 | $if(it.category.show_date)$ |
| 21 | <time datetime="$it.date.yyyy_mm_dd$" class="c-post-list__post-date"> | 21 | <time datetime="$it.date.yyyy_mm_dd$" class="c-post-list__post-date"> |
| 22 | $it.date.long$ | 22 | $it.date.long$ |
| 23 | </time> | 23 | </time> |
| 24 | $endif$ | 24 | $endif$ |
| 25 | </div> | 25 | </a> |
| 26 | $endfor$ | 26 | $endfor$ |
| 27 | $endfor$ | 27 | $endfor$ |
| 28 | </div> | 28 | </div> |