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

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

  <link rel="stylesheet" type="text/css" href="../css/crearproyectos.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:#eee8cd;max-height: 2200px; min-height: 1200px">
        <div class=" row border border-dark border-end-0 border-top-0 border-start-0">
          <div class="col-center pt-4 pb-md-3 pb-sm-3 pb-3 pb-lg-3">
            <span class="fs-5 fw-bold">Crear Test Único</span>
          </div>

        </div>
        <form action="/testunico/creartestunico" class= "needs-validation formulario" method="POST">
          
        <div class="col-12 mt-3" style="max-height: 2100px;">
          <div>
          <input id="textoPreguntas" name="tema" type="text" class="col-12 col-sm-12 col-md-8 col-lg-9 btn btn-info my-2"
            placeholder="Nombre del Tema"></input>
            
          </div>
          <div class="row col-12 m-0 py-3" id="bloqueunicaopcionfinal"></div> 
          <div class="contenido overflow-auto" style=" background-color:#eee8cd;max-height: 600px; min-height: 500px">
            <fieldset>
            <div class="bloquepregunta border border-dark border-2">
              <!--Se incluye la pregunta del test-->
                  <ul class="mb-3 list-unstyled">
                    <li class="row col-12 m-0 py-3"><input id="textoPreguntas"
                        class="col-12 col-sm-12 col-md-12 col-lg-12 btn btn-success my-2"name="pregunta"
                        placeholder="Escribir la Primera Pregunta"></input></li>
                    
        
        
        <!--Las cuatro posibles respuestas a elegir en el tipo test-->
                        
                    <ul class="mb-3 list-unstyled d-block tipopregunta tipounica">
                      <li class="row col-12 m-0 py-3"><input id="textoRespuesta"
                          class="col-12 col-sm-12 col-md-11 col-lg-11 btn btn-secondary my-2" name="respuesta1"
                          placeholder="Escribe Respuesta Primera"></input><input id="unicaopcion" class="col-12 col-sm-12 col-md-1 col-lg-1"
                          name="unicaopcion" value="a" type="radio"/></li>
                      <li class="row col-12 m-0 py-3"><input id="textoRespuesta"
                          class="col-12 col-sm-12 col-md-11 col-lg-11 btn btn-secondary my-2"name="respuesta2"
                          placeholder="Escribe Respuesta Segunda"></input><input id="unicaopcion" class="col-12 col-sm-12 col-md-1 col-lg-1"
                          name="unicaopcion" value="b" type="radio"/></li>
                      <li class="row col-12 m-0 py-3"><input id="textoRespuesta"
                          class="col-12 col-sm-12 col-md-11 col-lg-11 btn btn-secondary my-2"name="respuesta3"
                          placeholder="Escribe Respuesta Tercera"></input><input id="unicaopcion" class="col-12 col-sm-12 col-md-1 col-lg-1"
                          name="unicaopcion" value="c" type="radio"/></li>
                      <li class="row col-12 m-0 py-3"><input id="textoRespuesta"
                          class="col-12 col-sm-12 col-md-11 col-lg-11 btn btn-secondary my-2"name="respuesta4"
                          placeholder="Escribe Respuesta Cuarta"></input><input id="unicaopcion" class="col-12 col-sm-12 col-md-1 col-lg-1"
                          name="unicaopcion" value="d" type="radio"/></li>
                    </ul>
        
                    
                    
        
                  </ul>
            </div>
          </fieldset>          
          
                
               
          </div>

        </div>
        
          <a class="col-12 col-sm-12 col-md-12 col-lg-4 btn btn-success my-2" href="/testunico" id="volveriniciarsesion">Ir a Temas Cantados</a>
          
          <button class="col-12 col-sm-12 col-md-12 col-lg-3 btn btn-success my-2 px-1 my-2" id="crearenvio" type="submit">Crear</button>
        
      </form>
      <button class="col-12 col-sm-12 col-md-12 col-lg-3 btn btn-success my-2 aniadir">Añadir Pregunta</button>
      </div>

          
           
       

    </div>




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




  </main>
  <%- include("template/footer.ejs")%>
  <!--Permitirá generar diferentes preguntas tipo test-->
  <script src="../js/nuevotestunico.js"></script>
  
</body>

</html>