{% extends "base.html" %}
{% block title %}{% endblock %}
{% block content %}
<div class="full-container lattan ">
    <div class="mobile-nav text-white">
        <a href="/back" class="back-button">
            <span class="material-symbols-outlined">
                arrow_back_ios
            </span>
        </a>
        <h4>{{appTitle}}</h4>
    </div>
    <div class="content-section" style="overflow-y: scroll;
    overflow-x: hidden;">
        <div class="result-section-lattan-result">
            <span><b class="text-primary">Question:</b></span>
            <h1 class="mb-4 mt-1">{{q_mm}}</h1>
            <div class="card">
                <div class="card-header">
                    <b class="text-danger">Answer:</b>
                </div>
                <div class="card-body">
                    {{result[0]}}
                </div>
            </div>
        </div>

    </div>
    <div class="preloader">
        <center>
            <h4>Please wait for your answer...</h4>
        </center>
    </div>
</div>
<script>
    $(window).on('load', function () {
        $('body').css('overflow', 'hidden');
        setTimeout(() => {
            $('.preloader').fadeOut('slow');
            $('body').css('overflow', 'unset');
        }, 1000)
    })
</script>
<script>
    $(document).ready(function () {
        var height = $(window).height()
        $('.content-section').css('height', height);
        $('.result-section-lattan').css('height', height);
    })
</script>
{% endblock %}