Design

1 files changed, 15 insertions, 21 deletions

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;
         }
     }
 }