svi
/
goarch


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
							<!-- Индексная страница сайта -->

<html lang="ru">

    <head>
        <meta charset="utf-8">
        <title>test_arch</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="/static/css/bootstrap.min.css" rel="stylesheet">
        <script src="/static/js/htmx.min.js"></script>
    </head>

    <body class="d-flex flex-column vh-100 overflow-hidden" hx-boost="true">
        <header class="shadow-sm container-fluid">
            <div class="row">
                <div id="header" class="col-2">
                    <b>GoArch</b><br><strong id="mode"></strong>
                </div>
                <div id="link" class="col-2">
                    <button class="btn btn-primary" hx-get="/api/use_case" hx-target="#mode"
                        hx-trigger="load click">Варианты использования</button>
                </div>
                <div class="col-1">
                    <a href="/monitor" class="btn btn-primary" hx-boost="false">Монитор</a>
                </div>
            </div>
        </header>

        <!--
        <div id="content" class="container-fluid sticky-top">

        </div>
        -->

        <!-- 2. ОСНОВНОЙ КОНТЕНТ (Скроллится)

        <div class="container-fluid px-0 mt-5">
            <div class="row g-1">
                <div class="col-2">
                    <textarea name="text" class="text-start w-100" rows="40" hx-post="/arch" hx-target="#picture"
                        hx-trigger="keyup change delay:0.5s">[]</textarea>
                </div>
                <div class="col-10">
                    <div id="picture"></div>
                </div>
            </div>
        </div>

        -->
        <main class="flex-grow-1 overflow-auto px-0">
            <div class="container-fluid px-0 h-100">
                <div class="row g-4 m-0 h-100"> <!-- m-0 убирает лишний горизонтальный скролл от row -->
                    <div class="col-2 d-flex">
                        <!-- rows="20" чтобы точно появился скролл для теста -->
                        <textarea name="text" class="form-control w-100 flex-grow-1" rows="20" hx-post="/api/arch"
                            hx-target="#picture" hx-trigger="keyup change delay:0.5s" placeholder="YAML"
                            style="resize: none;"></textarea>
                    </div>
                    <div class="col-10">
                        <div id="picture" class="w-100 h-100" hx-vals='js:{
                                "w": document.getElementById("picture").offsetWidth,
                                "h": document.getElementById("picture").offsetHeight}' hx-post="/api/canvas_size"
                            hx-trigger="every 250ms" hx-target="#debug-log">
                        </div>
                    </div>
                </div>
            </div>
        </main>


        <!-- 3. ПОДВАЛ (Всегда снизу)
        <div id="footer" class="sticky-bottom">...</div>
        -->
        <footer class="bg-dark text-white py-2">
            <div class="container-fluid text-center">
                <div class="row">
                    <div class="col-2"><small>Футер (не двигается)</small></div>
                    <div id="debug-log" class="col-10 text-start fs-6 fw-light"></div>
                </div>

            </div>
        </footer>
        <script src="/static/js/bootstrap.bundle.min.js"></script>
    </body>

</html>