rayelliott
/
hugo-coder-fork
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update metadata styling

This commit is contained in:
Ray Elliott 2020-02-18 22:54:05 +00:00
parent 46f6de852d
commit d14d1d7215
4 changed files with 55 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
assets/scss/_content.scss
View File

@ -38,6 +38,10 @@
margin-bottom: 0.75em; margin-bottom: 0.75em;
} }
.post-meta { .post-meta {
display: flex;
flex-wrap: wrap;
justify-content: center;
i { i {
text-align: center; text-align: center;
width: 1.6rem; width: 1.6rem;
@ -46,11 +50,49 @@
} }
.date { .date {
.posted-on { .posted-on {
margin-left: 0; // margin-left: 0;
margin-right: 1.5rem; // margin-right: 1.5rem;
} }
} }
} }
.taxonomy {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.meta-tag {
padding: 0 12px;
margin: 3px;
border: 1px solid #eaeaea;
border-radius: 1px;
background-color: #ededed;
color: #333;
i {
font-size: 0.9em;
}
&--link {
font-size: 0.8em;
text-decoration: underline;
&:hover {
opacity: 1;
color: #999;
}
i {
font-size: 1em;
}
}
.icon {
color: inherit;
}
}
} }
img { img {
display: block; display: block;
@ -72,39 +114,6 @@
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.taxonomy {
display: flex;
flex-wrap: wrap;
justify-content: center;
@media only screen and (min-width: 768px) {
max-width: 50%;
margin-left: auto;
margin-right: auto;
}
}
.category,
.tag {
font-size: 0.8em;
padding: 0 12px;
margin: 3px;
border-radius: 1px;
background-color: #ededed;
color: #333;
text-decoration: none;
&:hover {
opacity: 1;
color: #555;
text-decoration: underline;
}
.icon {
color: inherit;
}
}
} }
.avatar img { .avatar img {

2
layouts/partials/taxonomy/categories.html
View File

@ -1,3 +1,3 @@
{{- range $index, $el := . -}} {{- range $index, $el := . -}}
<a class="category" href="{{ ( printf "categories/%s/" ( . | urlize ) ) | relLangURL }}"><i class="icon fas fa-folder"></i>{{ . }}</a> <a class="meta-tag meta-tag--link" href="{{ ( printf "categories/%s/" ( . | urlize ) ) | relLangURL }}"><i class="icon fas fa-folder"></i>{{ . }}</a>
{{- end -}} {{- end -}}

2
layouts/partials/taxonomy/tags.html
View File

@ -1,3 +1,3 @@
{{- range $index, $el := . -}} {{- range $index, $el := . -}}
<a class="tag" href="{{ ( printf "tags/%s/" ( . | urlize ) ) | relLangURL }}"><i class="icon fas fa-tag"></i>{{ . }}</a> <a class="meta-tag meta-tag--link" href="{{ ( printf "tags/%s/" ( . | urlize ) ) | relLangURL }}"><i class="icon fas fa-tag"></i>{{ . }}</a>
{{- end -}} {{- end -}}

8
layouts/posts/single.html
View File

@ -9,17 +9,15 @@
<h1 class="title">{{ .Title }}</h1> <h1 class="title">{{ .Title }}</h1>
</div> </div>
<div class="post-meta"> <div class="post-meta">
<div class="date"> <div class="meta-tag posted-on">
<span class="posted-on">
<i class="fas fa-calendar"></i> <i class="fas fa-calendar"></i>
<time datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'> <time datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
{{ .Date.Format (.Site.Params.dateFormat | default "January 2, 2006" ) }} {{ .Date.Format (.Site.Params.dateFormat | default "January 2, 2006" ) }}
</time> </time>
</span> </div>
<span class="reading-time"> <div class="meta-tag reading-time">
<i class="fas fa-clock"></i> <i class="fas fa-clock"></i>
{{ i18n "reading_time" .ReadingTime }} {{ i18n "reading_time" .ReadingTime }}
</span>
</div> </div>
<div class="taxonomy"> <div class="taxonomy">
{{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }} {{ with .Page.Params.Categories }}{{ partial "taxonomy/categories.html" . }}{{ end }}