From 87fbb058af5d3f6d4cfc5bcb2da4fa9a99b3b627 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Wed, 12 May 2021 08:58:19 +0200 Subject: Design --- assets/css/components/_post-list.scss | 36 +++++++++++++++-------------------- 1 file changed, 15 insertions(+), 21 deletions(-) (limited to 'assets/css/components/_post-list.scss') diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_post-list.scss index 5e9f520..9d4c956 100644 --- a/assets/css/components/_post-list.scss +++ b/assets/css/components/_post-list.scss @@ -7,16 +7,10 @@ --post: ( --idle-fg: prop(--colors --fg-lo, $global: true), --visited-fg: prop(--colors --fg, $global: true), - --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, ) )); @@ -33,15 +27,8 @@ } @include element('post') { - display: flex; - align-items: baseline; - padding: prop(--dims --pad-y) prop(--dims --pad-x); - background-color: prop(--colors --post --bg); - color: currentColor; - text-decoration: none; - @include next-twin-element { - margin-top: 2px; + margin-top: .6rem; } &:visited { @@ -49,19 +36,26 @@ color: prop(--colors --post --visited-fg); } } + + &:hover, + &:focus { + @include element('post-date') { + color: currentColor; + } + } } @include element('post-title') { - margin-right: 1em; - color: prop(--colors --post --idle-fg); - font-size: 1 / 16 * 17em; + color: prop(--colors --post --idle-fg); + font-size: 1 / 16 * 17em; + font-weight: normal; } @include element('post-date') { - flex: 0 0 auto; - margin-left: auto; - color: prop(--colors --meta --fg); - font-size: 1 / 16 * 14em; + flex: 0 0 auto; + transition: color .2s; + color: prop(--colors --meta --fg); + font-size: 1 / 16 * 14em; } } } -- cgit v1.2.3-54-g00ecf