Este proyecto consiste en un dashboard de estudiantes y una visualización del Mapa de Ruta del Bootcamp. Está diseñado para proporcionar a los estudiantes un acceso fácil a enlaces y recursos importantes, así como una representación visual del plan de estudios del bootcamp.
El proyecto está estructurado de la siguiente manera:
index.html
: La página principal del dashboardstyle.css
: Estilos para el dashboardscript.js
: JavaScript para el dashboard y el diagrama de Ganttroadmap/roadmap.html
: La página de visualización del diagrama de Ganttroadmap/roadmap.css
: Estilos específicos para el diagrama de Gantt
-
Enlaces de la Barra Lateral: Para modificar los enlaces de la barra lateral, edita la sección
<nav>
enindex.html
. Cada enlace está representado por un elemento<li>
. -
Contenido Principal: El contenido principal está dividido en tarjetas. Modifica los elementos
<div class="card">
para cambiar el contenido de cada tarjeta. -
Calendario: Reemplaza el src del iframe con tu enlace de inserción de Google Calendar.
style.css
contiene estilos para el dashboard principal.roadmap.css
contiene estilos específicos para el diagrama de Gantt.
Modifica estos archivos para cambiar colores, diseños u otros aspectos visuales del dashboard y el diagrama de Gantt.
-
Enlaces del Dashboard: Para cambiar los enlaces de los botones del dashboard, modifica el objeto
links
al principio del archivo. -
Datos del Diagrama de Gantt: El array
data
contiene la información para el diagrama de Gantt. Cada objeto en este array representa un proyecto o tema en el bootcamp. Para modificar el plan de estudios:- Añade, elimina o modifica objetos en el array
data
. - Cada objeto debe tener un
type
("Proyecto" o "Tema"), unname
, y opcionalmentestart
yend
para las semanas. - Si no se proporcionan
start
yend
, se calcularán automáticamente basándose en los elementos anteriores.
Ejemplo:
{ type: "Proyecto", name: "Nuevo Proyecto", start: 19, end: 21 }
- Añade, elimina o modifica objetos en el array