XPUB
/
SI18
57
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

test

Browse Source
main
km0 2 years ago
parent ec5357f5d9
commit abf01a2426
18 changed files with 416 additions and 9 deletions
Show Stats Download Patch File Download Diff File

0
components/CookbookForm.js → archive/06/components/CookbookForm.js
Unescape Escape View File

0
components/CookbookRecipes.js → archive/06/components/CookbookRecipes.js
Unescape Escape View File

BIN
archive/img/avatar/Alex.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
archive/img/avatar/Carmen.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.4 KiB

BIN
archive/img/avatar/Chae.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

BIN
archive/img/avatar/Em.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.0 KiB

BIN
archive/img/avatar/Gersande.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
archive/img/avatar/Gr.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
archive/img/avatar/Jian.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.8 KiB

BIN
archive/img/avatar/Kamo.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
archive/img/avatar/Kim.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
archive/img/avatar/Miri.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
archive/img/avatar/Mitsa.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
archive/img/avatar/Supi.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

37
archive/index.html
Unescape Escape View File

@ -4,11 +4,14 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title> <link rel="stylesheet" href="style.css" />
<script src="releases.js" defer></script>
<title>SI18 Archive</title>
</head> </head>
<body> <body>
This is the main head quarter. <h1 class="title">SI18 - Radio Implicancies</h1>
<ul> <div class="colophon"></div>
<ul class="index">
<li> <li>
<a href="00">Try Out</a> <a href="00">Try Out</a>
</li> </li>
@ -27,12 +30,28 @@
<li> <li>
<a href="05">Nested Narratives</a> <a href="05">Nested Narratives</a>
</li> </li>
<li>
<a href="06">Sharing methods for diffractive reading</a>
</li>
<li>
<a href="07">[[ Unfolding [ ] Implicancies ]]</a>
</li>
</ul> </ul>
<div class="image-placeholder">
<img <!-- <div class="colophon">
src="images/inner-dance-cell.png" <div class="avatar"><img src="img/al.jpg.jpg" alt="Al" /></div>
alt="two people with headphones are picturing dancing jelly people with joy" <div class="avatar"><img src="img/kim.jpg" alt="Kim" /></div>
/> <div class="avatar"><img src="img/kamo.jpg" alt="Km0" /></div>
</div> <div class="avatar"><img src="img/grr.jpg" alt="Gr" /></div>
<div class="avatar"><img src="img/g.jpg" alt="Ge" /></div>
<div class="avatar"><img src="img/chae.jpg" alt="Che" /></div>
<div class="avatar"><img src="img/supi.jpg" alt="Sup" /></div>
<div class="avatar"><img src="img/mitsa.jpg" alt="Miz" /></div>
<div class="avatar"><img src="img/miri.jpg" alt="Mir" /></div>
<div class="avatar"><img src="img/emma.jpg" alt="Em" /></div>
<div class="avatar"><img src="img/jian.jpg" alt="J" /></div>
<div class="avatar"><img src="img/carmen.jpg" alt="Car" /></div>
</div> -->
</body> </body>
</html> </html>

54
archive/releases.js
Unescape Escape View File

@ -0,0 +1,54 @@
const colophon = document.querySelector(".colophon");
const container = document.querySelector(".index");
fetch("releases.json")
.then((res) => res.json())
.then((data) => {
buildIndex(data.releases);
});
const buildIndex = function (releases) {
container.innerHTML = "";
for (const [index, release] of releases.entries()) {
let item = document.createElement("li");
let link = document.createElement("a");
link.href = index.toString().padStart(2, "0");
link.innerHTML = index.toString().padStart(2, "0") + ". " + release.title;
item.appendChild(link);
item.addEventListener("mouseenter", (e) => {
buildColophon(release);
});
container.appendChild(item);
}
};
const buildColophon = function (release) {
colophon.innerHTML = "";
let caretakers = document.createElement("div");
caretakers.classList.add("caretakers");
for (const caretaker of release.caretakers) {
caretakers.appendChild(buildAvatar(caretaker));
}
let contributors = document.createElement("ul");
contributors.classList.add("contributors");
for (const contributor of release.contributors) {
let contribution = document.createElement("div");
for (const person of contributor) {
contribution.appendChild(buildAvatar(person));
}
contributors.appendChild(contribution);
}
colophon.appendChild(caretakers);
colophon.appendChild(contributors);
};
const buildAvatar = function (who) {
let avatar = document.createElement("img");
avatar.classList.add("avatar");
avatar.src = "img/avatar/" + who + ".jpg";
avatar.alt = who;
return avatar;
};

239
archive/releases.json
Unescape Escape View File

@ -0,0 +1,239 @@
{
"releases": [
{
"title": "Try Out",
"caretakers": [],
"contributors": []
},
{
"title": "Yet to be Named",
"caretakers": [
"Chae",
"Mitsa"
],
"contributors": [
[
"Alex",
"Em"
],
[
"Miri"
],
[
"Kamo"
],
[
"Mitsa",
"Gr"
],
[
"Kim",
"Chae"
],
[
"Supi",
"Jian"
],
[
"Gersande",
"Carmen"
]
]
},
{
"title": "Uneven Patterns",
"caretakers": [
"Kim",
"Jian"
],
"contributors": [
[
"Em",
"Miri"
],
[
"Kamo",
"Mitsa",
"Supi"
],
[
"Gersande",
"Carmen",
"Alex"
],
[
"Gr",
"Chae"
],
[
"Kim",
"Jian"
]
]
},
{
"title": "Emergent Opera",
"caretakers": [
"Gersande",
"Gr",
"Kamo"
],
"contributors": [
[
"Kamo",
"Supi"
],
[
"Gersande"
],
[
"Em",
"Jian"
],
[
"Carmen",
"Miri"
],
[
"Alex"
],
[
"Chae",
"Kim"
]
]
},
{
"title": "The Parliament",
"caretakers": [
"Mitsa",
"Gr",
"Miri"
],
"contributors": [
[
"Supi",
"Kim"
],
[
"Kamo",
"Miri"
],
[
"Mitsa",
"Alex"
],
[
"Gersande",
"Jian"
],
[
"Em",
"Carmen"
]
]
},
{
"title": "Nested Narratives",
"caretakers": [
"Supi",
"Em",
"Alex"
],
"contributors": [
[
"Miri",
"Mitsa"
],
[
"Alex",
"Supi"
],
[
"Em",
"Kamo"
],
[
"Jian",
"Gr"
],
[
"Gersande",
"Chae"
]
]
},
{
"title": "Sharing methods for diffractive reading",
"caretakers": [
"Kamo",
"Kim",
"Gr"
],
"contributors": [
[
"Em",
"Supi"
],
[
"Miri"
],
[
"Chae"
],
[
"Carmen",
"Jian"
],
[
"Alex",
"Mitsa"
],
[
"Chae",
"Em"
],
[
"Kamo",
"Kim",
"Gr"
]
]
},
{
"title": "[[Unfolding [] implicancies]]",
"caretakers": [
"Em",
"Jian",
"Miri"
],
"contributors": [
[
"Mitsa"
],
[
"Gr"
],
[
"Kamo"
],
[
"Chae"
],
[
"Kim"
],
[
"Supi"
]
]
},
{
"title": "Prologue (Working Title)",
"caretakers": [
"Chae",
"Carmen"
]
}
]
}

95
archive/style.css
Unescape Escape View File

@ -0,0 +1,95 @@
* {
box-sizing: border-box;
}
body,
html {
margin: 0;
background-color: peachpuff;
font-family: Arial, Helvetica, sans-serif;
}
.title {
margin: 24px;
/* position: absolute; */
top: 24px;
left: 24px;
font-size: 48px;
font-weight: normal;
background-color: white;
}
.index {
width: 100%;
height: 100vh;
padding: 0 24px;
margin: 0;
display: flex;
/* justify-content: center; */
align-content: flex-start;
flex-wrap: wrap;
gap: 12px;
list-style: none;
}
ul {
padding: 0;
margin: 0;
}
.index li {
position: relative;
padding: 6px 12px;
background-color: white;
border-radius: 24px;
margin: 0;
}
a {
color: currentColor;
text-decoration: none;
}
.index a:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
li:hover {
transform: scale(1.05);
}
.avatar {
display: inline-block;
width: 50px;
height: 50px;
background-color: white;
text-align: center;
font-size: 18px;
line-height: 50px;
}
.avatar.img {
width: 100%;
height: 100%;
object-fit: cover;
}
.colophon {
position: absolute;
bottom: 24px;
left: 24px;
padding: 24px;
background-color: white;
}
.colophon .caretakers {
margin-bottom: 24px;
}
Write Preview
Loading…
Cancel
Save