<!doctype html>
<html lang="en">

<head>
  <%- include("template/head.ejs")%>
  <link rel="stylesheet" type="text/css" href="../css/actividades.css" />
  
</head>

<body>
  <%- include("template/header.ejs")%>
  <main class="container-fluid p-0 mb-0">

    <%- include("template/navleft.ejs")%>


    <div class="float-start ms-0 row justify-content-center col-8 col-lg-8 col-md-9 col-sm-9 text-center">

      
      <div class="h-100 m-3 col-11 float-none col-center border border-dark border-2 overflow-hidden"
        style=" background-color: rgba(0,0,255,.1);max-height: 800px;">
        <div class=" row border border-dark border-end-0 border-top-0 border-start-0">
          <div class="col-xl-11 col-lg-10 col-sm-12 col-md-12 col-center pt-4 pb-lg-3 pb-md-3 pb-sm-3 pb-3"><span
              class="fs-5 fw-bold">Ejercicios Preguntas Cortas</span></div>
              <%if (usuario.rol=="Profesor" ){%>
                <a class="btn col-lg-2 col-xl-1 d-none d-lg-block text-end pe-2 pt-1 pb-1"  href="/cortas/crearcortas"> <img class=" bd-placeholder-img bd-placeholder-img-lg featurette image
                  img-fluid mx-auto align-items-end;" src="../img/+remove.png"></a>
                <%}%>
        </div>
        <div class="col-12 overflow-auto mt-3" style="max-height: 500px;">
          <!--Las Preguntas Cortas que han sido creadas por los Profesores-->
          <ul class="mb-3 float-none list-unstyled float-start">
            <% arrayCortas.forEach(cortas=> { %>
              
            <li class="col-6 col-lg-2 col-md-3 col-sm-6 fs-5 float-start mt-3 cuadrado"><a href="/cortas/<%= cortas._id %>"><img class=" col-8 bd-placeholder-img bd-placeholder-img-lg featurette image
              img-fluid mx-3 align-items-end;" src="../img/cortas.jpg"><span class="p-1 overflow-auto"><%= cortas.tema %></span></a></li>
            
                    <% }) %>
          </ul>
        </div>
      </div>

    </div>


    <%- include("template/navright.ejs")%>




  </main>
  <%- include("template/footer.ejs")%>
</body>

</html>