python-chile · hernan941 · Aug 9, 2026
diff --git a/README.md b/README.md
@@ -1 +1,82 @@
-# pyschool
+# PySchool
+
+Sitio web oficial de **PySchool**, una iniciativa educativa de [Python Chile](https://www.pythonchile.cl) para enseñar programación Python a la comunidad hispanohablante.
+
+## ¿Qué es PySchool?
+
+PySchool es un espacio de aprendizaje donde cualquier persona puede dar sus primeros pasos en Python directamente desde el navegador, sin necesidad de instalar nada. El sitio incluye un intérprete de Python interactivo potenciado por [Pyodide](https://pyodide.org/) y recursos de las ediciones anteriores del evento.
+
+## Tecnologías
+
+- **[Pelican](https://getpelican.com/)** - Generador de sitios estáticos en Python
+- **Jinja2** - Motor de plantillas HTML
+- **Pyodide** - Python compilado a WebAssembly para ejecutarse en el navegador
+- **CSS puro** - Diseño brutalista personalizado sin frameworks externos
+
+## Estructura del proyecto
+
+```
+pyschool/
+├── content/          # Contenido estático (imágenes, etc.)
+│   └── img/          # Imágenes del sitio
+├── theme/            # Tema personalizado de Pelican
+│   ├── templates/    # Plantillas Jinja2
+│   │   ├── base.html
+│   │   ├── navbar.html
+│   │   ├── welcome.html
+│   │   ├── python_interpreter.html
+│   │   ├── projects.html
+│   │   └── footer.html
+│   └── static/
+│       └── css/
+│           └── styles.css
+├── pelicanconf.py    # Configuración de Pelican (desarrollo)
+├── publishconf.py    # Configuración de Pelican (producción)
+└── requirements.txt  # Dependencias Python
+```
+
+## Instalación y uso local
+
+### Requisitos
+
+- Python 3.9+
+
+### Pasos
+
+1. **Clonar el repositorio**
+
+   ```bash
+   git clone https://github.com/python-chile/pyschool.git
+   cd pyschool
+   ```
+
+2. **Crear un entorno virtual e instalar dependencias**
+
+   ```bash
+   python3 -m venv .venv
+   source .venv/bin/activate
+   pip install -r requirements.txt
+   ```
+
+3. **Levantar el servidor de desarrollo**
+
+   ```bash
+   pelican --listen
+   ```
+
+   El sitio estará disponible en [http://localhost:8000](http://localhost:8000).
+
+4. **Reconstruir automáticamente al guardar cambios**
+
+   ```bash
+   pelican --autoreload --listen
+   ```
+
+## Comunidad
+
+- Sitio web: [www.pythonchile.cl](https://www.pythonchile.cl)
+- Contacto: [contacto@pythonchile.com](mailto:contacto@pythonchile.com)
+
+## Licencia
+
+Este proyecto es parte de la comunidad Python Chile. Consulta el repositorio para más detalles sobre la licencia.
diff --git a/theme/static/css/styles.css b/theme/static/css/styles.css
@@ -340,10 +340,54 @@ section h1 {
 
 nav {
     padding: 1rem 2rem;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    background-color: var(--color-white);
 }
 
 .nav-content {
     padding: 0.5rem 0;
+    position: relative;
+}
+
+/* =========================================
+   HAMBURGER BUTTON
+   ========================================= */
+.nav-hamburger {
+    display: none;
+    flex-direction: column;
+    justify-content: space-between;
+    width: 36px;
+    height: 26px;
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    padding: 0;
+    z-index: 1100;
+}
+
+.nav-hamburger span {
+    display: block;
+    width: 100%;
+    height: 3px;
+    background-color: var(--color-black);
+    border-radius: 2px;
+    transition: transform 0.25s ease, opacity 0.25s ease;
+    transform-origin: center;
+}
+
+.nav-hamburger.is-active span:nth-child(1) {
+    transform: translateY(11.5px) rotate(45deg);
+}
+
+.nav-hamburger.is-active span:nth-child(2) {
+    opacity: 0;
+    transform: scaleX(0);
+}
+
+.nav-hamburger.is-active span:nth-child(3) {
+    transform: translateY(-11.5px) rotate(-45deg);
 }
 
 .logo-container {
@@ -467,6 +511,43 @@ footer#contacto {
    ========================================= */
 @media (max-width: 768px) {
 
+    /* --- Navbar móvil --- */
+    .nav-hamburger {
+        display: flex;
+    }
+
+    .nav-links {
+        display: none;
+        flex-direction: column;
+        position: absolute;
+        top: calc(100% + 0.75rem);
+        right: 0;
+        background-color: var(--color-white);
+        border: 2px solid var(--color-black);
+        border-radius: 16px;
+        box-shadow: 6px 6px 0 var(--color-black);
+        padding: 1rem;
+        gap: 0.75rem;
+        min-width: 200px;
+        z-index: 1000;
+    }
+
+    .nav-links.nav-open {
+        display: flex;
+    }
+
+    .nav-links li {
+        width: 100%;
+    }
+
+    .nav-links a {
+        display: block;
+        width: 100%;
+        box-sizing: border-box;
+        text-align: center;
+    }
+
+    /* --- Secciones --- */
     .hero,
     .interpreter-section,
     #recursos.section {

diff --git a/theme/templates/base.html b/theme/templates/base.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en" xmlns="http://www.w3.org/1999/html">
+<html lang="es" xmlns="http://www.w3.org/1999/html">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1"/>

diff --git a/theme/templates/navbar.html b/theme/templates/navbar.html
@@ -2,13 +2,40 @@
     <div class="nav-content">
         <a href="/" class="logo-container">
             <img src="{{ SITEURL }}/img/pyschool_logo.png" class="nav-logo-img" />
-            <div class="logo">Pyschool</div>
+            <div class="logo">PySchool</div>
         </a>
-        <ul class="nav-links">
+        <button class="nav-hamburger" id="nav-hamburger" aria-label="Abrir menú" aria-expanded="false" aria-controls="nav-links">
+            <span></span>
+            <span></span>
+            <span></span>
+        </button>
+        <ul class="nav-links" id="nav-links">
             <li><a href="#iniciativa">Iniciativa</a></li>
             <li><a href="#prueba-python">Prueba Python</a></li>
             <li><a href="#recursos">Proyectos</a></li>
             <li><a href="#contacto">Contacto</a></li>
         </ul>
     </div>
-</nav>
+</nav>
+
+<script>
+    (function () {
+        const btn = document.getElementById('nav-hamburger');
+        const links = document.getElementById('nav-links');
+
+        btn.addEventListener('click', function () {
+            const isOpen = links.classList.toggle('nav-open');
+            btn.setAttribute('aria-expanded', isOpen);
+            btn.classList.toggle('is-active', isOpen);
+        });
+
+        // Cerrar menú al hacer clic en un enlace
+        links.querySelectorAll('a').forEach(function (a) {
+            a.addEventListener('click', function () {
+                links.classList.remove('nav-open');
+                btn.setAttribute('aria-expanded', false);
+                btn.classList.remove('is-active');
+            });
+        });
+    })();
+</script>
diff --git a/theme/templates/projects.html b/theme/templates/projects.html
@@ -4,7 +4,7 @@ <h1>Recursos de eventos anteriores</h1>
         <div>
             <p>
                 En esta sección se encuentran los enlaces directos a los
-                repositorios utilizados en eversiones anterioes.
+                repositorios utilizados en versiones anteriores.
             </p>
         </div>
         <ul class="project-links">

diff --git a/theme/templates/welcome.html b/theme/templates/welcome.html
@@ -2,6 +2,6 @@
 <section id="bienvenida" class="hero">
     <h1>Bienvenido a PySchool</h1>
     <img src="{{ SITEURL }}/img/pyschool_logo.png" alt="PySchool logo" class="hero-logo">
-    <p class="subtitle">Iniciativa por comunindad Python Chile</p>
+    <p class="subtitle">Iniciativa por comunidad Python Chile</p>
     <img src="{{ SITEURL }}/img/python_chile_logo.png" alt="Logo Python Chile" class="pch-logo" />
 </section>