HTML document, ASCII text
1
<!DOCTYPE html>
2
<html lang="en-US">
3
<head>
5
<title>Roundabout Theme Index</title>
6
<link rel="stylesheet" href="style.css" />
7
<meta charset="UTF-8">
8
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9
<meta http-equiv="X-UA-Compatible" content="ie=edge">
10
<link rel="icon" href="favicon.ico" />
11
</head>
12
<body>
14
<hgroup role="group">
15
<h1>Roundabout Theme Index</h1>
16
<p class="subtitle">The hub for Roundabout Themes</p>
17
</hgroup>
18
19
<details class="resources">
20
<summary>Help and Resources</summary>
21
<ul>
22
<li>Don't know how to install a theme? See <a href="install.html">install.html</a></li>
23
<li>Want your own theme here? See <a href="submit.html">submit.html</a></li>
24
<li>Source code available at <a href="https://roundabout-host.com/steve0greatness/ThemeIndex">roundabout-host.com/steve0greatness/ThemeIndex</a></li>
25
</ul>
26
<strong>Theme Creation</strong>
27
<p>This section is for resources about theme creation.</p>
28
<ul>
29
<li>Roundabout default theme: <a href="https://roundabout-host.com/roundabout/roundabout/tree/master/static/efficient-ui/THEME.css">roundabout-host.com/roundabout/roundabout/tree/master/static/efficient-ui/THEME.css</a></li>
30
<li>Roundabout stylesheet: <a href="https://roundabout-host.com/roundabout/roundabout/tree/master/static/style.css">roundabout-host.com/roundabout/roundabout/tree/master/static/style.css</a></li>
31
</ul>
32
</details>
33
<hr />
35
<h2 id="theme-list">Theme List</h2>
37
<ul id="ThemeList"></ul>
39
<noscript>
40
<p>Unable to load ThemeList. Please consider enabling JavaScript, or upgrading your browser if it cannot support JavaScript.</p>
41
<p>If you are unable or unwilling to do these things, you can view the plain-text list at <a href="themes.xml">themes.xml</a></p>
42
</noscript>
43
<template id="ThemeListElement">
45
<li>
46
<table class="table-root">
47
<tr>
48
<th class="theme-name" colspan="2">
49
50
</th>
51
</tr>
52
<tr>
53
<th>
54
Author
55
</th>
56
<td>
57
<a
58
class="author-url"
59
></a>
60
</td>
61
</tr>
62
<tr>
63
<td colspan="2">
64
<a
65
class="download"
66
>Theme CSS</a>
67
</td>
68
</tr>
69
</table>
70
</li>
71
</template>
72
<script type="module">
74
const ThemeList = await fetch("themes.xml")
75
.then(res => res.text())
76
.then(txt => {
77
const parser = new DOMParser();
78
const doc = parser.parseFromString(txt, "text/xml");
79
return doc;
80
});
81
const ThemeListElementTemplate = document.querySelector("#ThemeListElement");
83
const HTMLThemeList = document.querySelector("#ThemeList");
84
const themes = ThemeList.querySelectorAll("theme");
86
for (let index = 0; index < themes.length; index++) {
87
const theme = themes[index];
88
const title = theme.querySelector("title").textContent;
90
const author = theme.querySelector("author");
91
const path = theme.querySelector("uri").textContent;
92
const ListEl = ThemeListElementTemplate.content.cloneNode(true);
94
ListEl.querySelector(".theme-name").textContent = title;
95
ListEl.querySelector(".download").href = "themes/" + path;
96
const Author = ListEl.querySelector(".author-url");
98
Author.href = author.getAttribute("uri");
99
Author.textContent = author.textContent;
100
101
HTMLThemeList.appendChild(ListEl);
102
}
103
</script>
104
</body>
105
</html>
107