16-04-25

Mejorado el formato de la página

Styles/index.css

@@ -1,37 +1,21 @@
-body {
-	background-color: #181818;
-	justify-self: center;
-	text-align: center;
-	font-family: AgaveNerdFont;
+@keyframes handWave {
+	0% { transform: rotate(0deg); }
+	15% { transform: rotate(30deg); }
+	30% { transform: rotate(0deg); }
+	45% { transform: rotate(25deg); }
+	60% { transform: rotate(0deg); }
+	75% { transform: rotate(15deg); }
+	100% { transform: rotate(0deg); }
 }
-.selectLanguage {
-	position: absolute;
-	top: 2vh;
-	right: 1vw;
+
+#hi {
+	color: rgb(9, 255, 0);
+	display: inline-block;
+	transform-origin: bottom left;
 }
-.flag {
-	height: 6vh;
-	width: 5vw;
-}
-#textoDePrueba {
-	color: #ffffff;
-	font-size: 32px;
-	text-align: justify;
-	line-height: 150%;
-	padding-left: 3vw;
-	padding-right: 6vw;
-}
-.bigText {
-	font-size: 300%;
-	color: #ffffff;
-}
-#barraHorizontal {
-	background-color: gray;
-	border-radius: 3px;
-	width: 60vw;
-	height: 5px;
-	justify-self: center;
-	margin: 25px;
+
+#hi:hover {
+	animation: handWave 1.5s ease-in-out;
 }
 .apartado {
 	font-family: AgaveNerdFont;
@@ -44,36 +28,38 @@ body {
 #sobreMi {
 	color: #0084ff;
 }
-#stack {
-	color: yellow
+.puntosSobreMi::first-letter {
+	color: #0084ff;
 }
-#leftBar {
-    position: fixed;
-    top: 50%;
-    right: 1vw;
-    transform: translateY(-50%);
-    width: 4vw; /* Ajusta el ancho según necesites */
-    height: 60vh; /* Ajusta la altura que quieras que tenga la barra */
-    display: flex;
-    flex-direction: column;
-    justify-content: space-evenly;
-    align-items: center;
-    background-color: #202020;
-    border-radius: 10px; /* Bordes redondeados del lado izquierdo */
+#techStack {
+	color: yellow;
 }
-.leftBar_icon {
-	width: 3vw;
-	border-width: 3px;
-	border-radius: 10px;
-	flex-grow: 1;
+.puntosTech::first-letter {
+	color: yellow;
+}
+#techIcons {	/*div donde están los iconos*/
+	display: flex;
+	flex-direction: row;
+	width: 100%;
+	height: 15vh;
+	/*background-color: #0084ff;*/
+	justify-self: center;
+	justify-content: space-evenly;
+	align-items: center;
+	margin-top: 1.5vh;
+}
+.techIcon {		/*Propiedades para todos los iconos*/
+	width: 5vw;
 	transition: all 0.3s ease-in-out;
 }
-#GitHub:hover {
-	box-shadow: 0px 0px 20px rgb(195, 0, 255);
+.techIcon:hover{
+	width: 7.5vw;
 }
-#Discord:hover {
-	box-shadow: 0px 0px 20px rgb(0, 132, 255);
-}
-#Gmail:hover {
-	box-shadow: 0px 0px 20px rgb(255, 0, 0);
+#techDescription { 
+	display: flex;
+	height: 10vh;
+	justify-content: center;
+	align-items: center;
+	transition: all 0.25s ease-in-out;
+	font-size: 5vh;
 }