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/" | ||||
| languageCode = "en-us" | ||||
| title = "Basic Hugo Theme" | ||||
| title = "Semantic IndieWeb Theme" | ||||
| copyright = "Copyright © 2019, Copyright Owner Name | Built with [Hugo](https://gohugo.io/)" | ||||
| theme = "semantic-indieweb" | ||||
| paginate = 5 | ||||
|  | @ -12,6 +12,14 @@ paginate = 5 | |||
|   subtitle = "A theme with no CSS and only basic layouts" | ||||
|   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 | ||||
|   [[params.Identity]] | ||||
|     type = "Email" | ||||
|  |  | |||
|  | @ -8,6 +8,13 @@ | |||
|     <title>{{- block "title" . -}} | ||||
|         {{ .Site.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> | ||||
| 
 | ||||
| <body> | ||||
|  | @ -40,6 +47,11 @@ | |||
|             {{- block "content-footer" . -}} | ||||
|             {{- end -}} | ||||
|         </footer> | ||||
|         <aside> | ||||
|             {{ block "author-card" . }} | ||||
|             {{ partial "author-card.html" . }} | ||||
|             {{ end }} | ||||
|         </aside> | ||||
|     </main> | ||||
|     <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