La Plantilla CVA es un proyecto diseñado para facilitar la creación y gestión de cursos en línea a través del Centro Virtual de Aprendizaje (CVA). Esta plantilla proporciona una estructura básica y componentes reutilizables que permiten a los desarrolladores y educadores crear contenido educativo de manera eficiente y estandarizada.
El proyecto está organizado en varios directorios y archivos clave:
- components/: Contiene los componentes reutilizables como la barra de navegación, la barra lateral y el pie de página.
- css/: Contiene los archivos de estilos CSS utilizados en el proyecto.
- images/: Contiene las imágenes utilizadas en el proyecto.
- modulos/: Contiene los módulos y lecciones del curso.
- index.html: La página principal del proyecto.
- README.md: Este archivo de documentación.
El componente navbar.js proporciona una barra de navegación que incluye enlaces a las secciones principales del curso y una barra de búsqueda con autocompletado.
El componente sidebar.js proporciona una barra lateral con enlaces a las lecciones del curso.
El componente footer.js proporciona un pie de página con información de contacto y enlaces adicionales.
Los estilos CSS están organizados en varios archivos para facilitar su gestión:
- styles.css: Estilos generales del proyecto.
- navbar.css: Estilos específicos para la barra de navegación.
- curso.css: Estilos específicos para el contenido del curso.
- sidebar.css: Estilos específicos para la barra lateral.
- footer.css: Estilos específicos para el pie de página.
Para utilizar esta plantilla, sigue estos pasos:
- Clona el repositorio en tu máquina local.
- Abre el archivo
index.htmlen tu navegador para ver la página principal. - Personaliza los componentes y estilos según tus necesidades.
- Agrega el contenido de tu curso en los archivos HTML dentro del directorio
modulos.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Plantilla CVA</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/navbar.css">
<link rel="stylesheet" href="css/curso.css">
<link rel="stylesheet" href="css/sidebar.css">
<link rel="stylesheet" href="css/footer.css">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined" rel="stylesheet"/> <!-- Necesario para icono del navbar -->
<script src="components/navbar.js" defer></script>
<script src="components/sidebar.js" defer></script>
<script src="components/footer.js" defer></script>
</head>
<body>
<nav-bar></nav-bar>
<div class="container">
<side-bar></side-bar>
<main class="content">
<!-- Contenido del curso -->
</main>
</div>
<footer-comp></footer-comp>
</body>
</html>Las contribuciones son bienvenidas. Si deseas contribuir a este proyecto, por favor sigue estos pasos:
- Haz un fork del repositorio.
- Crea una nueva rama (
git checkout -b feature/nueva-funcionalidad). - Realiza los cambios necesarios y haz commit (
git commit -am 'Agrega nueva funcionalidad'). - Sube los cambios a tu rama (
git push origin feature/nueva-funcionalidad). - Abre un Pull Request.