aboutsummaryrefslogtreecommitdiffstatshomepage
diff options
context:
space:
mode:
authorEgor Tensin <Egor.Tensin@gmail.com>2022-10-28 08:37:22 +0200
committerEgor Tensin <Egor.Tensin@gmail.com>2022-10-28 11:11:57 +0200
commitcc2273f7af3a56e2b7198290d4c337e146a4213a (patch)
treeeee77d02967b53806c0dc41a65f6d6bfa8832640
parentposts: redesign feed again (diff)
downloadjekyll-theme-cc2273f7af3a56e2b7198290d4c337e146a4213a.tar.gz
jekyll-theme-cc2273f7af3a56e2b7198290d4c337e146a4213a.zip
posts: narrower feed on mobile
Diffstat (limited to '')
-rw-r--r--_includes/jekyll-theme/flex-header.html4
-rw-r--r--_includes/jekyll-theme/posts/date.html4
-rw-r--r--_includes/jekyll-theme/posts/header.html8
-rw-r--r--_layouts/post.html2
-rw-r--r--assets/css/jekyll-theme/posts.css8
5 files changed, 19 insertions, 7 deletions
diff --git a/_includes/jekyll-theme/flex-header.html b/_includes/jekyll-theme/flex-header.html
index 6048991..418fa2b 100644
--- a/_includes/jekyll-theme/flex-header.html
+++ b/_includes/jekyll-theme/flex-header.html
@@ -1,11 +1,11 @@
<div class="flex-header" style="flex-wrap: wrap;">
<div class="flex-header">
{% if include.left %}
- <p class="flex-header-left text-muted font-size-90">{{ include.left }}</p>
+ <div class="flex-header-left text-muted font-size-90">{{ include.left }}</div>
{% endif %}
<div class="flex-header-title">{{ include.title }}</div>
</div>
{% if include.right %}
- <p class="flex-header-right text-muted font-size-90">{{ include.right }}</p>
+ <div class="flex-header-right text-muted font-size-90">{{ include.right }}</div>
{% endif %}
</div>
diff --git a/_includes/jekyll-theme/posts/date.html b/_includes/jekyll-theme/posts/date.html
index 4d36bd3..de7c4de 100644
--- a/_includes/jekyll-theme/posts/date.html
+++ b/_includes/jekyll-theme/posts/date.html
@@ -1,5 +1,5 @@
{% assign fmt = include.fmt %}
{% unless fmt %}
- {% assign fmt = "%F" %}
+ {% assign fmt = '%Y<span class="hide-on-mobile">-</span>%m<span class="hide-on-mobile">-</span>%d' %}
{% endunless %}
-<span class="glyphicon glyphicon-time"></span>&nbsp;<span{% if include.monospace %} class="text-monospace"{% endif %}>{{ include.date | date: fmt }}</span>
+<span class="hide-on-mobile"><span class="glyphicon glyphicon-time"></span>&nbsp;</span><span{% if include.monospace %} class="text-monospace"{% endif %}>{{ include.date | date: fmt }}</span>
diff --git a/_includes/jekyll-theme/posts/header.html b/_includes/jekyll-theme/posts/header.html
index d170ae9..4d648e7 100644
--- a/_includes/jekyll-theme/posts/header.html
+++ b/_includes/jekyll-theme/posts/header.html
@@ -1,11 +1,15 @@
{% assign header_date = null %}
{% if include.date %}
- {% capture header_date %}{%- include jekyll-theme/posts/date.html date=include.date monospace=true -%}{% endcapture %}
+ {% capture header_date %}<p>{%- include jekyll-theme/posts/date.html date=include.date monospace=true -%}</p>{% endcapture %}
{% endif %}
{% assign header_category = null %}
{% if include.category %}
- {% capture header_category %}{%- include jekyll-theme/categories/label.html category=include.category monospace=true -%}{% endcapture %}
+ {% capture header_category %}
+ <p class="hide-on-mobile">
+ {%- include jekyll-theme/categories/label.html category=include.category monospace=true -%}
+ </p>
+ {% endcapture %}
{% endif %}
{% capture header_title %}<h5 class="text-monospace">{{ include.title }}</h5>{% endcapture %}
diff --git a/_layouts/post.html b/_layouts/post.html
index dcf667a..e5d6197 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -8,7 +8,7 @@ layout: default
{% capture category %}{%- include jekyll-theme/categories/label.html link=true category=page.category monospace=true -%}&nbsp;{% endcapture %}
{% endif %}
-{% capture date %}{{ category }}{{ date }}{% endcapture %}
+{% capture date %}<p>{{ category }}{{ date }}</p>{% endcapture %}
{% capture title %}<h1>{{ page.title }}</h1>{% endcapture %}
diff --git a/assets/css/jekyll-theme/posts.css b/assets/css/jekyll-theme/posts.css
index 1e0fc47..25d75ba 100644
--- a/assets/css/jekyll-theme/posts.css
+++ b/assets/css/jekyll-theme/posts.css
@@ -4,6 +4,14 @@
align-items: baseline;
column-gap: 1.5em;
}
+@media(max-width: 480px) {
+ .flex-header {
+ column-gap: 1em;
+ }
+ .feed-entry .hide-on-mobile {
+ display: none;
+ }
+}
.flex-header-left, .flex-header-right {
flex: none;