tokono.ma
A music player that connects to your cloud/distributed storage.
1<ul>
2 {{ for index, item of items }}
3 <li data-uri="{{ item.url |> facetOrThemeURI }}" data-name="{{item.title}}">
4 <div style="position: relative;">
5 <a href="{{ item.url |> themeLoaderURL }}">
6 {{item.title}}
7 </a>
8 <button
9 class="button--fixed button--transparent"
10 popovertarget="theme-menu-{{id}}-{{index}}"
11 style="anchor-name: --theme-anchor-{{id}}-{{index}}; position: absolute; right: 0; top: 50%; transform: translateY(-50%);"
12 >
13 <i class="ph-fill ph-dots-three-circle"></i>
14 </button>
15 </div>
16 <div class="list-description">
17 {{item.desc |> md(true)}}
18 </div>
19
20 <!-- Dropdown Menu -->
21 <div
22 id="theme-menu-{{id}}-{{index}}"
23 class="dropdown"
24 style="position-anchor: --theme-anchor-{{id}}-{{index}}"
25 popover
26 >
27 <a href="{{ item.url |> themeLoaderURL }}">
28 <span class="with-icon">
29 <i class="ph-fill ph-globe"></i> Open
30 </span>
31 </a>
32 <a rel="save">
33 <span class="with-icon">
34 <i class="ph-fill ph-download"></i> Save
35 </span>
36 </a>
37 <a rel="fork">
38 <span class="with-icon">
39 <i class="ph-fill ph-cursor-text"></i> Edit
40 </span>
41 </a>
42 </div>
43 </li>
44 {{ /for }}
45</ul>