{% extends 'base.html' %}

{% block head %}{% endblock %}


{% block body %}
<div class="first banner">
    <h1 class="Jemah">Jemah 2</h1>
    <p class="subtitle">Save hours making flashcard <br> and study more efficiently</p>
</div>

<form class="input-container" action="/product-description" method="post">

    <div class="mb-3">
      <textarea class="form-control" name="productDescription" rows="10" cols="50" placeholder="Pepsin is an endopeptidase that breaks down proteins into smaller peptides..." ></textarea>
    </div>

    <script>

        


    </script>

    <div class="mb-3">
        <button type="submit" class="btn btn-primary btn-lg">Generate Flashcard</button>
    </div>

</form>

<div class="flashcard-container"><h3>Flashcard</h3></div>

<div class="mb-3"><p>{{openAiAnswer}}</p></div>

{% endblock %}