index.html

<!doctype html>
<html lang="en-GB">

<head>
  <title>index.html</title>
  <meta charset="utf-8">
  <style>
    body { background: #fafafa; }
    happ-ui { width: 45%; height: 45%; }

    #demo_rf {
      color: black;
      padding: 0.5em 1em;
      font-size: 16px;
      font-family: "Lucida Console", Monaco, monospace;
    }
  </style>
</head>

<body>

  <div id='demo_rf'>
    <a href='./index_rf.html'>Demo Dragme and Contactsheet (RF)</a>
    <p></p>
  </div>

  <div id="demo">
    <happ-ui title="Color Wheel 1"
             sentir="0.75" connaitre="0.75" comprendre="0.75"></happ-ui>
    <happ-ui title="Color Wheel 2"
             sentir="0.8" connaitre="0.45" comprendre="0.57"></happ-ui>
  </div>

  <script type="module">
    import './happ-ui.js';
  </script>

</body>
</html>