Updated README and fixed with on very width screens

Author: EricLuceroGonzalez

README.md

@@ -1,36 +1,117 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+# 🌐 EricLuceroGonzalez.github.io: Portafolio Personal y CV Digital
 
-## Getting Started
+[![Estado del Proyecto](https://img.shields.io/badge/Estado-Producci%C3%B3n%20y%20Mantenimiento-brightgreen)](https://ericlucerogonzalez.github.io/)
+[![Licencia](https://img.shields.io/badge/Licencia-MIT-blue)](LICENSE)
+[![Autor](https://img.shields.io/badge/Autor-Eric%20Lucero%20Gonz%C3%A1lez-informational)](https://github.com/EricLuceroGonzalez)
 
-First, run the development server:
+---
 
+## 🌟 Descripción General
+
+Este repositorio contiene el **código fuente** del **sitio web personal y portafolio profesional** de **Eric Lucero González**.
+
+El sitio actúa como una **tarjeta de presentación digital**, exponiendo mi experiencia laboral, mis **habilidades técnicas (stack tecnológico)** y una selección de proyectos clave, facilitando el contacto profesional y una excusa para registrar y ejercitar la escritura de temas que me interesan y que pueden servir para cualquier persona.
+
+### 🔗 Acceso al Sitio en Vivo
+
+El sitio web está disponible y desplegado a través de GitHub Pages:
+
+**URL:** [https://ericlucerogonzalez.github.io/](https://ericlucerogonzalez.github.io/)
+
+---
+
+## 🚀 Tecnologías y Dependencias Clave
+
+Este proyecto utiliza un *stack* moderno de desarrollo web, con enfoque en la modularidad y la estilización basada en componentes.
+
+### Frontend y Estilización
+* **Next.js:** Framework principal de desarrollo para la construcción de la interfaz de usuario.
+* **JavaScript (ES6+):** Lógica de interactividad y gestión de componentes.
+* **Styled Components:** Biblioteca utilizada para escribir CSS directamente en JavaScript, facilitando la creación de componentes estilizados y modulares.
+* **GitHub Pages:** Servicio de *hosting* y despliegue. 
+
+### Procesamiento de Contenido (Markdown)
+El proyecto incorpora diversas librerías para el manejo y procesamiento avanzado de archivos Markdown, incluyendo soporte para sintaxis extendida y fórmulas matemáticas:
+
+| Librería | Función |
+| :--- | :--- |
+| `remark-gfm` | Soporte para **GitHub Flavored Markdown** (tablas, *strikethrough*, etc.). |
+| `remark-math` | Habilita la sintaxis de **$\LaTeX$** para ecuaciones matemáticas. |
+| `rehype-mathjax` | Renderiza las ecuaciones matemáticas ($\LaTeX$) en el HTML usando **MathJax**. |
+| `supersub` | Extiende la sintaxis para superíndices y subíndices. |
+| `rehype-highlight` | Proporciona el resaltado de sintaxis para bloques de código. |
+
+---
+
+## ⚙️ Instalación y Ejecución Local
+
+Para clonar y ejecutar el sitio en tu entorno de desarrollo:
+
+### Prerrequisitos
+
+* **Git** instalado.
+* **Node.js** (versión LTS recomendada) y **npm** o **yarn**.
+
+### Pasos para Clonar e Instalar
+
+1.  **Clonar el Repositorio:**
+    ```bash
+    git clone [https://github.com/EricLuceroGonzalez/EricLuceroGonzalez.github.io.git](https://github.com/EricLuceroGonzalez/EricLuceroGonzalez.github.io.git)
+    cd EricLuceroGonzalez.github.io
+    ```
+
+2.  **Instalar Dependencias:**
+    Instala todas las dependencias listadas en `package.json`:
+    ```bash
+    npm install
+    # o si usas yarn: yarn install
+    ```
+
+### Ejecución del Proyecto
+
+Inicia el servidor de desarrollo local:
 ```bash
 npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
+# o si usas yarn: yarn dev
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+### Visualización Local
+
+La forma más sencilla de ver el sitio es abrir el archivo principal:
+
+1.  Abre el archivo **`index.html`** directamente en tu navegador.
+
+---
+
+## 🤝 Contribución
+
+Agradezco cualquier sugerencia o informe de error (bug). Si deseas contribuir:
+
+1.  Abre un **Issue** para describir cualquier problema (errores tipográficos, *bugs*, accesibilidad, etc.).
+2.  Crea un **Pull Request** con la solución o mejora propuesta.
+
+---
 
-You can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.
+## 📄 Licencia y Reconocimiento de Autoría
 
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
+Este proyecto se distribuye bajo la **Licencia MIT (Massachusetts Institute of Technology)**.
 
-## Learn More
+### Derechos Otorgados
 
-To learn more about Next.js, take a look at the following resources:
+Esta licencia de código abierto es altamente permisiva y te permite:
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+| Permisos | Descripción |
+| :--- | :--- |
+| **Uso Comercial** | Uso, copia, y distribución en proyectos comerciales. |
+| **Modificación** | Alterar el código fuente. |
+| **Distribución** | Redistribuir el código. |
+| **Sublicencia** | Otorgar licencias a otros. |
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+### Condiciones de la Licencia (Obligatorio)
 
-## Deploy on Vercel
+La **única condición** es que el aviso de derechos de autor (*copyright*) y la nota de permiso de la Licencia MIT **deben ser incluidos** en todas las copias o porciones sustanciales del Software. **Debe reconocerse la autoría original.**
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+* **Copyright © 2025 Eric Lucero González.**
+* **Autor Principal:** Eric Lucero González - [GitHub](https://github.com/EricLuceroGonzalez)
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+Para los términos completos de la licencia, consulta el archivo **`LICENSE`** en la raíz del repositorio.

app/page.js

@@ -27,7 +27,7 @@ function Home() {
         <HomePageCover>
           <HomePageCoverText>
             <TitlePage>Hola! 👋🏼</TitlePage>
-            <CoverTitle>Eric Lucero González </CoverTitle>
+            {/* <CoverTitle>Eric Lucero González </CoverTitle> */}
           </HomePageCoverText>
           {/* <TitlePage>Soy</TitlePage> */}
           {/* TODO: Check p5 Compo */}

app/ui/ComponentsStyled.js

@@ -42,10 +42,15 @@ export const MainPageBg = styled.div`
     max-width: 70%;
     margin: 0 auto;
   }
+  @media (min-width: 1300px) {
+    font-size: large;
+    max-width: 50%;
+    margin: 0 auto;
+  }
+  /* border: 1px solid var(--accent); */
 `;
 
 export const HomePageCover = styled.div`
-  /* border: 1px solid var(--accent); */
   height: 45vh;
   display: flex;
   flex-direction: row;