Modify website

- Actualizado apartado de experiencia laboral (2026)
- Quitado icono de Arduino
- Añadido iconos de ESP-IDF y Zig
- Actualizado github->codeberg
- Eliminado todo typescript

Scripts/index.js

@@ -1,36 +1,42 @@
-"use strict";
 const techDescription = document.getElementById('techDescription');
-const techs = [
+
-    { iconId: 'inoTechIcon', description: 'Arduino: Proyectos de electrónica y prototipos' },
-    { iconId: 'cTechIcon', description: 'C: Mi lenguaje de programación principal' },
-    { iconId: 'gitTechIcon', description: 'Git: Control de versiones de mis proyectos' },
-    { iconId: 'linuxTechIcon', description: 'Linux: Uso diario y administración' },
-    { iconId: 'rpiTechIcon', description: 'Raspberry Pi: Servidores caseros y homelabs' }
-];
 if (!techDescription) {
 	alert('ERROR: No se ha encontrado el elemento "techDescription"');
+	throw new Error('techDescription element not found');
 }
-else {
+
-    techs.forEach(tech => {
+const techs = [
+	{ iconId: 'cTechIcon', description: 'C: Programación de sistemas y embedded' },
+	{ iconId: 'espTechIcon', description: 'ESP-IDF: Firmware y drivers para ESP32 sobre FreeRTOS' },
+	{ iconId: 'linuxTechIcon', description: 'Linux: Uso diario y administración' },
+	{ iconId: 'zigTechIcon', description: 'Zig: Experimentos y desarrollo en general' },
+	{ iconId: 'gitTechIcon', description: 'Git: Control de versiones de mis proyectos' },
+	{ iconId: 'rpiTechIcon', description: 'Raspberry Pi: Servidores caseros y homelabs' },
+];
+
+techs.forEach((tech) => {
 	const icon = document.getElementById(tech.iconId);
 	if (!icon) {
-            alert('ERROR: elemento con ID ${tech.iconID} no encontrado');
+		alert(`ERROR: elemento con ID ${tech.iconId} no encontrado`);
 		return;
 	}
 	icon.addEventListener('mouseenter', () => {
 		techDescription.innerText = tech.description;
 		switch (tech.iconId) {
-                case 'inoTechIcon':
-                    techDescription.style.color = 'aqua';
-                    break;
 			case 'cTechIcon':
 				techDescription.style.color = '#1578fa';
 				break;
-                case 'gitTechIcon':
+			case 'espTechIcon':
-                    techDescription.style.color = 'orangered';
+				techDescription.style.color = '#e7352c';
 				break;
 			case 'linuxTechIcon':
-                    techDescription.style.color = 'yellow';
+				techDescription.style.color = '#2596be';
+				break;
+			case 'zigTechIcon':
+				techDescription.style.color = '#f7a41d';
+				break;
+			case 'gitTechIcon':
+				techDescription.style.color = 'orangered';
 				break;
 			case 'rpiTechIcon':
 				techDescription.style.color = '#FB266A';
@@ -40,4 +46,3 @@ else {
 		}
 	});
 });
-}

Scripts/index_en.js

@@ -1,36 +1,42 @@
-"use strict";
 const techDescription_en = document.getElementById('techDescription');
-const techs_en = [
+
-    { iconId: 'inoTechIcon', description: 'Arduino: Electronics projects and prototyping' },
-    { iconId: 'cTechIcon', description: 'C: My main programming language' },
-    { iconId: 'gitTechIcon', description: 'Git: Version control for all my projects' },
-    { iconId: 'linuxTechIcon', description: 'Linux: Daily use and administration' },
-    { iconId: 'rpiTechIcon', description: 'Raspberry Pi: Home servers and homelabs' }
-];
 if (!techDescription_en) {
-    alert('ERROR: No se ha encontrado el elemento "techDescription"');
+	alert('ERROR: element "techDescription" not found');
+	throw new Error('techDescription element not found');
 }
-else {
+
-    techs_en.forEach(tech => {
+const techs_en = [
+	{ iconId: 'cTechIcon', description: 'C: Systems and embedded programming' },
+	{ iconId: 'espTechIcon', description: 'ESP-IDF: Firmware and drivers for ESP32 on FreeRTOS' },
+	{ iconId: 'linuxTechIcon', description: 'Linux: Daily use and administration' },
+	{ iconId: 'zigTechIcon', description: 'Zig: Experiments and general development' },
+	{ iconId: 'gitTechIcon', description: 'Git: Version control for all my projects' },
+	{ iconId: 'rpiTechIcon', description: 'Raspberry Pi: Home servers and homelabs' },
+];
+
+techs_en.forEach((tech) => {
 	const icon = document.getElementById(tech.iconId);
 	if (!icon) {
-            alert('ERROR: elemento con ID ${tech.iconID} no encontrado');
+		alert(`ERROR: element with ID ${tech.iconId} not found`);
 		return;
 	}
 	icon.addEventListener('mouseenter', () => {
 		techDescription_en.innerText = tech.description;
 		switch (tech.iconId) {
-                case 'inoTechIcon':
-                    techDescription_en.style.color = 'aqua';
-                    break;
 			case 'cTechIcon':
 				techDescription_en.style.color = '#1578fa';
 				break;
-                case 'gitTechIcon':
+			case 'espTechIcon':
-                    techDescription_en.style.color = 'orangered';
+				techDescription_en.style.color = '#e7352c';
 				break;
 			case 'linuxTechIcon':
-                    techDescription_en.style.color = 'yellow';
+				techDescription_en.style.color = '#2596be';
+				break;
+			case 'zigTechIcon':
+				techDescription_en.style.color = '#f7a41d';
+				break;
+			case 'gitTechIcon':
+				techDescription_en.style.color = 'orangered';
 				break;
 			case 'rpiTechIcon':
 				techDescription_en.style.color = '#FB266A';
@@ -40,4 +46,3 @@ else {
 		}
 	});
 });
-}

Styles/fonts.css

@@ -8,5 +8,5 @@
 	font-family: 'AgaveNerdFont';
 	src: url('../Fonts/AgaveNerdFont/AgaveNerdFont-Bold.ttf') format('truetype');
 	font-weight: bold;
-	font-style: bold;
+	font-style: normal;
 }

Styles/index.css

@@ -75,6 +75,9 @@ p {
 .techIcon:hover{
 	width: 7.5vw;
 }
+.squareIcon {	/*Iconos cuadrados sin bordes redondeados propios*/
+	border-radius: 22%;
+}
 
 #techDescription {
 	color: white; 

index.html

@@ -2,6 +2,7 @@
 <html lang="es">
 <head>
 	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<title>T_Royale</title>
 	<link rel="icon" href="favicon.png" type="image/png">
 	<link rel="stylesheet" href="Styles/index.css">
@@ -25,17 +26,17 @@
 	<div id="texto">
 		<p class="apartado" id="sobreMi"> &nbsp;Sobre mí:</p>
 		<p class="puntosSobreMi">
-			 &nbsp;Estudio el grado medio de SMR en Valencia.
+			 &nbsp;Estudiante autodidacta de programación de bajo nivel
 		</p>
 		<p class="puntosSobreMi">
-			 &nbsp;Proyectos de electrónica, programación en C y trastear con Linux.
+		 &nbsp;Electrónica, sistemas y embedded.
 		</p>
 		<p class="puntosSobreMi">
 			 &nbsp;Siempre montando cosas nuevas y aprendiendo por mi cuenta.
 		</p>
 		<p class="apartado" id="experiencia"> &nbsp;Experiencia:</p>
 		<p class="puntosExperiencia">
-			 &nbsp;No mucha
+			 &nbsp;2024-2026 - Nube7 - Administración de sistemas, desarrollo con ESP32.
 		</p>
 		<p class="apartado" id="tecnologias"> &nbsp;Tecnologías:</p>
 		<p class="puntoTecnologías">
@@ -43,20 +44,21 @@
 		</p>
 	</div>
 	<div id="techIcons">
-		<img src="https://skillicons.dev/icons?i=arduino&theme=dark" class="techIcon" id="inoTechIcon">
 		<img src="https://skillicons.dev/icons?i=c&theme=dark" class="techIcon" id="cTechIcon">
-		<img src="https://skillicons.dev/icons?i=git&theme=dark" class="techIcon" id="gitTechIcon">
+		<img src="https://espressif.gallerycdn.vsassets.io/extensions/espressif/esp-idf-extension/1.9.0/1733825766020/Microsoft.VisualStudio.Services.Icons.Default" class="techIcon squareIcon" id="espTechIcon">
 		<img src="https://skillicons.dev/icons?i=linux&theme=light" class="techIcon" id="linuxTechIcon">
+		<img src="https://skillicons.dev/icons?i=zig&theme=dark" class="techIcon" id="zigTechIcon">
+		<img src="https://skillicons.dev/icons?i=git&theme=dark" class="techIcon" id="gitTechIcon">
 		<img src="https://skillicons.dev/icons?i=raspberrypi&theme=light" class="techIcon" id="rpiTechIcon">
 	</div>
 	<!--Barra lateral-->
 	<div id="leftBar">
+		<a href="https://codeberg.org/T_Royale">
+			<img src="https://uxwing.com/wp-content/themes/uxwing/download/brands-and-social-media/codeberg-icon.png" class="leftBar_icon" id="GitHub"/>
+		</a>
 		<a href="https://discord.bio/T_Royale">
 			<img src="https://skillicons.dev/icons?i=discord&theme=dark" class="leftBar_icon" id="Discord"/>
 		</a>
-		<a href="https://github.com/T-Royale">
-			<img src="https://skillicons.dev/icons?i=github&theme=dark" class="leftBar_icon" id="GitHub"/>
-		</a>
 		<a href="mailto:teomoralesvelasco@icloud.com?subject=Hola, quiero contactarte">
 			<img src="https://skillicons.dev/icons?i=gmail&theme=dark" class="leftBar_icon" id="Gmail"/>
 		</a>

index_en.html

@@ -1,7 +1,8 @@
 <!DOCTYPE html>
-<html lang="es">
+<html lang="en">
 <head>
 	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
 	<title>T_Royale</title>
 	<link rel="icon" href="favicon.png" type="image/png">
 	<link rel="stylesheet" href="Styles/index.css">
@@ -25,17 +26,17 @@
 	<div id="texto">
 		<p class="apartado" id="sobreMi"> &nbsp;About me:</p>
 		<p class="puntosSobreMi">
-			 &nbsp;I’m studying a vocational degree in Computer Systems (SMR) in Valencia.
+			 &nbsp;Self-taught low-level programming student.
 		</p>
 		<p class="puntosSobreMi">
-			 &nbsp;Working on electronics projects, programming in C, and tinkering with Linux.
+			 &nbsp;Electronics, systems and embedded.
 		</p>
 		<p class="puntosSobreMi">
 			 &nbsp;Always building new things and learning on my own.
 		</p>
 		<p class="apartado" id="experiencia"> &nbsp;Experience:</p>
 		<p class="puntosExperiencia">
-			 &nbsp;Not much yet.
+			 &nbsp;2024-2026 - Nube7 - Systems administration, ESP32 development.
 		</p>
 		<p class="apartado" id="tecnologias"> &nbsp;Technologies:</p>
 		<p class="puntoTecnologías">
@@ -43,24 +44,25 @@
 		</p>
 	</div>
 	<div id="techIcons">
-		<img src="https://skillicons.dev/icons?i=arduino&theme=dark" class="techIcon" id="inoTechIcon">
 		<img src="https://skillicons.dev/icons?i=c&theme=dark" class="techIcon" id="cTechIcon">
-		<img src="https://skillicons.dev/icons?i=git&theme=dark" class="techIcon" id="gitTechIcon">
+		<img src="https://espressif.gallerycdn.vsassets.io/extensions/espressif/esp-idf-extension/1.9.0/1733825766020/Microsoft.VisualStudio.Services.Icons.Default" class="techIcon squareIcon" id="espTechIcon">
 		<img src="https://skillicons.dev/icons?i=linux&theme=light" class="techIcon" id="linuxTechIcon">
+		<img src="https://skillicons.dev/icons?i=zig&theme=dark" class="techIcon" id="zigTechIcon">
+		<img src="https://skillicons.dev/icons?i=git&theme=dark" class="techIcon" id="gitTechIcon">
 		<img src="https://skillicons.dev/icons?i=raspberrypi&theme=light" class="techIcon" id="rpiTechIcon">
 	</div>
-	<!--Barra lateral-->
+	<!--Sidebar-->
 	<div id="leftBar">
 		<a href="https://discord.bio/T_Royale">
 			<img src="https://skillicons.dev/icons?i=discord&theme=dark" class="leftBar_icon" id="Discord"/>
 		</a>
-		<a href="https://github.com/T-Royale">
+		<a href="https://codeberg.org/T_Royale">
 			<img src="https://skillicons.dev/icons?i=github&theme=dark" class="leftBar_icon" id="GitHub"/>
 		</a>
 		<a href="mailto:teomoralesvelasco@icloud.com?subject=Hi, I want to contact you">
 			<img src="https://skillicons.dev/icons?i=gmail&theme=dark" class="leftBar_icon" id="Gmail"/>
 		</a>
 	</div>
-	<!--/Barra lateral/-->
+	<!--/Sidebar/-->
 </body>
 </html>