multi-cursor/index.html at main · claudio-silva/multi-cursor · GitHub

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="/src/styles.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Multi Cursor</title>
    <script type="module" src="/src/main.ts" defer></script>
  </head>
  <body>
    <div class="app">
      <header class="header">
        <div class="brand">
          <img class="brand-icon" src="/assets/logo.png" alt="" width="48" height="48" />
          <div>
            <h1>Multi Cursor</h1>
            <p class="subtitle">Account &amp; Environment Manager</p>
          </div>
        </div>
        <div id="status" class="status idle">Checking…</div>
      </header>

      <section class="panel">
        <div class="panel-head">
          <label for="env-select">Environment</label>
          <div class="btn-row">
            <button type="button" id="env-new" class="ghost">New</button>
            <button type="button" id="env-rename" class="ghost">Rename</button>
            <button type="button" id="env-delete" class="danger ghost">Delete</button>
          </div>
        </div>
        <select id="env-select"></select>
        <p id="env-disk" class="env-disk muted">Disk usage: —</p>
      </section>

      <section class="panel grow">
        <div class="panel-head">
          <span>Accounts</span>
          <div class="btn-row">
            <button type="button" id="acct-new" class="ghost">New</button>
            <button type="button" id="acct-delete" class="danger ghost">Delete</button>
          </div>
        </div>
        <ul id="account-list" class="account-list"></ul>
      </section>

      <p id="error" class="error hidden"></p>
      <p id="success" class="success hidden"></p>
      <p id="hint" class="hint hidden"></p>
      <div id="progress" class="progress hidden" role="progressbar" aria-valuemin="0" aria-valuemax="100">
        <div id="progress-label" class="progress-label"></div>
        <div class="progress-track">
          <div id="progress-bar" class="progress-bar"></div>
        </div>
      </div>

      <footer class="footer">
        <button type="button" id="launch" class="primary launch">Launch</button>
      </footer>
    </div>

    <div id="modal" class="modal hidden" role="dialog" aria-modal="true" aria-labelledby="modal-title">
      <div class="modal-card">
        <h2 id="modal-title" class="modal-title"></h2>
        <p id="modal-message" class="modal-message hidden"></p>
        <a id="modal-link" class="modal-link hidden" href="#" rel="noopener noreferrer"></a>
        <input id="modal-input" class="modal-input hidden" type="text" autocomplete="off" />
        <label id="modal-check-wrap" class="check hidden">
          <input type="checkbox" id="modal-check" />
          <span id="modal-check-label"></span>
        </label>
        <div class="modal-actions">
          <button type="button" id="modal-cancel" class="ghost">Cancel</button>
          <button type="button" id="modal-confirm" class="primary">OK</button>
        </div>
      </div>
    </div>
  </body>
</html>