{% extends "!layout.html" %}

{% block docs_navbar %}
<div class="container-fluid px-0 vw-100">
    <div style="background: linear-gradient(to right, rgba(122, 218, 250, 0.7), rgba(176, 228, 245, 0.5), rgba(176, 228, 245, 0.5), rgba(225, 246, 252, 0.5), rgba(225, 246, 252, 0.5), rgba(232, 248, 252, 0.5));">
        <div class="container py-4">
            {# Mobile version #}
            <div class="d-block d-md-none">
                <div class="d-flex justify-content-center align-items-center">
                    <div class="me-3">
                        <img src="{{ pathto('_static/relife.gif', 1) }}" alt="ReLife Logo" style="max-width: 40vw;">
                    </div>
                    <div class="d-flex flex-column">
                        <a href="https://pypi.org/project/relife/" class="btn shadow mb-2"
                           style="background-color: rgb(50, 164, 220); color: white;">
                            Download
                        </a>
                        <span class="text-muted">{{ version }} release</span>
                    </div>
                </div>
            </div>

            {# Desktop version #}
            <div class="d-none d-md-block">
                <div class="d-flex align-items-center justify-content-between mb-4">
                    <div class="d-flex align-items-center">
                        <div class="me-4">
                            <img src="{{ pathto('_static/relife.gif', 1) }}" alt="ReLife Logo" style="max-width: 30vw;">
                        </div>
                        <div class="d-flex flex-column">
                            <a href="https://pypi.org/project/relife/" class="btn shadow mb-2"
                               style="background-color: rgb(50, 164, 220); color: white;">
                                Download
                            </a>
                            <span class="text-muted">{{ version }} release</span>
                        </div>
                    </div>

                    <div class="mx-4" style="flex: 1;">
                        <p class="mb-2 fs-6">ReLife is an <b>open source</b> Python library to guide decision-making in <b>asset management</b>. It is based on the <b>reliability theory</b>.</p>
                    </div>

                    <div>
                        <img src="{{ pathto('_static/rte.png', 1) }}" alt="RTE Logo" style="max-width: 30vw;">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock docs_navbar %}


{% block docs_main %}
<div class="bd-content">
    <div class="bd-article-container">
        <article class="bd-article">

            {# Search bar section #}
            <div class="container mt-4 mb-4">
                <div class="row justify-content-center">
                    <div class="col-md-6">
                        <form class="bd-search" action="{{ pathto('search') }}" method="get">
                            <div class="input-group">
                                <input type="search" class="form-control" name="q" placeholder="Search the documentation..." aria-label="Search">
                                <button class="btn" type="submit">
                                    <i class="fas fa-search"></i>
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>


            {# Documentation sections table #}
            <div class="container mt-4">
                <h5 class="mb-4">Content of the documentation</h5>
                <table class="table">
                    <tbody style="background-color: white;">
                        <tr>
                            <td style="width: 25%; background-color: white;">
                                <a href="{{ pathto('installation') }}">Installation</a>
                            </td>
                            <td style="width: 75%; background-color: white;">
                                How to install ReLife on your machine.
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color: white;">
                                <a href="{{ pathto('basic/index') }}">Basics</a>
                            </td>
                            <td style="background-color: white;">
                                ReLife absolute basics for beginners.
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color: white;">
                                <a href="{{ pathto('user/index') }}">User guide</a>
                            </td>
                            <td style="background-color: white;">
                                Overview and explanations of ReLife important features.
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color: white;">
                                <a href="{{ pathto('api/index') }}">API</a>
                            </td>
                            <td style="background-color: white;">
                                The exposed ReLife API, a currated list of objects public interfaces.
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color: white;">
                                <a href="{{ pathto('developer/index') }}">For developers</a>
                            </td>
                            <td style="background-color: white;">
                                Under-the-hood documentation for contributors.
                            </td>
                        </tr>
<!--                        <tr>-->
<!--                            <td style="background-color: white;">-->
<!--                                <a href="{{ pathto('learn/index') }}">Learn</a>-->
<!--                            </td>-->
<!--                            <td style="background-color: white;">-->
<!--                                Learn more about reliability and renewal theory-->
<!--                            </td>-->
<!--                        </tr>-->
<!--                        <tr>-->
<!--                            <td style="background-color: white;">-->
<!--                                <a href="{{ pathto('contributor_guide/index') }}">Contributor's guide</a>-->
<!--                            </td>-->
<!--                            <td style="background-color: white;">-->
<!--                                Information about the conception of ReLife and how to contribute-->
<!--                            </td>-->
<!--                        </tr>-->
<!--                        <tr>-->
<!--                            <td style="background-color: white;">-->
<!--                                <a href="{{ pathto('future/index') }}">Future improvements</a>-->
<!--                            </td>-->
<!--                            <td style="background-color: white;">-->
<!--                                Works that are in progress-->
<!--                            </td>-->
<!--                        </tr>-->
                    </tbody>
                </table>
            </div>


            {# Grid section #}
            <div class="sd-container-fluid sd-sphinx-override sd-mb-4 mt-5">
                <h5 class="mb-4">About ReLife</h5>
                <div class="sd-row row-eq-height sd-row-cols-1 sd-row-cols-xs-1 sd-row-cols-sm-1 sd-row-cols-md-3 sd-g-2">
                    <div class="sd-col d-flex">
                        <div class="sd-card bg-white w-100">
                            <div class="sd-card-body p-2" style="display: block;">
                                <h6 class="sd-card-title" style="margin-top: 0;">Statistical expertise</h6>
                                <p style="text-align: left; margin-bottom: 0;">ReLife implements statistical models of the reliability theory.</p>
                            </div>
                        </div>
                    </div>
                    <div class="sd-col d-flex">
                        <div class="sd-card bg-white w-100">
                            <div class="sd-card-body p-2" style="display: block;">
                                <h6 class="sd-card-title" style="margin-top: 0;">Open science</h6>
                                <p style="text-align: left; margin-bottom: 0;">ReLife is open source and tries to gather the best of scientific knowledge to conduct appropriate asset management.</p>
                            </div>
                        </div>
                    </div>
                    <div class="sd-col d-flex">
                        <div class="sd-card bg-white w-100">
                            <div class="sd-card-body p-2" style="display: block;">
                                <h6 class="sd-card-title" style="margin-top: 0;">Easy to use (or trying to be)</h6>
                                <p style="text-align: left; margin-bottom: 0;">ReLife is coded in Python and we hope that its design makes it accessible for many users.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {# Supporters section #}
            <div class="container mb-5">
                <h6 class="mb-4">ReLife users</h6>
                <div class="row row-cols-2 row-cols-md-4 g-4 justify-content-center align-items-center">
                    <div class="col d-flex justify-content-center align-items-center" style="height: 100px;">
                        <img src="{{ pathto('_static/company1.png', 1) }}" alt=""
                             style="max-width: 150px; max-height: 80px; width: auto; height: auto; filter: grayscale(100%); opacity: 0.7;">
                    </div>
                    <div class="col d-flex justify-content-center align-items-center" style="height: 100px;">
                        <img src="{{ pathto('_static/rte.png', 1) }}" alt="RTE"
                             style="max-width: 150px; max-height: 80px; width: auto; height: auto; filter: grayscale(100%); opacity: 0.7;">
                    </div>
                    <div class="col d-flex justify-content-center align-items-center" style="height: 100px;">
                        <img src="{{ pathto('_static/artelys.png', 1) }}" alt="Artelys"
                             style="max-width: 150px; max-height: 80px; width: auto; height: auto; filter: grayscale(100%); opacity: 0.7;">
                    </div>
                    <div class="col d-flex justify-content-center align-items-center" style="height: 100px;">
                        <img src="{{ pathto('_static/company2.png', 1) }}" alt=""
                             style="max-width: 150px; max-height: 80px; width: auto; height: auto; filter: grayscale(100%); opacity: 0.7;">
                    </div>
                </div>
            </div>

        </article>
    </div>
</div>
{% endblock docs_main %}