<!doctype html>
<html lang="en" style="border: 0 solid">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>QRCode Share</title>
    <style>
      canvas {
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
      }

      body {
        background-color: #eceae7;
      }
    </style>
  </head>
  <body>
    <script crossorigin src="/themes/howiehz-higan/assets/lib/qrious/qrious.min.js" integrity="sha384-qkxtUqTAlrqKgvVg+UxHKpqGZZS5n838/QQeuxqJ3VeoD7w+2OOGMA2GS4UpR1IZ"></script>
    <script>
      document.addEventListener("DOMContentLoaded", function () {
        const params = new URLSearchParams(window.location.search);
        const url = params.get("url");
        const size = params.get("size");
        new QRious({
          element: document.getElementById("qrcode-canvas"),
          size: size,
          value: url,
          background: "#eceae7",
        });
      });
    </script>
    <canvas id="qrcode-canvas"></canvas>
  </body>
</html>
