EC
Esteban Christopher0312

Temperature Monitoring Dashboard - Copy this Html, Tailwind Component to your project

Necesito que desarrolles una página web HTML con CSS y JavaScript para un sistema de trazabilidad de neveras biomédicas. La página debe tener una estructura clara y el código debe contener comentarios explicativos para que cualquier persona pueda entender y modificar las variables, secciones y funcionalidades. Estructura y requisitos: 1. Parte superior: Debe mostrar el nombre de la empresa. Debe haber un comentario que indique dónde cambiar el nombre. 2. Barra de búsqueda: Debajo del nombre, debe haber una barra de búsqueda. Comentarios en el código deben indicar cómo modificar el placeholder y otras configuraciones de la barra. 3. Opciones de navegación: Debajo de la barra de búsqueda, deben existir 3 opciones (botones o enlaces), cada uno redirige a una página diferente. El código debe contener un comentario que indique cómo agregar más opciones o modificar las existentes. 4. Tabla de registro: Debajo de las opciones, debe haber una tabla de registros. La tabla debe mostrar: Temperatura. Fecha. Hora. Ubicación. Estado (Normal, Advertencia, Peligro). Deben existir comentarios explicativos sobre cómo modificar cada columna y cómo personalizar los criterios de los estados. 5. Funcionalidad de registros: La tabla debe llenarse con registros simulados de temperatura. Si la temperatura es menor a 8°C, el estado es Normal. Si está entre 8°C y 12°C, el estado es Advertencia. Si supera los 12°C, el estado es Peligro. Deben existir comentarios que expliquen cómo ajustar estos rangos de temperatura. 6. Diseño básico: Debe tener un diseño básico (CSS) para diferenciar cada sección y hacer que la tabla sea fácil de leer. Incluir comentarios en el CSS indicando cómo cambiar colores, márgenes y tipografía. 7. Código explicativo: Todo el código (HTML, CSS, JS) debe contener comentarios claros como: <!-- Aquí puedes agregar más opciones de menú --> <!-- Aquí se define la lógica para determinar el estado de la temperatura --> /* Puedes cambiar el color de fondo aquí */ Cada variable en el código debe tener un comentario indicando su propósito. 8. Contexto: El sistema es un sistema de trazabilidad para neveras biomédicas, por lo que todo el contenido debe estar adaptado a este contexto. Ejemplos de ubicaciones: "Nevera 1 - Laboratorio Central", "Nevera 2 - Almacén", etc. Ejemplos de opciones de menú: "Historial de Temperaturas", "Configuración de Alarmas", "Reportes". Resumen: Página HTML completa. Comentarios en todo el código (HTML, CSS, JS). Adaptado a neveras biomédicas. Con barra de búsqueda, opciones de menú y tabla dinámica con estado según temperatura.

Prompt
Component Preview

About

Temperature Monitoring Dashboard - Manage fridge selection, view real-time temperature graphs, track user activity, and monitor product. Copy template now!

Share

Last updated 1 month ago