Changed the scope of the link to status.
This commit is contained in:
parent
8f929523b2
commit
888b761012
26
index.html
26
index.html
|
@ -14,7 +14,7 @@
|
|||
|
||||
<main id="comments">
|
||||
<link rel="stylesheet" href="fontawesome/css/all.css">
|
||||
<link rel="stylesheet" href="style.css?v=1.18">
|
||||
<link rel="stylesheet" href="style.css?v=1.2">
|
||||
|
||||
|
||||
</main>
|
||||
|
@ -41,8 +41,7 @@
|
|||
|
||||
async function buildArticle(target, mastopost) {
|
||||
|
||||
const link = document.createElement('a');
|
||||
link.href = mastopost.url;
|
||||
|
||||
const article = document.createElement('article');
|
||||
|
||||
populateHeader(article, mastopost);
|
||||
|
@ -50,7 +49,7 @@
|
|||
populateAside(article, mastopost);
|
||||
populateFooter(article, mastopost);
|
||||
|
||||
target.appendChild(link).appendChild(article);
|
||||
target.appendChild(article);
|
||||
|
||||
}
|
||||
|
||||
|
@ -84,20 +83,30 @@
|
|||
function populateHeader(item, obj) {
|
||||
|
||||
const myHeader = document.createElement('header');
|
||||
const myCW = document.createElement('summary');
|
||||
const myDateTime = document.createElement('time');
|
||||
const link = document.createElement('a');
|
||||
link.href = obj.url;
|
||||
|
||||
myDateTime.datetime = obj.created_at;
|
||||
creation_date = new Date(obj.created_at);
|
||||
myDateTime.textContent = creation_date.toLocaleString();
|
||||
myDateTime.textContent = creation_date.toLocaleString('de-DE',{ day: "2-digit", month: "short", year: "numeric", hour:"2-digit", minute:"2-digit"});
|
||||
if(obj.spoiler_text.length > 0){
|
||||
const myCW = document.createElement('summary');
|
||||
const myButton = document.createElement('button');
|
||||
myButton.textContent = "+";
|
||||
myCW.textContent = obj.spoiler_text;
|
||||
myHeader.appendChild(myCW);
|
||||
myHeader.appendChild(myDateTime);
|
||||
myHeader.appendChild(myButton);
|
||||
|
||||
}
|
||||
|
||||
myHeader.appendChild(link).appendChild(myDateTime);
|
||||
item.appendChild(myHeader);
|
||||
|
||||
}
|
||||
|
||||
function populateSection(item, obj){
|
||||
|
||||
const mySection = document.createElement('section');
|
||||
mySection.innerHTML = `${obj['content']}`;
|
||||
item.appendChild(mySection);
|
||||
|
@ -113,7 +122,7 @@
|
|||
const myH = document.createElement('hgroup');
|
||||
const myP = document.createElement('div');
|
||||
myH.innerHTML = `<h1>${obj.account['display_name']}</h1> <h2>(<a href="${obj.account.url}">${obj.account['username']}</a>)</h2>`;
|
||||
myP.innerHTML = `<time datetime="${obj.account['created_at']}">since ${myDate.toLocaleDateString()}</time>`;
|
||||
myP.innerHTML = `<time datetime="${obj.account['created_at']}">since ${myDate.toLocaleDateString('de-DE',{ day: "2-digit", month: "short", year: "numeric"})}</time>`;
|
||||
|
||||
aside.appendChild(myH);
|
||||
aside.appendChild(myP);
|
||||
|
@ -135,6 +144,7 @@
|
|||
}
|
||||
|
||||
buildCommentTree("107735248507147283");
|
||||
// buildCommentTree("107724981153178707");
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
14
style.css
14
style.css
|
@ -9,6 +9,12 @@ html {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
time {
|
||||
display:inline-block;
|
||||
font-size: 0.7em;
|
||||
color:#b4b5ba;
|
||||
}
|
||||
|
||||
article {
|
||||
font-family: monospace, sans-serif;
|
||||
color: #fff;
|
||||
|
@ -33,6 +39,7 @@ article a {
|
|||
article header {
|
||||
width:100%;
|
||||
grid-area: header;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
article header summary {
|
||||
|
@ -41,6 +48,10 @@ article header summary {
|
|||
|
||||
}
|
||||
|
||||
article header time {
|
||||
padding-right:1em;
|
||||
}
|
||||
|
||||
article aside {
|
||||
grid-area: profile;
|
||||
text-align:center;
|
||||
|
@ -77,8 +88,7 @@ article > aside > div {
|
|||
}
|
||||
|
||||
article > aside > div > time {
|
||||
font-size: 0.7em;
|
||||
color:#b4b5ba;
|
||||
|
||||
}
|
||||
|
||||
article section {
|
||||
|
|
Loading…
Reference in New Issue