Abbaye — root_index.html

at bb4e6ed
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <title>{{ project_name }}</title>
        <style>
            *,
            *::before,
            *::after {
                box-sizing: border-box;
                margin: 0;
                padding: 0;
            }
            body {
                font-family:
                    system-ui,
                    -apple-system,
                    BlinkMacSystemFont,
                    "Segoe UI",
                    sans-serif;
                background: #f5efe4;
                color: #2e2416;
                line-height: 1.6;
            }
            header {
                background: #3d5732;
                color: #f0e8d8;
                padding: 1.5rem 2rem;
            }
            header h1 {
                font-size: 1.75rem;
                font-weight: 700;
                letter-spacing: 0.01em;
            }
            main {
                max-width: 760px;
                margin: 2.5rem auto;
                padding: 0 1.5rem;
            }
            h2 {
                font-size: 0.75rem;
                font-weight: 700;
                color: #7a6855;
                text-transform: uppercase;
                letter-spacing: 0.12em;
                margin-bottom: 1rem;
            }
            ul {
                list-style: none;
            }
            li {
                display: flex;
                align-items: center;
                gap: 0.75rem;
                padding: 0.75rem 1rem;
                background: #fdfaf5;
                border: 1px solid #c9baa8;
                border-radius: 5px;
                margin-bottom: 0.5rem;
            }
            li:hover {
                border-color: #a06020;
            }
            a.version-link {
                font-size: 1.05rem;
                font-weight: 500;
                color: #7a4429;
                text-decoration: none;
            }
            a.version-link:hover {
                text-decoration: underline;
                color: #a05a3a;
            }
            .badge-latest {
                font-size: 0.65rem;
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 0.07em;
                background: #a06020;
                color: #fdf6ec;
                padding: 0.2em 0.6em;
                border-radius: 999px;
            }
        </style>
    </head>
    <body>
        <header>
            <h1>{{ project_name }}</h1>
        </header>
        <main>
            <h2>Versions</h2>
            <ul>
                {% for version in versions %}
                <li>
                    <a class="version-link" href="{{ version }}/"
                        >{{ version }}</a
                    >
                    {% if loop.first %}<span class="badge-latest">latest</span
                    >{% endif %}
                </li>
                {% endfor %}
            </ul>
        </main>
    </body>
</html>