homer77
/
tootkomm
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: homer77:0230859c17fda0486e482b80daecc3a0fc5ab777
Branches Tags
homer77:master
..
compare: homer77:876cdf82a238263935ac9a8af78553f30cd4461b
Branches Tags
homer77:master

2 Commits
0230859c17 ... 876cdf82a2

Author SHA1 Message Date
Homer S. 876cdf82a2 Merge branch 'master' of ssh://git.ismus.net:2222/homer77/tootkomm 2022-02-11 16:04:08 +01:00
Homer S. a90cf9be4e Merge 2022-02-11 14:04:23 +01:00
2 changed files with 102 additions and 0 deletions
Show Stats Expand all files Collapse all files

54
index.html Normal file
View File

@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Our superheroes</title>
<link href="https://fonts.googleapis.com/css?family=Faster+One" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
</header>
<section>
</section>
<script>
async function populate() {
const requestURL = 'https://social.tchncs.de/api/v1/statuses/107735248507147283';
const request = new Request(requestURL);
const response = await fetch(request);
const mastopost = await response.json();
populateHeader(mastopost);
// populateHeroes(mastopost);
}
function populateHeader(obj) {
const header = document.querySelector('header');
const myH1 = document.createElement('h1');
myH1.textContent = obj['account']['display_name'];
header.appendChild(myH1);
const myPara = document.createElement('article');
myPara.innerHTML = `${obj['content']}`;
header.appendChild(myPara);
}
populate();
</script>
</body>
</html>

48
style.css Normal file
View File

@ -0,0 +1,48 @@
/* || general styles */
html {
font-family: 'helvetica neue', helvetica, arial, sans-serif;
}
body {
width: 800px;
margin: 0 auto;
}
h1, h2 {
font-family: 'Faster One', cursive;
}
/* header styles */
h1 {
font-size: 4rem;
text-align: center;
}
header p {
font-size: 1.3rem;
font-weight: bold;
text-align: center;
}
/* section styles */
section article {
width: 33%;
float: left;
}
section p {
margin: 5px 0;
}
section ul {
margin-top: 0;
}
h2 {
font-size: 2.5rem;
letter-spacing: -5px;
margin-bottom: 10px;
}