forked from
tokono.ma/diffuse
A music player that connects to your cloud/distributed storage.
feat(facets): featured page
+31
-13
+10
-8
src/_components/facets/grid.vto
+10
-8
src/_components/facets/grid.vto
···
1
1
<ul class="grid" style="margin-top: var(--space-lg);">
2
2
{{ for index, item of items }}
3
-
<li data-uri="{{ item.url |> facetOrThemeURI }}" data-name="{{item.title}}">
4
-
<div style="display: flex; align-items: center; gap: var(--space-xs); justify-content: space-between;">
5
-
<a href="{{ item.url |> facetLoaderURL }}" style="padding: var(--space-3xs) 0">
6
-
{{item.title}}
7
-
</a>
8
-
</div>
9
-
<div class="list-description">
10
-
{{ item.desc |> md(true) }}
3
+
<li class="grid-item" data-uri="{{ item.url |> facetOrThemeURI }}" data-name="{{item.title}}">
4
+
<div class="grid-item__contents">
5
+
<div class="grid-item__title">
6
+
<a href="{{ item.url |> facetLoaderURL }}" style="padding: var(--space-3xs) 0">
7
+
{{item.title}}
8
+
</a>
9
+
</div>
10
+
<div class="list-description">
11
+
{{ item.desc |> md(true) }}
12
+
</div>
11
13
</div>
12
14
</li>
13
15
{{ /for }}
+8
-3
src/_data/facets.yaml
+8
-3
src/_data/facets.yaml
···
1
1
- url: "themes/blur/artwork-controller/facet/index.html"
2
2
title: "Blur / Artwork controller"
3
3
category: Playback
4
+
featured: true
4
5
desc: >
5
6
Audio playback controller with an artwork display.
6
7
- url: "facets/tools/auto-queue/index.html"
7
8
title: "Tools / Automatic Queue"
8
9
category: Playback
10
+
featured: true
9
11
desc: >
10
12
Automatically put tracks into the queue.
11
13
- url: "facets/tools/export-import/index.html"
···
26
28
- url: "themes/webamp/browser/facet/index.html"
27
29
title: "Webamp / Browser"
28
30
category: Browsing
31
+
featured: true
29
32
desc: >
30
-
Collection browser + search in a retro, win98, look.
33
+
Collection browser and search.
31
34
- url: "themes/webamp/configurators/input/facet/index.html"
32
35
title: "Webamp / Input Configurator"
33
36
category: Data
37
+
featured: true
34
38
desc: >
35
-
Windows 98 styled input configurator where you can add music sources.
39
+
Add your audio sources.
36
40
- url: "themes/webamp/configurators/output/facet/index.html"
37
41
title: "Webamp / Output Configurator"
38
42
category: Data
43
+
featured: true
39
44
desc: >
40
-
Windows 98 styled output configurator where you can manage your data storage.
45
+
Manage your data storage.
+5
-1
src/facets/index.vto
+5
-1
src/facets/index.vto
···
4
4
title: Featured | Facets | Diffuse
5
5
---
6
6
7
+
<h1 hidden>Featured</h1>
8
+
7
9
<section>
8
-
<h1 hidden>Featured</h1>
10
+
{{ await comp.facets.grid({ id: "featured", items: facets.filter(f => f.featured) }) }}
9
11
</section>
12
+
13
+
<script src="facets/pages/grid-toggle.js" type="module"></script>
+1
-1
src/facets/pages/grid-toggle.js
+1
-1
src/facets/pages/grid-toggle.js