<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">

        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap" rel="stylesheet">

        <link rel="stylesheet" href="style.css">
        <script src="dist/bundle.js" type="module" defer></script>
    </head>
    <body class="status-waiting">
        <div id="main-layout">
            <header class="status-header">
                <div class="status-header-content"><span>Status:</span> <b id="status">Running</b>
            </header>
            <div id="views-layout">
                <nav id="views-nav">
                    <div>
                        <input type="radio" name="views" value="source-code" id="source-code-radio" checked>
                        <label for="source-code-radio">Source code</label>
                    </div>
                    <div>
                        <input type="radio" name="views" value="code-coverage" id="code-coverage-radio">
                        <label for="code-coverage-radio">Code coverage</label>
                    </div>
                    <div>
                        <input type="radio" name="views" value="flame-graph" id="flame-graph-radio">
                        <label for="flame-graph-radio">Flame graph</label>
                    </div>
                </nav>
                <main id="view">
                    <div id="flame-graph"></div>
                    <pre id="code-coverage"></pre>
                </main>
            </div>
        </div>
    </body>
</html>