From c37d79d9e9595128001169b4d2a3753de5077f90 Mon Sep 17 00:00:00 2001
From: iyanfdezz <uo288231@uniovi.es>
Date: Mon, 11 Mar 2024 12:27:02 +0100
Subject: [PATCH] Format fixes

---
 webapp/src/pages/Sobre/Sobre.css | 64 +++++++++++++++++++++-----------
 webapp/src/pages/Sobre/Sobre.js  | 56 +++++++++++++++++++---------
 2 files changed, 81 insertions(+), 39 deletions(-)

diff --git a/webapp/src/pages/Sobre/Sobre.css b/webapp/src/pages/Sobre/Sobre.css
index 68a3a232..b07fe3f3 100644
--- a/webapp/src/pages/Sobre/Sobre.css
+++ b/webapp/src/pages/Sobre/Sobre.css
@@ -1,22 +1,44 @@
-.games-container{
-    display: grid;
-    grid-template-columns: 1fr;
-    justify-content: center;
-}
-
-ul{
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    grid-template-columns: 1fr;
-    list-style-type: none;
-    text-align: center;
-    gap: 1rem;
-    margin: 1rem;
-    padding: 0;
-}
-
-ul li{
+.sobre-container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 20px;
+  }
+  
+  .sobre-container h1 {
+    font-size: 24px;
+  }
+  
+  .sobre-container h2 {
+    font-size: 20px;
+    margin-bottom: 20px;
+  }
+  
+  .designers-table {
+    width: 100%;
+    border-collapse: collapse;
+    margin-top: 20px;
+  }
+  
+  .designers-table th, .designers-table td {
+    border: 1px solid #ddd;
+    padding: 8px;
+    text-align: left;
+  }
+  
+  .designers-table th {
+    background-color: #f2f2f2;
+  }
+  
+  .designers-table tr:nth-child(even) {
+    background-color: #f2f2f2;
+  }
+  
+  .designers-table a {
     text-decoration: none;
-    
-}
\ No newline at end of file
+    color: #333;
+  }
+  
+  .designers-table a:hover {
+    text-decoration: underline;
+  }
+  
\ No newline at end of file
diff --git a/webapp/src/pages/Sobre/Sobre.js b/webapp/src/pages/Sobre/Sobre.js
index c5d9588c..54514024 100644
--- a/webapp/src/pages/Sobre/Sobre.js
+++ b/webapp/src/pages/Sobre/Sobre.js
@@ -4,21 +4,41 @@ import Nav from '../../components/Nav/Nav.js';
 import Footer from '../../components/Footer/Footer.js';
 
 const Sobre = () => {
-    return (
-      <>
-        <Nav />
-        <div className="games-container">
-          <hgroup>
-            <h1>Estos son los diseñadores de la aplicación</h1>
-            <h2>Martín Cancio Barrera - UO287561</h2>
-            <h2>Iyán Fernández Riol - UO288231</h2>
-            <h2>Rodrigo García Iglesias - UO276396</h2>
-            <h2>Alfredo Jirout Cid - UO288443</h2>
-          </hgroup>         
-        </div>
-        <Footer />
-      </>
-    );
-  };
-  
-  export default Sobre;
\ No newline at end of file
+  const designers = [
+    { name: 'Martín Cancio Barrera', id: 'UO287561', github: 'https://github.com/CANCI0' },
+    { name: 'Iyán Fernández Riol', id: 'UO288231', github: 'https://github.com/iyanfdezz' },
+    { name: 'Rodrigo García Iglesias', id: 'UO276396', github: 'https://github.com/Rodrox11' },
+    { name: 'Alfredo Jirout Cid', id: 'UO288443', github: 'https://github.com/UO288443' }
+  ];
+
+  return (
+    <>
+      <Nav />
+      <div className="sobre-container">
+        <h1>Equipo WIQ_es1a</h1>
+        <h2>Nuestro equipo de desarrollo</h2>
+        <table className="designers-table">
+          <thead>
+            <tr>
+              <th>Nombre</th>
+              <th>UO</th>
+              <th>GitHub</th>
+            </tr>
+          </thead>
+          <tbody>
+            {designers.map((designer, index) => (
+              <tr key={index}>
+                <td>{designer.name}</td>
+                <td>{designer.id}</td>
+                <td><a href={designer.github} target="_blank" rel="noopener noreferrer">Mi GitHub</a></td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+      <Footer />
+    </>
+  );
+};
+
+export default Sobre;
\ No newline at end of file