Quiz Management - Copy this React, Tailwind Component to your project
Genera esta interfaz en español ### **Propósito:** Gestionar cuestionarios para evaluar a los estudiantes. ### **Elementos:** 1. **Encabezado:** Título: "Gestión de Cuestionarios." Botón "Crear Cuestionario" (abre un formulario modal). 2. **Lista de Cuestionarios:** Tabla con: Nombre del cuestionario. Módulo asociado. Estado (Publicado/Borrador). Fecha de creación. Botones: "Editar." "Eliminar." 3. **Formulario Modal para Crear/Editar Cuestionarios:** Campos: Título del cuestionario. Módulo asociado. Preguntas (sección dinámica): Tipo de pregunta: Opción múltiple, selección única, respuesta corta. Opciones de respuesta (editable para opción múltiple). Botón "Guardar." 4. **Resultados del Cuestionario:** Vista que muestra las calificaciones de los estudiantes: Nombre del estudiante. Puntuación obtenida. Tiempo dedicado. usa esta paleta de colores ### **Colores Primarios (Uso Principal)** **Azul Claro (#4A90E2):** Representa confianza, estabilidad y calma. Ideal para encabezados, botones principales y elementos destacados. **Blanco (#FFFFFF):** Fondo principal para mantener un diseño limpio y espacioso. ### **Colores Secundarios (Soporte y Contraste)** **Gris Claro (#F5F5F5):** Para fondos secundarios (paneles, tarjetas) y separación visual. **Gris Medio (#9E9E9E):** Para textos secundarios o explicaciones. ### **Colores de Resaltado (Llamar la Atención)** **Verde (#4CAF50):** Indicadores de progreso o estados positivos (completado, éxito). **Amarillo (#FFC107):** Para advertencias o información importante. **Rojo (#F44336):** Para errores o estados críticos. ### **Colores para Acciones e Interactividad** **Naranja (#FF9800):** Botones de llamada a la acción secundaria o elementos interactivos destacados. **Cian (#00BCD4):** Para enlaces o detalles interactivos relacionados con actividades. ### **Colores para Dimensiones del Aprendizaje (Codificación Visual)** Cada dimensión puede tener un color asociado para facilitar la identificación rápida: **Procesamiento:** Azul (#4A90E2). **Percepción:** Verde (#4CAF50). **Entrada de Información:** Amarillo (#FFC107). **Comprensión:** Naranja (#FF9800). **Interacción Social:** Cian (#00BCD4).
