1 <!DOCTYPE html>2 <html lang="en">3 <head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Flowtest Editor</title>7 <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">8 </head>9 <body class="bg-gray-100">10 <div class="container mx-auto p-4">11 <form class="space-y-6">12 <!-- Modal de bienvenida -->13 <div id="welcome-modal" class="fixed inset-0 bg-gray-600 bg-opacity-50 flex items-center justify-center hidden">14 <div class="bg-white p-6 rounded-lg shadow-md max-w-lg">15 <h2 class="text-xl font-semibold mb-4">Bienvenido a Flowtest Editor</h2>16 <p class="mb-4">Aquí puedes agregar y editar variables directamente en la lista. Haz clic en el botón "+" para añadir una nueva variable.</p>17 <button type="button" onclick="closeWelcomeModal()" class="bg-blue-500 text-white px-4 py-2 rounded">Entendido</button>18 </div>19 </div>20 21 <!-- Variables Section -->22 <div class="bg-white p-6 rounded-lg shadow-md">23 <h2 class="text-xl font-semibold mb-4">Variables</h2>24 <ul id="variables-list" class="space-y-4 mb-4">25 <!-- Example variable row -->26 <li class="flex space-x-4 items-center">27 <input type="text" placeholder="Variable Name" class="flex-1 p-2 border border-gray-300 rounded" title="Ingrese el nombre de la variable" />28 <input type="text" placeholder="Variable Value" class="flex-1 p-2 border border-gray-300 rounded" title="Ingrese el valor de la variable" />29 <button type="button" onclick="removeVariable(this)" class="text-red-500">x</button>30 </li>31 </ul>32 <button type="button" onclick="addVariable()" class="bg-blue-500 text-white px-4 py-2 rounded flex items-center">33 <span class="mr-2">+</span> Add Variable34 </button>35 </div>36 37 <!-- Save Button -->38 <div class="flex justify-end">39 <button type="button" onclick="saveTest()" class="bg-green-500 text-white px-4 py-2 rounded">Save Test</button>40 </div>41 </form>42 </div>43 44 <script src="script.js"></script>45 </body>46 </html>47 Enlace
El enlace para compartir es: