Skip to content
Permalink
Browse files
feat(typography): use consistent style for timestamps in tags, catego…
…ries and archives pages
  • Loading branch information
talha131 committed Feb 1, 2020
1 parent d78f4e5 commit a421dcdbc42d87bcff2bfdeb3f3f19e5e6e8c3c2
Show file tree
Hide file tree
Showing 5 changed files with 37 additions and 43 deletions.
@@ -1,6 +1,7 @@
/* Base */
:root {
--borderRadius: 4px;
--mutedTextColor: dimgray;
}
html,
body {
@@ -145,10 +146,6 @@ table.highlighttable tbody > tr:nth-child(odd) > td {
float: none;
line-height: 28px;
}
.articles-in-tag li {
font: 1.1em/1.6 "Trebuchet MS", Trebuchet, "Lucida Sans Unicode",
"Lucida Grande", "Lucida Sans", Arial, Sans-Serif;
}
/* Article */
.article-content,
div.recent-posts p {
@@ -254,15 +251,10 @@ p#post-share-links {
a.category-title-inside-accordion {
text-decoration: none;
}
ul.list-articles-category {
ul.list-articles-under-tag-category {
list-style: none outside none;
margin: 0 0 0 5px;
}
ul.list-articles-category li time {
color: #8f8f8f;
display: inline-block;
width: 7em;
}
a.category-link {
color: #333;
}
@@ -296,10 +288,12 @@ div.blog-archives div,
div.recent-posts-article {
border-bottom: 1px dotted #aaa;
}
ul.list-articles-under-tag-category li {
padding: 0.1rem 0.2rem;
}
div.blog-archives div,
div.recent-posts-article {
font-size: 1.1em;
padding: 0.3em 0.2em;
padding: 0.3rem 0.2rem;
position: relative;
overflow: auto;
}
@@ -310,21 +304,16 @@ div.blog-archives div.last-entry-of-year {
margin-bottom: 1em;
}
div.blog-archives time,
div.recent-posts time {
div.recent-posts time,
ul.list-articles-under-tag-category li time {
float: right;
text-align: right;
text-align: left;
}
div.blog-archives time,
div.recent-posts time,
ul.list-articles-under-tag-category li time,
div.recent-posts-posted {
color: #8f8f8f;
font: 0.9em "PT Sans", "Helvetica Neue", Arial, Sans-Serif;
}
div.recent-posts time {
font-size: inherit;
}
div.recent-posts-time {
display: inline;
color: var(--mutedTextColor);
}
@media (max-width: 767px) {
div.blog-archives h2 {
@@ -334,15 +323,12 @@ div.recent-posts-time {
margin-left: 0;
padding-left: 0;
}
div.recent-posts time {
div.blog-archives time,
div.recent-posts time,
ul.list-articles-under-tag-category li time {
float: none;
}
div.recent-posts-time {
display: block;
}
ul.list-articles-category li time {
width: 100%;
}
}
/* MailChimp */
#mc-embed-signup {
@@ -35,7 +35,7 @@ h6,
.tag-title,
.list-of-tags,
a.category-title-inside-accordion,
ul.list-articles-category li time {
ul.list-articles-under-tag-category li time {
font-family: var(--sansFontFamily);
}
h1 {
@@ -155,13 +155,23 @@ blockquote {
a.category-title-inside-accordion {
font-size: 1.1rem;
}
ul.list-articles-category li time {
font-size: 0.7rem;
}
.author-name {
font-weight: bold;
font-variant: small-caps;
}
.author-blurb {
font-style: italic;
}
div.blog-archives div,
div.recent-posts-article,
ul.list-articles-under-tag-category li {
font-family: var(--sansFontFamily);
font-size: 0.963rem;
}
div.blog-archives time,
div.recent-posts time,
ul.list-articles-under-tag-category li time,
div.recent-posts-posted {
font-family: var(--sansFontFamily);
font-size: 0.8rem;
}
@@ -51,12 +51,9 @@ <h1><a href="{{ SITEURL }}/{{ CATEGORIES_URL }}">All Categories</a></h1>
</div>
<div id="{{ category.slug }}-ref" class="accordion-body collapse">
<div class="accordion-inner">
<ul class="list-articles-category">
<ul class="list-articles-under-tag-category">
{% for article in articles %}
<li itemscope>
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">
{{ article.locale_date }}
</time>
<a href="{{ SITEURL }}/{{ article.url }}">
{{ article.title }}
{% if article.subtitle %}
@@ -65,6 +62,9 @@ <h1><a href="{{ SITEURL }}/{{ CATEGORIES_URL }}">All Categories</a></h1>
</small>
{% endif %}
</a>
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">
{{ article.locale_date }}
</time>
</li>
{% endfor %}
</ul>
@@ -109,9 +109,7 @@ <h1 id="recent-posts">Recent Posts <a id="allposts" href="{{ SITEURL }}/{{ ARCHI
<div class="recent-posts-posted">
posted in
<a href="{{ SITEURL }}/{{ CATEGORIES_URL }}#{{ article.category.slug }}-ref">{{ article.category }}</a>
<div class="recent-posts-time">
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">{{ article.locale_date }}</time>
</div>
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">{{ article.locale_date }}</time>
</div>
{% if RECENT_ARTICLE_SUMMARY %}
<p>{{ article.summary }}</p>
@@ -56,12 +56,9 @@ <h1><a href="{{ SITEURL }}/{{ TAGS_URL }}">All Tags</a></h1>
<div class="span8 offset2">
{% for tag, articles in tags|sort %}
<h2 id="{{ tag.slug }}-ref" class="tag-title">{{ tag }}</h2>
<ul class="articles-in-tag list-articles-category">
<ul class="list-articles-under-tag-category">
{% for article in articles|sort(reverse = true, attribute = 'date') %}
<li itemscope>
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">
{{ article.locale_date }}
</time>
<a href="{{ SITEURL }}/{{ article.url }}">
{{ article.title }}
{% if article.subtitle %}
@@ -70,6 +67,9 @@ <h2 id="{{ tag.slug }}-ref" class="tag-title">{{ tag }}</h2>
</small>
{% endif %}
</a>
<time itemprop="dateCreated" datetime="{{ article.date.isoformat() }}">
{{ article.locale_date }}
</time>
</li>
{% endfor %}
</ul>

0 comments on commit a421dcd

Please sign in to comment.