slint/examples/gallery/index.html at master · cppdev123/slint · 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
<!DOCTYPE html>

<!-- Copyright © SixtyFPS GmbH <info@slint-ui.com> -->
<!-- SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-commercial -->

<html>
<!--
    This is a static html file used to display the wasm build.
    In order to generate the build
     - uncomment the #wasm# lines in Cargo.toml
     - Run `wasm-pack build --release --target web` in this directory.
  -->

<head>
  <meta charset="UTF-8">
  <title>Slint Widget Gallery Demo (Web Assembly version)</title>
  <link rel="stylesheet" href="https://slint-ui.com/css/demos-v1.css">
</head>

<body>
  <h1>Slint Gallery</h1>
  <p>This is the <a href="https://slint-ui.com">Slint</a> UI Widget Gallery Demo compiled to WebAssembly. It
    demonstrates
    different re-usable graphical
    elements.</p>
  <div id="spinner" style="position: relative;">
    <div class="spinner">Loading...</div>
  </div>
  <canvas id="canvas" width="640" height="480"></canvas>
  <p class="links">
    <a href="https://github.com/slint-ui/slint/blob/master/examples/gallery/gallery.slint">
      View Source Code on GitHub</a> -
    <a
      href="https://slint-ui.com/editor?load_url=https://raw.githubusercontent.com/slint-ui/slint/master/examples/gallery/gallery.slint">
      Edit in the online code editor
    </a>
  </p>
  <script type="module">
    import init from './pkg/gallery.js';
    init().finally(() => {
      document.getElementById("spinner").remove();
    });
  </script>
</body>

</html>