login/index.html

<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Login Page</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.0.2/dist/cyborg/bootstrap.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&amp;display=swap">
    <link rel="stylesheet" href="./style/styles.css">
</head>

<body>

    <div id="app"></div>
    <script type="module">
        import init, { main } from './pkg/login.js'; window.addEventListener('load', async () => { await init(); await main("app"); });
    </script>
    <!-- <div class="container d-md-flex justify-content-md-center align-items-md-center">
        <div class="d-md-flex justify-content-md-center align-items-md-center" style="width: 50vw;height: 50vw;position: absolute;top: 50%;left: 50%;margin-left: -25vw;margin-top: -25vw;">
            <form class="d-md-flex justify-content-center">
                <input class="form-control" type="text" placeholder="username" name="username" autofocus="" autocomplete="on" required="" style="border-right-color: #00000000;">
                <button class="btn btn-primary" type="button">enter</button>
            </form>
        </div>
    </div> -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>