X-Git-Url: https://git.ladys.computer/x_status_git/blobdiff_plain/2659b92ca7ae70783227a5de0c000e34b984e2c2..6b8de961c3f0e23435afe54d072951d9dd007f79:/index.html?ds=sidebyside diff --git a/index.html b/index.html index b315183..44698ed 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,8 @@ body{ Display: Grid; Box-Sizing: Border-Box; Margin: Auto; Padding-Inline: 1REM; #topics h2{ Margin-Block-End: 0; Grid-Column: 1 / Span 2; Text-Align: Center } #topics h2:Last-Child{ Display: None } div.STATUS{ Border: Thin Solid; Padding-Inline: 1REM; Border-Radius: .5REM } +summary{ Padding-Block: 1REM; Font-Weight: Bold } +details[open]>summary{ Border-Block-End: Thin Solid } footer{ Border-Block-Start: Thin Solid; Padding-Block: 1REM; Font-Size: Smaller; Text-Align: End } footer p{ Margin-Block: 0 .5REM } footer time:Not([datetime]), @@ -32,7 +34,7 @@ const renderLatest = (path, container) => fetch(`${path}.jsonld`) const { documentElement: article } = parser.parseFromString(src, "application/xhtml+xml") const footer = document.createElement("footer") const authorshipP = footer.appendChild(document.createElement("p")) - const { creator } = status + const { creator, title } = status if (creator) { const authorLink = authorshipP.appendChild(document.createElement("a")) authorLink.href = creator["@id"] @@ -47,7 +49,15 @@ const renderLatest = (path, container) => fetch(`${path}.jsonld`) const upLink = nav.appendChild(document.createElement("a")) upLink.href = meta["@id"] upLink.textContent = `See more ${ status.subject ? `“${status.subject}” posts` : "statuses" }.` - container.replaceChildren(document.importNode(article, true), footer) }) + if (title) { + const wrapper = document.createElement("article") + const details = wrapper.appendChild(document.createElement("details")) + details.setAttribute("open", "") + const summary = details.appendChild(document.createElement("summary")) + summary.textContent = title + details.append(...document.importNode(article, true).childNodes) + container.replaceChildren(wrapper, footer) } + else container.replaceChildren(document.importNode(article, true), footer) }) fetch("statuses.jsonld") .then($ => $.json()) .then(meta => renderLatest(meta.current, document.getElementById("status")))