generate.html 2.49 KB
<html lang="en">

<head>
    <script src="./Scripts/construct.js"></script>
    <meta charset="UTF-8">
    <meta content='width=device-width, initial-scale=1' name='viewport' />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./Style/Templates.css">
    <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">
    <title>Generador de Formularios</title>
    <link rel="icon" href="./Assets/ICONO ANACSOFT 48 SIN TRASNSF.png"
        type="image/png">
</head>

<body>
    <h1> Generador de Formularios</h1>
    <h3>Para comenzar por favor cree un nuevo tab</h3>
    <br>
    <div id="tabs"></div>
    <div style="text-align: center;">
        <button class="NewTabButton" onclick="addTab(document.getElementById('tabs'))">
            +
        </button>
    </div>
    <h3 id="ContinuarText">Cuando se encuentre conforme con el formulario presione Continuar</h3>
    <button id="ContinuarButton"> Continuar </button>
</body>

<!-- templates -->
<template id="tabTemplate">
    <div class="TabCards">
        <input type="number" class="TabNumber" value="01">
        <input class="TabTitle" placeholder="Titulo del Tab" type="text">
        <button class="RemoveTabButton" onclick="removeTab(this)">
                X
    </button>
        <br>
        <div style="text-align: center;">
            <button class="NewInputButton" onclick="addField(this)">
                +
            </button>
        </div>
    </div>
</template>

<template id="fieldTemplate">
    <div class="InputContainer">
        
        <input type="number" class="InputNumber" value="01">
        <input type="text" id="Titulo" class="Input" placeholder="Título">
        
        <select name="input" class="Input">
            <option disabled selected value="">Input</option>
            <option id="text" value="text">Texto</option>
            <option id="number" value="number">Numero</option>
            <option id="mail" value="mail">Mail</option>
            <option id="password" value="password">Contraseña</option>
            <option id="date" value="date">Fecha</option>
            <option id="time" value="time">Hora</option>
            <option id="textarea" value="textarea">Párrafo</option>
            <option id="checkbox" value="checkbox">Selección</option>
        </select>
        Obligatorio : <input type="checkbox">
        <button class="RemoveInputButton" onclick="removeField(this)">
            -
        </button>
    </div>
</template>


</html>