A music player that connects to your cloud/distributed storage.
chore: list themes
+48
-22
+17
src/_components/themes.vto
+17
src/_components/themes.vto
···
1
+
<ul>
2
+
{{ for item of items }}
3
+
<li data-url="{{item.url}}" data-name="{{item.title}}">
4
+
<span>{{item.title}}</span>
5
+
<div class="list-description">
6
+
<div class="button-row">
7
+
<a href="themes/l/?url={{encodeURIComponent(item.url)}}" class="button button--bg-twist-1">Try</a>
8
+
<button rel="save" class="button--bg-twist-2">Save</button>
9
+
<button rel="fork" class="button--bg-twist-4">Fork</button>
10
+
</div>
11
+
<div>
12
+
{{item.desc |> md(true)}}
13
+
</div>
14
+
</div>
15
+
</li>
16
+
{{ /for }}
17
+
</ul>
+1
-1
src/facets/index.vto
+1
-1
src/facets/index.vto
-17
src/index.vto
-17
src/index.vto
···
10
10
scripts:
11
11
- index.js
12
12
13
-
# THEMES
14
-
15
-
themes:
16
-
- url: "themes/blur/"
17
-
title: "Blur"
18
-
todo: true
19
-
desc: >
20
-
**A theme with an Apple-inspired playback view.** Features two audio players instead of the usual one.
21
-
- title: "Loader"
22
-
todo: true
23
-
desc: >
24
-
**A theme that loads other themes!** _If you're taking the first steps to customize, checkout the [facets loader](#facets) first!_
25
-
- url: "themes/webamp/"
26
-
title: "Webamp"
27
-
desc: >
28
-
**Winamp 2 + Windows 98**. Uses Webamp as the audio player connected to various Diffuse elements. Also features a desktop-like Windows 98 environment in which you can open "programs" that control the used Diffuse elements.
29
-
30
13
# ELEMENTS
31
14
32
15
configurators:
+30
-4
src/themes/index.vto
+30
-4
src/themes/index.vto
···
1
1
---
2
-
layout: layouts/facet.vto
2
+
layout: layouts/diffuse.vto
3
3
base: ../
4
4
5
5
styles:
···
10
10
11
11
scripts:
12
12
- themes/index.js
13
+
14
+
# THEMES
15
+
16
+
builtIn:
17
+
- url: "themes/blur/"
18
+
title: "Blur"
19
+
todo: true
20
+
desc: >
21
+
**A theme with an Apple-inspired playback view.** Features two audio players instead of the usual one.
22
+
- url: "themes/webamp/"
23
+
title: "Webamp"
24
+
desc: >
25
+
**Winamp 2 + Windows 98**. Uses Webamp as the audio player connected to various Diffuse elements. Also features a desktop-like Windows 98 environment in which you can open "programs" that control the used Diffuse elements.
13
26
---
14
27
15
28
<header>
···
19
32
{{ await comp.diffuse.logo() }}
20
33
</a>
21
34
</div>
35
+
22
36
<p class="construct dither-mask" style="margin-top: 0">
23
37
Themes
24
38
</p>
39
+
25
40
<p>
26
41
Themes are element compositions and provide a traditional browser web application way of
27
42
using them. In other words, pretty much the whole thing, besides your data, lives inside a single browser tab.
···
33
48
Each theme is unique, not just a skin; each one might have a totally different feature set.
34
49
</small>
35
50
</p>
51
+
52
+
<ul class="table-of-contents">
53
+
<li><a href="themes/#built-in">Built-in</a></li>
54
+
</ul>
36
55
</div>
37
56
<div class="dither-mask filler"></div>
38
57
</header>
39
58
<main>
40
-
<p>
41
-
TODO
42
-
</p>
59
+
<!-- BUILT-IN -->
60
+
<div class="columns">
61
+
<section class="flex">
62
+
<h2 id="built-in">Built-in</h2>
63
+
64
+
{{ await comp.list({ items: builtIn }) }}
65
+
</section>
66
+
67
+
<section class="flex"></section>
68
+
</div>
43
69
</main>