-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathexamples.html
54 lines (51 loc) · 1.53 KB
/
examples.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<html>
<head>
<title>webring-widget</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="styles/widget.css" />
<link rel="stylesheet" href="styles/table.css" />
<link rel="stylesheet" href="styles/list.css" />
<link rel="stylesheet" href="styles/site.css" />
</head>
<body>
<h1>webring-widget examples</h1>
<h2>widget script</h2>
<webring-widget>
<script type="module" src="scripts/widget.js" defer></script>
</webring-widget>
<h2>plain HTML widget</h2>
<webring-widget>
<span id="title">
<a href="https://bentovid.com/webring">BentoVid Webring </a>
</span>
<div id="links">
<a
id="previous"
href="https://reisir.github.io/webring-widget/previous"
class="arrow"
>←</a
>
<span id="current">YOUR SITE NAME HERE</span>
<a
id="next"
href="https://reisir.github.io/webring-widget/next"
class="arrow"
>→</a
>
</div>
</webring-widget>
<h2>site list</h2>
<ul id="webring-list">
<script type="module" src="scripts/list.js" defer></script>
</ul>
<h2>site table</h2>
<table id="webring-table">
<script type="module" src="scripts/table.js" defer></script>
</table>
<h2>random site button</h2>
<div>
<button id="random-site">Random Site</button>
<script type="module" src="./scripts/random.js" defer></script>
</div>
</body>
</html>