cambios en proceso (tiene errores)

frontend/assets/css/infoDoc.css

@@ -61,11 +61,10 @@ body {
 
 .porcentaje-dificultad {
   display: flex;
-  justify-content: space-around;
-  align-items: center;
+  justify-content: center; /* Centrar los elementos horizontalmente */
+  align-items: center; /* Centrar los elementos verticalmente */
   margin: 20px 0;
 }
-
 .porcentaje {
   text-align: center;
   font-size: 1.2em;
@@ -90,18 +89,12 @@ body {
   font-size: 2em;
 }
 
-.porcentaje {
-  font-size: 1.2em;
-  color: #000;
-  margin: 5px 0;
+.linea-vertical {
+  width: 3px;
+  height: 50px;
+  background-color: rgb(0, 0, 0);
+  margin: 0 50px; /* Reducir el espacio horizontal entre los elementos */
 }
-
-.dificultad {
-  font-size: 1.2em;
-  color: #000;
-  margin: 5px 0;
-}
-
 .calificar-btn {
   background-color: #ffa500;
   color: #fff;
@@ -186,8 +179,6 @@ td {
   margin-bottom: 20px;
 }
 
-
-
 /* Estilos para el contenedor de comentarios */
 .calificacion {
   display: flex;
@@ -270,7 +261,6 @@ td {
   justify-content: center;
 }
 
-
 .label span{
   font-size: 1em;
 }
@@ -299,4 +289,4 @@ td {
   margin-bottom: 10px;
   display: flex;
   justify-content: center;
-}
+}

frontend/assets/css/localidades.css

@@ -115,7 +115,7 @@
     padding: 20px;
     border-radius: 5px;
     transition: box-shadow 0.3s ease, transform 0.3s ease, background-color 0.3s ease;
-    background-color: #f5f5f5;
+    background-color: #ffffff;
     max-width: 600px;
     margin: auto;
     font-size: 1em;

frontend/assets/css/newtext.css

@@ -151,31 +151,17 @@ body {
 }
 
 
-.buttonImgPosi {
-    width: 50px;
-    height: 50px;
-}
-
-.buttonImgNega {
-    width: 50px;
-    height: 50px;
-    color: #007bff;
+.like-deseleccionado, .dislike-deseleccionado, .like-seleccionado, .dislike-seleccionado {
+    width: 70px;
+    height: 70px;
 }
 
 .submitImg {
     width: 50px;
     height: auto;
 }
 
-
-.buttonImgPosiComment {
-    padding: 5px;
-    width: 50px;
-    height: 50px;
-}
-
-.buttonImgNegaComment {
-    padding: 5px;
-    width: 50px;
-    height: 50px;
+.buttonImgPosiComment, .buttonImgNegaComment{
+    width: 70px;
+    height: 70px;
 }

frontend/assets/css/perfil.css

@@ -165,29 +165,61 @@ body {
   gap: 10px;
 }
 
-/* New CSS for buttons */
-.profile-btn {
+.profile-btn.like-btn {
   position: absolute;
   top: 10px;
-  background-color: #ffffff;
+  right: 0px;
+  background: none;
   border: none;
-  font-size: 1.5rem;
   cursor: pointer;
+  display: flex;
+  align-items: center;
+}
+
+.like-icon-container {
+  width: 80px; /* Ajustar el tamaño del contenedor según sea necesario */
+  height: 80px; /* Ajustar el tamaño del contenedor según sea necesario */
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.like-icon {
+  font-size: 25px; /* Ajustar el tamaño del ícono según sea necesario */
+  color: #000; /* Color del ícono */
   transition: color 0.3s ease;
 }
 
-.profile-btn.like-btn {
-  right: 10px;
+.profile-btn.like-btn:hover .like-icon {
+  color: #ff0000; /* Cambiar color del ícono al pasar el mouse */
 }
 
+/* CSS para el botón Editar en la esquina inferior derecha */
 .profile-btn.edit-btn {
-  left: 10px;
+  position: absolute;
+  bottom: 10px; /* Ajustar la distancia desde abajo según sea necesario */
+  right: 10px; /* Ajustar la distancia desde la derecha según sea necesario */
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
 }
 
-.profile-btn:hover {
-  color: #007BFF;
+.edit-text {
+  font-size: 14px; /* Tamaño del texto "Editar" */
+  margin-right: 5px; /* Espacio entre texto e ícono */
 }
 
+.edit-icon {
+  font-size: 20px; /* Tamaño del ícono */
+  color: #000; /* Color del ícono */
+  transition: color 0.3s ease;
+}
+
+.profile-btn.edit-btn:hover .edit-icon {
+  color: #007bff; /* Cambiar color del ícono al pasar el mouse */
+}
 /* CSS for Modal */
 .modal {
   display: none;

frontend/assets/js/textFetch.js

@@ -240,9 +240,9 @@ function displayPostResponses(responseData) {
         const voteButtons = document.createElement('div');
         voteButtons.className = 'votes';
         voteButtons.innerHTML = `
-            <button class="vote-button upvote" data-response-id"><img class="buttonImgPosiComment" src="./assets/img/votoPosi.png"></img></button>
-            <p class="vote-count" id="vote-count">${response.puntuacion}</p>
-            <button class="vote-button downvote" data-response-id"><img class="buttonImgNegaComment" src="./assets/img/votoNega.png"></img></button>
+            <button class="vote-button upvote" data-response-id="${response.comentario_id}"><img class="buttonImgPosiComment" src="./assets/img/like-deseleccionado.png"></img></button>
+            <p class="vote-count" id="Vote-count">${response.puntuacion}</p>
+            <button class="vote-button downvote" data-response-id="${response.comentario_id}"><img class="buttonImgNegaComment" src="./assets/img/dislike-deseleccionado.png"></img></button>
         `;
 
         const commentInfo = document.createElement('div');
@@ -257,11 +257,11 @@ function displayPostResponses(responseData) {
         commentsContainer.appendChild(commentElement);
 
         commentElement.querySelector('.upvote').addEventListener('click', function() {
-            handleVote(commentElement.querySelector('.vote-count'), this, commentElement.querySelector('.downvote'));
+            handleVote(commentElement.querySelector(`#vote-count-${response.comentario_id}`), this, commentElement.querySelector('.downvote'));
         });
-        
+
         commentElement.querySelector('.downvote').addEventListener('click', function() {
-            handleVote(commentElement.querySelector('.vote-count'), this, commentElement.querySelector('.upvote'));
+            handleVote(commentElement.querySelector(`#vote-count-${response.comentario_id}`), this, commentElement.querySelector('.upvote'));
         });
     });
 }
@@ -277,9 +277,9 @@ function displayAllPostResponses(responseData) {
         const voteButtons = document.createElement('div');
         voteButtons.className = 'votes';
         voteButtons.innerHTML = `
-            <button class="vote-button upvote" data-response-id="${response.comentario_id}"><img class="buttonImgPosiComment" src="./assets/img/votoPosi.png"></img></button>
-            <p class="vote-count" id="Vote-count">${response.cantidad}</p>
-            <button class="vote-button downvote" data-response-id="${response.comentario_id}"><img class="buttonImgNegaComment" src="./assets/img/votoNega.png"></img></button>
+            <button class="vote-button upvote" data-response-id="${response.comentario_id}"><img class="buttonImgPosiComment" src="./assets/img/like-deseleccionado.png"></img></button>
+            <p class="vote-count" id="Vote-count">${response.puntuacion}</p>
+            <button class="vote-button downvote" data-response-id="${response.comentario_id}"><img class="buttonImgNegaComment" src="./assets/img/dislike-deseleccionado.png"></img></button>
         `;
 
         const commentInfo = document.createElement('div');

frontend/atencionestudiante.html

@@ -225,7 +225,7 @@ <h2 id="publicaciones-title">Reseñas</h2>
                   </div>
                   <button class="toggle-button">Ver más</button>
                   <button class="like-button">
-                    <img src="assets/img/votoPosi.png" alt="Like" class="like-icon"> Like
+                    <img src="assets/img/like-deseleccionado.png" alt="Like" class="like-icon"> Like
                 </button>
               </div>
           </div>

frontend/cafeteria.html

@@ -225,7 +225,7 @@ <h2 id="publicaciones-title">Reseñas</h2>
                   </div>
                   <button class="toggle-button">Ver más</button>
                   <button class="like-button">
-                    <img src="assets/img/votoPosi.png" alt="Like" class="like-icon"> Like
+                    <img src="assets/img/like-deseleccionado.png" alt="Like" class="like-icon"> Like
                 </button>
               </div>
           </div>

frontend/infoDocente.html

@@ -190,10 +190,11 @@ <h6 id="profile-fullname">Nombre Completo</h6>
             <p class="facultad"></p>
             <div class="porcentaje-dificultad">
                 <div class="porcentaje">
-                    <strong></strong> tomaría de nuevo el curso
+                    <strong>100%</strong> tomaría de nuevo el curso
                 </div>
+                <div class="linea-vertical"></div>
                 <div class="dificultad">
-                    <strong></strong> nivel de dificultad
+                    <strong>3.0</strong> nivel de dificultad
                 </div>
             </div>
             <a href="#"><button class="calificar-btn">CALIFICAR</button></a>

frontend/match.html

@@ -225,7 +225,7 @@ <h2 id="publicaciones-title">Reseñas</h2>
                   </div>
                   <button class="toggle-button">Ver más</button>
                   <button class="like-button">
-                    <img src="assets/img/votoPosi.png" alt="Like" class="like-icon"> Like
+                    <img src="assets/img/like-deseleccionado.png" alt="Like" class="like-icon"> Like
                 </button>
               </div>
           </div>

frontend/text.html

@@ -150,42 +150,41 @@ <h6 id="profile-fullname">Nombre Completo</h6>
 </aside>
 
 <main id="main" class="main">
-
   <section class="section dashboard">
-    <div class="container">
-        <div class="question-container">
-            <div class="question-header">
-                <img src="./assets/img/defaultft.webp" alt="Foto de perfil" class="profile-pic">
-                <div class="question-info">
-                    <h2 class="question-title"></h2>
-                    <p class="question-details"></p>
-                    <p class="question-meta"></p>
-                    <div class="tagsPost">
-                        <!-- Las etiquetas se insertarán aquí -->
-                    </div>
-                </div>
-                <div class="votes">
-                    <button class="vote-button upvote"><img class="buttonImgPosi" src="./assets/img/votoPosi.png"></img></button>
-                    <p class="vote-count"></p>
-                    <button class="vote-button downvote"><img class="buttonImgNega" src="./assets/img/votoNega.png"></img></button>
-                </div>
-            </div>
-        </div>
-        <div class="comment-section">
-            <textarea class="comment-input" placeholder="Deja tu comentario..."></textarea>
-            <button class="comment-submit"><img class="submitImg" src="./assets/img/submit.webp" alt="submit"></button>
-        </div>
-        <div class="comments">
-
-        </div>
-        <div class="view-all-comments">
-            <a href="#">Ver todos los comentarios</a>
-        </div>
-    </div>
-</section>
-
-
+      <div class="container">
+          <div class="question-container">
+              <div class="question-header">
+                  <img src="./assets/img/defaultft.webp" alt="Foto de perfil" class="profile-pic">
+                  <div class="question-info">
+                      <h2 class="question-title"></h2>
+                      <p class="question-details"></p>
+                      <p class="question-meta"></p>
+                      <div class="tagsPost">
+                          <!-- Las etiquetas se insertarán aquí -->
+                      </div>
+                  </div>
+                  <div class="votes">
+                      <button class="vote-button upvote"><img class="like-deseleccionado" src="./assets/img/like-deseleccionado.png"></img></button>
+                      <p class="vote-count"></p>
+                      <button class="vote-button downvote"><img class="dislike-deseleccionado" src="./assets/img/dislike-deseleccionado.png"></img></button>
+                  </div>
+              </div>
+          </div>
+          <div class="comment-section">
+              <textarea class="comment-input" placeholder="Deja tu comentario..."></textarea>
+              <button class="comment-submit"><img class="submitImg" src="./assets/img/submit.webp" alt="submit"></button>
+          </div>
+          <div class="comments">
+              <!-- Los comentarios se insertarán aquí -->
+          </div>
+          <div class="view-all-comments">
+              <a href="#">Ver todos los comentarios</a>
+          </div>
+      </div>
+  </section>
 </main>
+
+
 <div class="alert alert-info d-none fixed-top w-50 mx-auto mt-3" role="alert" id="custom-alerta">
   ¡Respuesta subida, podrás responder de nuevo en un momento!
 </div>

frontend/users-profile.html

@@ -187,8 +187,15 @@ <h4 class="acercaDemi" id="aboutme"></h4>
             </ul>
           </div>
         </div>
-        <button class="profile-btn like-btn"><i class="bi bi-heart"></i></button>
-        <button class="profile-btn edit-btn" onclick="openEditModal()"><i class="bi bi-pencil-square"></i></button>
+        <button class="profile-btn like-btn">
+          <div class="like-icon-container">
+            <i class="bi bi-heart like-icon"></i>
+          </div>
+        </button>
+        <button class="profile-btn edit-btn" onclick="openEditModal()">
+          <div class="edit-text" id="editText">Editar</div>
+          <div class="edit-icon"><i class="bi bi-pencil-square"></i></div>
+        </button>
       </div>
       <div class="contenedor-metricas">
         <h3>Mis preguntas</h3>
@@ -222,7 +229,6 @@ <h2>Editar Perfil</h2>
 
 
 
-
   <!-- ======= Footer ======= -->
   <footer id="footer" class="footer">
     <div class="copyright">