From 6c20e2fd01856072cae3df727a4ef88314bffe28 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Tue, 11 May 2021 20:43:53 +0200 Subject: Simplified metadata processing, improved design --- assets/css/_vars.scss | 10 +++-- assets/css/components/_outer-button.scss | 2 +- assets/css/components/_post-list.scss | 56 ++++++++++++++++++++++++++ assets/css/scopes/_colored-links.scss | 4 +- assets/css/scopes/_headlines.scss | 3 +- assets/css/style.scss | 1 + scripts/metadata_filter.lua | 67 +++++++++++++------------------- templates/layouts/categorized_list.html | 35 +++++++++-------- 8 files changed, 114 insertions(+), 64 deletions(-) create mode 100644 assets/css/components/_post-list.scss diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index 0df3a61..78a451b 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss @@ -26,7 +26,7 @@ $content--width: 42rem; $gray0: hsl(220, 7%, 7%); $gray1: hsl(220, 7%, 11%); -$gray2: hsl(220, 7%, 18%); +$gray2: hsl(220, 7%, 17%); $gray3: hsl(220, 7%, 23%); $gray4: hsl(220, 7%, 38%); $gray5: hsl(220, 7%, 60%); @@ -57,7 +57,7 @@ $gray7: hsl(220, 7%, 100%); --color: hsl(var(--colors--accent--h), var(--colors--accent--s), var(--colors--accent--l)), ), - --focus-ring: var(--colors--accent--color), + --focus-ring: var(--colors--fg-lo), --select: ( --bg: rgba($gray7, .996), @@ -67,7 +67,11 @@ $gray7: hsl(220, 7%, 100%); --link: ( --idle: var(--colors--fg-lo), - ) + --colored: ( + --idle: hsl(210, 90%, 72%), // hsl(354, 100%, 66%), + --visited: hsl(270, 60%, 75%), // hsl(354, 50%, 66%), + ) + ), ) )); diff --git a/assets/css/components/_outer-button.scss b/assets/css/components/_outer-button.scss index e54c83d..21f78f4 100644 --- a/assets/css/components/_outer-button.scss +++ b/assets/css/components/_outer-button.scss @@ -26,7 +26,7 @@ color: prop(--colors --fg); font-size: 1rem; font-weight: 700; - letter-spacing: 1px; + letter-spacing: .5px; text-decoration: none; text-transform: uppercase; diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss new file mode 100644 index 0000000..7787efd --- /dev/null +++ b/assets/css/components/_post-list.scss @@ -0,0 +1,56 @@ +@include namespace('post-list') { + @include store(( + --colors: ( + --cat: ( + --fg: prop(--colors --fg-lo, $global: true), + ), + --post: ( + --bg: prop(--colors --bg-lo, $global: true), + --border: prop(--colors --obj-hi, $global: true), + ), + --meta: ( + --fg: prop(--colors --fg-hi, $global: true), + ) + ), + --dims: ( + --pad-x: 1em, + --pad-y: .6em, + ) + )); + + @include component(namespace()) { + @include element('category-header') { + color: prop(--colors --cat --fg); + font-size: 1 / 16 * 14em; + letter-spacing: 1px; + text-transform: uppercase; + + @include next-element('post') { + margin-top: $line-height * .5rem; + } + } + + @include element('post') { + display: flex; + align-items: baseline; + padding: prop(--dims --pad-y) prop(--dims --pad-x); + background-color: prop(--colors --post --bg); + + @include next-twin-element { + border-top: 1px solid prop(--colors --post --border); + } + } + + @include element('post-title') { + margin-right: 1em; + font-size: 1 / 16 * 17em; + } + + @include element('post-date') { + flex: 0 0 auto; + margin-left: auto; + color: prop(--colors --meta --fg); + font-size: 1 / 16 * 14em; + } + } +} diff --git a/assets/css/scopes/_colored-links.scss b/assets/css/scopes/_colored-links.scss index 25ed289..9be0f93 100644 --- a/assets/css/scopes/_colored-links.scss +++ b/assets/css/scopes/_colored-links.scss @@ -2,8 +2,8 @@ @include store(( --colors: ( --link: ( - --idle: hsl(210, 90%, 72%), // hsl(354, 100%, 66%), - --visited: hsl(270, 60%, 75%), // hsl(354, 50%, 66%), + --idle: prop(--colors --link --colored --idle, $global: true), + --visited: prop(--colors --link --colored --visited, $global: true), ) ) )); diff --git a/assets/css/scopes/_headlines.scss b/assets/css/scopes/_headlines.scss index 8b75708..367e093 100644 --- a/assets/css/scopes/_headlines.scss +++ b/assets/css/scopes/_headlines.scss @@ -38,7 +38,6 @@ h3 { @include iro-responsive-modular-scale(font-size, 1, $responsive-mod-scale); - letter-spacing: .05em; text-transform: uppercase; } @@ -47,7 +46,7 @@ h6 { @include iro-responsive-modular-scale(font-size, 0, $responsive-mod-scale); - letter-spacing: .1em; + letter-spacing: .5px; text-transform: uppercase; } diff --git a/assets/css/style.scss b/assets/css/style.scss index e4a36b0..30878fe 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss @@ -23,6 +23,7 @@ @import 'components/footer'; @import 'components/card'; @import 'components/project'; +@import 'components/post-list'; @import 'scopes/colored-links'; @import 'scopes/headlines'; diff --git a/scripts/metadata_filter.lua b/scripts/metadata_filter.lua index b8a9059..5f2d9af 100644 --- a/scripts/metadata_filter.lua +++ b/scripts/metadata_filter.lua @@ -6,20 +6,24 @@ function format_date(date) if not year then return nil end local time = os.time({year = tonumber(year), month = tonumber(month), day = tonumber(day)}) - return pandoc.MetaMap({ + return { yyyy_mm_dd = os.date("%F", time), yyyy = os.date("%Y", time), mm = os.date("%m", time), dd = os.date("%d", time), rfc3339 = os.date("%FT%T+00:00", time), long = os.date("%B %d, %Y", time), - }) + } end -function table_to_list(t, cmp) +function table_to_list(t, kv, cmp) local l = pandoc.List() - for key, value in pairs(t) do l:insert(pandoc.MetaMap({key = key, value = value})) end + if kv then + for key, value in pairs(t) do l:insert({key = key, value = value}) end + else + for _, value in pairs(t) do l:insert(value) end + end l:sort(cmp or function(i1, i2) return i1.key < i2.key end) @@ -96,13 +100,13 @@ function resolve_url(site_url, ref_file, target_file) local abs = target_file local rel = relative_to(ref_base_dir, abs):gsub("/index%.html$", "/") - return pandoc.MetaMap({abs = abs, rel = rel, full = (site_url .. abs)}) + return {abs = abs, rel = rel, full = (site_url .. abs)} end function resolve_layout(layout) if layout then layout = pandoc.utils.stringify(layout) - return pandoc.MetaMap({id = layout, ["is_" .. layout] = pandoc.MetaBool(true)}) + return {id = layout, ["is_" .. layout] = true} end end @@ -112,16 +116,13 @@ function resolve_namespace(namespace) local root = "index" if namespace ~= "" then root = namespace:gsub("^/([^/]*).*$", "%1") end - return pandoc.MetaMap({ - root = pandoc.MetaMap({id = root, ["is_" .. root] = pandoc.MetaBool(true)}), - full = namespace, - }) + return {root = {id = root, ["is_" .. root] = true}, full = namespace} end function resolve_category(categories, category) if categories and category then category = pandoc.utils.stringify(category) - data = pandoc.MetaMap(categories[category]) + data = categories[category] data.id = category return data end @@ -133,14 +134,14 @@ function prep_menu(active_id, main_menu) for i = 1, #main_menu do local item = main_menu[i] local active = pandoc.utils.stringify(item.id) == active_id - item.active = pandoc.MetaBool(active) + item.active = active if active then active_item = item end end - return pandoc.MetaMap({ + return { items = main_menu:filter(function(item) return not item.hidden or item.active end), active = active_item, - }) + } end function process_pages(global, pages_by_id) @@ -167,33 +168,23 @@ function process_pages(global, pages_by_id) end end) - local pages_categorized = pages_list:filter(function(p) return p.category ~= nil end) - - local pages_by_category = group_by(pages_categorized, function(p) return p.category.id end) - pages_by_category = - table_to_list(pages_by_category, function(i1, i2) return i1.key < i2.key end) - - local pages_data = pandoc.MetaMap({ - all = pages_list, - by_id = pages_by_id, - by_category = pages_by_category, - }) - - local categories_data = group_by(pages_categorized, - function(p) return p.category and p.category.id end, function(stats, _, p) - if not stats then - return {name = p.category.name, count = 1} + local pages_by_category = pages_list:filter(function(p) return p.category ~= nil end) + pages_by_category = group_by(pages_by_category, function(p) return p.category.id end, + function(data, _, p) + if not data then + local l = pandoc.List() + l:insert(p) + return {name = pandoc.utils.stringify(p.category.name), pages = l} else - stats.count = stats.count + 1 + data.pages:insert(p) end end) - categories_data = table_to_list(categories_data) + pages_by_category = table_to_list(pages_by_category, false, + function(i1, i2) return i1.name < i2.name end) - for i = 1, #categories_data do - categories_data[i].value.count = ("%d"):format(categories_data[i].value.count) - end + local pages_data = {all = pages_list, by_id = pages_by_id, by_category = pages_by_category} - return pages_data, categories_data + return pages_data end function process(global, meta) @@ -222,9 +213,7 @@ function process(global, meta) meta.menus.main = prep_menu(meta.namespace.root.id, meta.menus.main) end - local pages, local_categories = process_pages(global, meta.pages) - meta.pages = pages - meta.local_categories = local_categories + meta.pages = process_pages(global, meta.pages) return meta end diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html index 5e2d4a5..0b445ee 100644 --- a/templates/layouts/categorized_list.html +++ b/templates/layouts/categorized_list.html @@ -1,30 +1,31 @@
-
+

$title$

$body$
- $for(pages.by_category)$ -

- $for(it.value/first/first)$ - $it.category.name$ - $endfor$ -

-
$endfor$ - - $endfor$ + $endfor$ +
-- cgit v1.2.3-70-g09d2