<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="description" content="Capacity Dashboard">
        <meta name="author" content="capacity">
        <title>api data-display</title>
        <!-- favicon -->
        <link rel="shortcut icon" href="{{ url_for('static', path='assets/favicon/favicon-192x192.png')}}">
        <!-- CSS -->
        <!-- bootstrap css -->
        <link rel="stylesheet" type="text/css" href="{{ url_for('node_modules', path='/bootswatch/dist/flatly/bootstrap.min.css') }}">
        <!-- fakeloader css -->
        <link rel="stylesheet" type="text/css" href="{{ url_for('node_modules', path='/jq-fakeloader/css/fakeLoader.css') }}">
    </head>
    <body>
        <!-- javascript -->
        <!-- jquery js -->
        <script type="text/javascript" src="{{ url_for('node_modules', path='/jquery/dist/jquery.min.js') }}"></script>
        <!-- bootstrap js -->
        <script type="text/javascript" src="{{ url_for('node_modules', path='/bootstrap/dist/js/bootstrap.bundle.js') }}"></script>
        <!-- font-awesome js -->
        <script type="text/javascript" src="{{ url_for('node_modules', path='/@fortawesome/fontawesome-free/js/fontawesome.min.js') }}"></script>
        <!-- fakeloader js -->
        <script type="text/javascript" src="{{ url_for('node_modules', path='/jq-fakeloader/js/fakeLoader.js') }}"></script>
        <!-- load scripts -->
        <script type="text/javascript">
        $.fakeLoader({'timeToHide':1200, 'spinner':'spinner4', 'bgColor': '#00003c'});
        </script>
        <script type="text/javascript">$('.toast').toast()</script>
        <!-- begin document -->
        <div class="jumbotron">
            <h1 class="display-4">Hello, world! <i class="fas fa-globe-europe"></i></h1>
            <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
            <hr class="my-4">
            <p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
            <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
        </div>
    </body>
</html>
