List of themes made for the Roundabout software

By using this site, you agree to have cookies stored on your device, strictly for functional purposes, such as storing your session and preferences.

Dismiss

 index.html

View raw Download
text/html • 4.07 kiB
HTML document, ASCII text
        
            
1
<!DOCTYPE html>
2
<html lang="en-US">
3
4
<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
13
<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
<li>Join our Matrix: <a href="https://matrix.to/#/#roundaboutthemeindex:matrix.org">#roundaboutthemeindex:matrix.org</a></li>
26
</ul>
27
<strong>Theme Creation</strong>
28
<p>This section is for resources about theme creation.</p>
29
<ul>
30
<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>
31
<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>
32
</ul>
33
</details>
34
35
<hr />
36
37
<h2 id="theme-list">Theme List</h2>
38
39
<ul id="ThemeList"></ul>
40
<noscript>
41
<p>Unable to load ThemeList. Please consider enabling JavaScript, or upgrading your browser if it cannot support JavaScript.</p>
42
<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>
43
</noscript>
44
45
<template id="ThemeListElement">
46
<li>
47
<table class="table-root">
48
<tr>
49
<th class="theme-name" colspan="2">
50
51
</th>
52
</tr>
53
<tr>
54
<th>
55
Author
56
</th>
57
<td>
58
<a
59
class="author-url"
60
></a>
61
</td>
62
</tr>
63
<tr>
64
<td colspan="2">
65
<a
66
class="download"
67
>Theme CSS</a>
68
</td>
69
</tr>
70
</table>
71
</li>
72
</template>
73
74
<script type="module">
75
const ThemeList = await fetch("themes.xml")
76
.then(res => res.text())
77
.then(txt => {
78
const parser = new DOMParser();
79
const doc = parser.parseFromString(txt, "text/xml");
80
return doc;
81
});
82
83
const ThemeListElementTemplate = document.querySelector("#ThemeListElement");
84
const HTMLThemeList = document.querySelector("#ThemeList");
85
86
const themes = ThemeList.querySelectorAll("theme");
87
for (let index = 0; index < themes.length; index++) {
88
const theme = themes[index];
89
90
const title = theme.querySelector("title").textContent;
91
const author = theme.querySelector("author");
92
const path = theme.querySelector("uri").textContent;
93
94
const ListEl = ThemeListElementTemplate.content.cloneNode(true);
95
ListEl.querySelector(".theme-name").textContent = title;
96
ListEl.querySelector(".download").href = "themes/" + path;
97
98
const Author = ListEl.querySelector(".author-url");
99
Author.href = author.getAttribute("uri");
100
Author.textContent = author.textContent;
101
102
HTMLThemeList.appendChild(ListEl);
103
}
104
</script>
105
</body>
106
107
</html>
108