From 7cfef661469ffed7d77973adb3f9ecef5fd27668 Mon Sep 17 00:00:00 2001 From: Egor Tensin Date: Tue, 25 Oct 2022 12:25:42 +0200 Subject: posts: right-align the date Also, don't wrap if not necessary. --- assets/css/jekyll-theme/posts.css | 28 +++++++++------------------- 1 file changed, 9 insertions(+), 19 deletions(-) diff --git a/assets/css/jekyll-theme/posts.css b/assets/css/jekyll-theme/posts.css index 901f1dd..af3674a 100644 --- a/assets/css/jekyll-theme/posts.css +++ b/assets/css/jekyll-theme/posts.css @@ -1,29 +1,19 @@ -/* On the sidebar, the date is always beside the header. - * On smaller devices, the date is always beneath the header. - * On the post page, the date is beside the header or wraps to the next line on - * larger devices. - * In the feed, the date is always beside the header on larger devices. */ -@media (min-width: 768px) { - .post-header { - display: flex; - align-items: baseline; - justify-content: space-between; - column-gap: 1em; - } - :not(.feed-entry) > .post-header { - flex-wrap: wrap; - } -} -.list-group-item .post-header { +/* Wrap the post date to the next line if necessary. */ +.post-header { display: flex; - flex-wrap: nowrap; + flex-wrap: wrap; align-items: baseline; justify-content: space-between; - column-gap: 1em; + column-gap: 1.5em; +} +.list-group-item .post-header { + flex-wrap: nowrap; } .post-date { flex: none; + /* Right-align the post date if on the next line. */ + margin-left: auto; } .post-date .category { margin-right: 1em; -- cgit v1.2.3