<!DOCTYPE html>
<html data-bs-theme="light" lang="en-GB">
<head>
    <title>{{ config.module_code }}{% if page.title %} - {{ page.title }}{% endif %}</title>
    <!--- CSS --->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css" rel="stylesheet"
          type="text/css"/>
    <link href="{{ 'css/bootstrap.css' | url }}" rel="stylesheet" type="text/css"/>
    <link href="{{ 'css/custom.css' | url }}" rel="stylesheet" type="text/css"/>
    {%- for path in config.extra_css %}
    <link href="{{ path | url }}" rel="stylesheet">
    {%- endfor %}
    <!--- JavaScript --->
    <script src="https://code.jquery.com/jquery-3.7.1.js"
            integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="
            crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js"
            integrity="sha512-vc58qvvBdrDR4etbxMdlTt4GBQk1qjvyORR2nrsPsFPyrs+/u5c3+1Ct6upOgdZoIl7eq6k3a1UPDSNAQi/32A=="
            crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src=" https://cdn.jsdelivr.net/npm/mermaid@10.9.1/dist/mermaid.min.js "></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
    <script src="{{ 'js/collapse_state.js' | url }}"></script>
    <script src="{{ 'js/diagrams.js' | url }}"></script>
</head>
<body class="bg-body-tertiary">

<!--- Header --->
{% include('header.html') %}

<div class="container-fluid m-0 p-0">
    <div class="row m-3 p-0">
        <!--- Side Bar --->
        {% include('sidebar.html') %}
        <!--- Content --->
        <div class="col-10 p-0 ps-3">
            <div class="col-12 p-3 border bg-content rounded-4">
                {{ page.content }}
            </div>
        </div>
    </div>
</div>

<!--- Footer --->
{% include('footer.html') %}

</body>
{%- for script in config.extra_javascript %}
{{ script | script_tag }}
{%- endfor %}
<script src="{{ 'js/darkmode.js' | url }}"></script>
<script src=" {{ 'js/bootstrap.bundle.min.js' | url }} "></script>
<script>
    $('table').wrap("<div class='table'>")
    hljs.highlightAll();
    mermaid.initialize()
</script>
</html>