Create author card using h-card microformats
* Update baseof to add block for styling * Default styles block to link in layout.css and style.css * Update baseof to add block for importing icons from a CSS font library * Update baseof to add an aside block to the main content to put author card in * Create author card with a photo, author name, and general locale * Create beginning of a social network link ribbonmaster
parent
1273db7290
commit
65404a5da6
|
@ -1,6 +1,6 @@
|
||||||
baseURL = "http://example.org/"
|
baseURL = "http://example.org/"
|
||||||
languageCode = "en-us"
|
languageCode = "en-us"
|
||||||
title = "Basic Hugo Theme"
|
title = "Semantic IndieWeb Theme"
|
||||||
copyright = "Copyright © 2019, Copyright Owner Name | Built with [Hugo](https://gohugo.io/)"
|
copyright = "Copyright © 2019, Copyright Owner Name | Built with [Hugo](https://gohugo.io/)"
|
||||||
theme = "semantic-indieweb"
|
theme = "semantic-indieweb"
|
||||||
paginate = 5
|
paginate = 5
|
||||||
|
@ -12,6 +12,14 @@ paginate = 5
|
||||||
subtitle = "A theme with no CSS and only basic layouts"
|
subtitle = "A theme with no CSS and only basic layouts"
|
||||||
mainSections = [ "posts" ]
|
mainSections = [ "posts" ]
|
||||||
|
|
||||||
|
# Configuration Parameters for IndieWeb h-card
|
||||||
|
[params.Card]
|
||||||
|
Author = "Site Author Name"
|
||||||
|
Photo = "images/picture-o.svg"
|
||||||
|
Locality = "City/Town/Village"
|
||||||
|
Region = "State/County/Province"
|
||||||
|
Country = "Country Name"
|
||||||
|
|
||||||
# Configuration Parameters for IndieWeb Identity
|
# Configuration Parameters for IndieWeb Identity
|
||||||
[[params.Identity]]
|
[[params.Identity]]
|
||||||
type = "Email"
|
type = "Email"
|
||||||
|
|
|
@ -8,6 +8,13 @@
|
||||||
<title>{{- block "title" . -}}
|
<title>{{- block "title" . -}}
|
||||||
{{ .Site.Title }}
|
{{ .Site.Title }}
|
||||||
{{- end -}}</title>
|
{{- end -}}</title>
|
||||||
|
{{ block "styles" . }}
|
||||||
|
<link rel="stylesheet" href={{ "css/layout.css" | absURL }} />
|
||||||
|
<link rel="stylesheet" href={{ "css/style.css" | absURL }} />
|
||||||
|
{{ end }}
|
||||||
|
{{ block "icons" . }}
|
||||||
|
{{ partial "icons.html" . }}
|
||||||
|
{{ end }}
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
@ -40,6 +47,11 @@
|
||||||
{{- block "content-footer" . -}}
|
{{- block "content-footer" . -}}
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
</footer>
|
</footer>
|
||||||
|
<aside>
|
||||||
|
{{ block "author-card" . }}
|
||||||
|
{{ partial "author-card.html" . }}
|
||||||
|
{{ end }}
|
||||||
|
</aside>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
{{- block "footer" . -}}
|
{{- block "footer" . -}}
|
||||||
|
|
|
@ -0,0 +1,16 @@
|
||||||
|
<div class="h-card box">
|
||||||
|
<div class="box">
|
||||||
|
<img class="u-photo" src="{{ .Site.Params.Card.Photo | absURL}}" alt="" />
|
||||||
|
<div class="author-card-content">
|
||||||
|
<div class="author-card-header">
|
||||||
|
<a class="p-name u-url" href="{{ .Site.BaseURL }}" rel="me">{{ .Site.Params.Card.Author }}</a>
|
||||||
|
</div>
|
||||||
|
<div class="author-card-subheader">
|
||||||
|
<span class="p-locality">{{ .Site.Params.Card.Locality }}</span>,
|
||||||
|
<span class="p-region">{{ .Site.Params.Card.Region }}</span>,
|
||||||
|
<span class="p-country-name">{{ .Site.Params.Card.Country }}</span>
|
||||||
|
</div>
|
||||||
|
{{ partial "social.html" . }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
|
@ -0,0 +1 @@
|
||||||
|
<link rel="stylesheet" href={{ "css/fork-awesome.min.css" | absURL }} />
|
|
@ -0,0 +1,3 @@
|
||||||
|
<div class="social-box">
|
||||||
|
<a class="glyph" href="."><i class="fa fa-mastodon"></i></a>
|
||||||
|
</div>
|
|
@ -0,0 +1,10 @@
|
||||||
|
.box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
margin: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.author-card-content {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
|
@ -0,0 +1,7 @@
|
||||||
|
img.u-photo {
|
||||||
|
max-width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.glyph {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
Loading…
Reference in New Issue