forked from
tokono.ma/diffuse
A music player that connects to your cloud/distributed storage.
1<style>
2 @import "./styles/base.css";
3 @import "./vendor/@phosphor-icons/web/bold/style.css";
4 @import "./vendor/@phosphor-icons/web/fill/style.css";
5 @import "./styles/diffuse/facet.css";
6
7 @layer base, diffuse;
8
9 input[type="file"] {
10 background: none;
11 border: none;
12 padding: 0;
13 width: auto;
14 }
15
16 .status {
17 font-size: var(--fs-xs);
18 }
19
20 .status--success {
21 color: var(--accent);
22
23 @media (prefers-color-scheme: dark) {
24 color: var(--accent-twist-4);
25 }
26 }
27
28 .status--error {
29 color: var(--accent-twist-5);
30
31 @media (prefers-color-scheme: dark) {
32 color: var(--accent-twist-3);
33 }
34 }
35</style>
36
37<main>
38 <div class="facet__left">
39 <div>
40 <a href="./dashboard/" class="diffuse-logo-container">
41 <svg viewBox="0 0 902 134" width="160">
42 <title>Diffuse</title>
43 <use
44 xlink:href="images/diffuse-current.svg#diffuse"
45 href="images/diffuse-current.svg#diffuse"
46 ></use>
47 </svg>
48 </a>
49 </div>
50 <h1>V3.x Import</h1>
51 <p>
52 Import data from the previous version of Diffuse. Upload the snapshot JSON file you exported.
53 </p>
54 </div>
55
56 <div class="facet__right">
57 <div>
58 <input id="file" type="file" accept=".json,application/json" />
59 </div>
60
61 <hr />
62
63 <p class="button-row">
64 <button id="import-favourites" disabled>
65 <i class="ph-fill ph-star"></i>
66 <span>Import favourites</span>
67 </button>
68 </p>
69 <p class="button-row">
70 <button id="import-playlist-items" disabled>
71 <i class="ph-bold ph-playlist"></i>
72 <span>Import playlist items</span>
73 </button>
74 </p>
75
76 <div id="status" class="status" hidden></div>
77 </div>
78</main>
79
80<script type="module" src="facets/data/v3-import/index.inline.js"></script>