HTML document, ASCII text
1
<!DOCTYPE html>
2
<html lang="en-US">
3
<head>
5
<title>Unofficial Roundabout Theme Index</title>
6
<link rel="stylesheet" href="style.css" />
7
</head>
8
<body>
10
<hgroup role="group">
11
<h1><sub>Unofficial</sub> Roundabout Theme Index</h1>
12
<p class="subtitle">The unofficial hub for Roundabout Themes</p>
13
</hgroup>
14
15
<p>Don't know how to install a theme? See <a href="install.html">install.html</a></p>
16
<ul id="ThemeList"></ul>
18
<template id="ThemeListElement">
20
<li>
21
<table class="table-root">
22
<tr>
23
<th class="theme-name" colspan="2">
24
25
</th>
26
</tr>
27
<tr>
28
<th>
29
Author
30
</th>
31
<td>
32
<a
33
class="author-url"
34
></a>
35
</td>
36
</tr>
37
<tr>
38
<td colspan="2">
39
<a
40
class="download"
41
>Theme CSS</a>
42
</td>
43
</tr>
44
</table>
45
</li>
46
</template>
47
<script type="module">
49
const ThemeList = await fetch("themes.xml")
50
.then(res => res.text())
51
.then(txt => {
52
const parser = new DOMParser();
53
const doc = parser.parseFromString(txt, "text/xml");
54
return doc;
55
});
56
const ThemeListElementTemplate = document.querySelector("#ThemeListElement");
58
const HTMLThemeList = document.querySelector("#ThemeList");
59
const themes = ThemeList.querySelectorAll("theme");
61
for (let index = 0; index < themes.length; index++) {
62
const theme = themes[index];
63
const title = theme.querySelector("title").textContent;
65
const author = theme.querySelector("author");
66
const path = theme.querySelector("uri").textContent;
67
const ListEl = ThemeListElementTemplate.content.cloneNode(true);
69
ListEl.querySelector(".theme-name").textContent = title;
70
ListEl.querySelector(".download").href = "themes/" + path;
71
const Author = ListEl.querySelector(".author-url");
73
Author.href = author.getAttribute("uri");
74
Author.textContent = author.textContent;
75
76
HTMLThemeList.appendChild(ListEl);
77
}
78
</script>
79
</body>
80
</html>
82