aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/assets/css
diff options
context:
space:
mode:
authorEgor Tensin <Egor.Tensin@gmail.com>2022-04-18 21:07:37 +0200
committerEgor Tensin <Egor.Tensin@gmail.com>2022-04-18 21:18:44 +0200
commit447835ef97f9ff2c41e8e6a717cebe3bbf37ae98 (patch)
tree25bda8b3b2a40b915242d764e82c90b5d78e0958 /assets/css
parentposts: denser feed (diff)
downloadjekyll-theme-447835ef97f9ff2c41e8e6a717cebe3bbf37ae98.tar.gz
jekyll-theme-447835ef97f9ff2c41e8e6a717cebe3bbf37ae98.zip
posts: redesign feed
Diffstat (limited to 'assets/css')
-rw-r--r--assets/css/jekyll-theme/posts.css35
1 files changed, 32 insertions, 3 deletions
diff --git a/assets/css/jekyll-theme/posts.css b/assets/css/jekyll-theme/posts.css
index bf10e90..59082d1 100644
--- a/assets/css/jekyll-theme/posts.css
+++ b/assets/css/jekyll-theme/posts.css
@@ -11,7 +11,7 @@
.post-date {
flex: none;
}
-.post-date a.category {
+.post-date .category {
margin-right: .5em;
}
@@ -23,8 +23,37 @@
column-gap: 1em;
}
-/* Don't use an actual <hr>, it's margins are too big, use a border instead. */
.feed-entry {
- /* The color of <hr>. */
+ /* The entire feed entry is a link now. */
+ display: block;
+ position: relative;
+ color: inherit !important;
+ /* Don't use an actual <hr>, it's margins are too big, use a border instead.
+ * The color of <hr>. */
border-bottom: 3px solid #eee;
}
+@media (min-width: 480px) {
+ /* If the screen width allows for it, add some padding on the sides. */
+ .feed-entry {
+ padding: 0 11px;
+ }
+}
+.feed-entry:hover, .feed-entry:focus {
+ /* Obviously, don't underline anything. The :focus case can be reproduced by
+ * long-pressing the link on Android, then dismissing the popup and long-
+ * pressing another link. */
+ text-decoration: none;
+}
+.feed-entry:hover {
+ /* This is the .list-group-item:hover background color. */
+ background-color: #f5f5f5;
+}
+
+.feed-entry h3 {
+ /* This is pretty funny and tragic, as is always the case with CSS.
+ * Android's Chrome thinks that it's not necessary to highlight the top
+ * margin (reproducible by long-pressing the link), _but_ it does highlight
+ * the top padding. This is obviously a browser bug. */
+ margin-top: 0;
+ padding-top: 22px;
+}