sloopste/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Sloopste</title>
    <style>
        table {
            border-collapse: collapse;
        }
        td {
            width: 30px;
            height: 30px;
            border: 1px solid black;
            position: relative;
        }
        .edge {
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            pointer-events: none;
            z-index: 1;
            text-align: center;
            vertical-align: middle;
        }
        .edge.used {
            background-color: black;
        }
        .horizontal {
            width: 39px;
            height: 6px;
            left: 13px;
            top: 13px;
        }
        .vertical {
            width: 6px;
            height: 39px;
            left: 13px;
            top: 13px;
        }
    </style>
    <script src="script.js"></script>
</head>
<body>
    <h2 id="level">Use "Load puzzles" with a level string</h2>
    <h3 id="info"></h3>
    <h3 id="time"></h3>
    <div id="levelSelect" style="display: none;"></div>
    <table id="gridTable" style="display: none;"></table>
</body>
</html>