1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-11-27 14:12:09 +00:00
seirdy.one/layouts/shortcodes/indieweb-author.html
Rohan Kumar 811c887755
CSS overhaul: non-overlapping outlines
I increased a bunch of tap targets to fit the recommended 48x48 sizes
and 56x56 non-overlapping regions, but unfortunately this caused
outlines to overlap with each other. This commit turns these elements
into inline-block elements and makes the necessary fixes to accomodate
this change.
2022-06-03 15:47:14 -07:00

28 lines
1.7 KiB
HTML

{{- $favicon := resources.Get "/favicon.png" -}}<!-- re-using the favicon for the author photo -->
{{- $favicon_base64 := $favicon.Content | base64Encode -}}<!--
Reader mode implementations use .p-author, itemprop=author, and/or .author to add
a byline. Some also strip elements matching the "byline" class to avoid duplicating
the byline. Mozilla Readability uses both microformats1 and microformats2 while
Chromium Distiller uses microdata + schema.org. This site also needs to be Indieweb
compatible for webmentions and such. To support them all, I ended up with
microdata, microformats2, microformats1, and the "byline" class.
I put the byline class around the html that includes this partial so it can hide
the whole line.
Jesus christ.
Abominations like this also appear elsewhere in the blog btw. This is just the best
example. Oh, and then i need to support some parts of hNews as well as hentry *and*
h-entry.
This would be so much simpler if all the parsers just had a mode to detect
schema.org and a mode to detect microformats2, and then stuck to those standards.
(btw this is all made of <span> cuz it is supposed to be inline)
--><span itemprop="author copyrightHolder" itemscope="" itemtype="https://schema.org/Person" itemid="https://seirdy.one/#seirdy" class="h-card p-author author vcard">
<a itemprop="url" href="https://seirdy.one/" rel="author me home cc:attributionURL" class="u-url u-uid url" property="cc:attributionName">
{{ partial "indieweb-icon.html" }}
<span itemprop="name" class="p-name fn n">
<span itemprop="givenName" class="p-given-name given-name">Rohan</span>&#160;<span itemprop="familyName" class="p-family-name family-name">Kumar</span></span></a>
</span>