Modified a couple stuff of visuals

Arquisoft · Mar 4, 2024 · 798f516 · 798f516
1 parent 2940287
commit 798f516
Show file tree

Hide file tree

Showing 10 changed files with 49 additions and 28 deletions.
diff --git a/src/main/resources/messages.properties b/src/main/resources/messages.properties
@@ -18,8 +18,8 @@ navbar.profile=Perfil
 navbar.logout=Cerrar sesión
 
 # -------------------Statements for the footer.html file---------------------
-footer.copyright=ASW - Grupo 04 B
-
+footer.copyright=© ASW - Grupo 04 B
+footer.nav=Menú de navegación
 
 # -------------------Statements for the error.html file---------------------
 error.page.title=Error!

diff --git a/src/main/resources/messages_en.properties b/src/main/resources/messages_en.properties
@@ -18,7 +18,8 @@ navbar.profile=Profile
 navbar.logout=Log Out
 
 # -------------------Statements for the footer.html file---------------------
-footer.copyright=ASW - Group 04 B
+footer.copyright=© ASW - Group 04 B
+footer.nav=Navigation
 
 # -------------------Statements for the error.html file---------------------
 error.page.title=Error!

diff --git a/src/main/resources/messages_es.properties b/src/main/resources/messages_es.properties
@@ -19,7 +19,8 @@ navbar.logout=Cerrar sesión
 
 
 # -------------------Statements for the footer.html file---------------------
-footer.copyright=ASW - Grupo 04 B
+footer.copyright=© ASW - Grupo 04 B
+footer.nav=Menú de navegación
 
 # -------------------Statements for the error.html file---------------------
 error.page.title=Error!

diff --git a/src/main/resources/static/css/api.css b/src/main/resources/static/css/api.css
@@ -0,0 +1,10 @@
+.api-table th, .api-table td {
+    vertical-align: top;
+    text-align: left;
+}
+.example-response {
+    background-color: #f0f4f8; /* Light grey-blue background for readability */
+    border-radius: 0.25rem; /* Rounded corners */
+    padding: 1rem; /* Padding inside the box */
+    border: 1px solid #d3d3d3; /* Light grey border */
+}
diff --git a/src/main/resources/static/css/footer.css b/src/main/resources/static/css/footer.css
@@ -4,9 +4,9 @@
 .footer {
     position: absolute;
     bottom: 0;
+    min-height: 75px;
     width: 100%;
-    height: 60px;
-    margin: 0; /* Eliminar margen */
+    margin-top: 10%; /* Eliminar margen */
     background: linear-gradient(45deg, #283048, #586776); /* Gradiente de fondo */
     color: #fff; /* Texto blanco */
     padding: 0; /* Eliminar relleno */

diff --git a/src/main/resources/static/css/style.css b/src/main/resources/static/css/style.css
@@ -9,7 +9,11 @@ html {
 /* Estilo para el contenedor principal */
 .container {
     max-width: 960px; /* Ancho máximo del contenido */
-    margin: 50px auto; /* Centrar el contenido y agregar un margen superior e inferior */
+    margin: 5% auto; /* Centrar el contenido y agregar un margen superior e inferior */
+}
+
+.container-fluid {
+    margin: 5% auto; /* Centrar el contenido y agregar un margen superior e inferior */
 }
 
 /* Estilo para los títulos */

diff --git a/src/main/resources/templates/api/apiHome.html b/src/main/resources/templates/api/apiHome.html
@@ -2,25 +2,14 @@
 <html lang="en" xmlns:th="http://www.thymeleaf.org">
 <head th:replace="~{fragments/head}">
 <body>
-<style>
-    .api-table th, .api-table td {
-        vertical-align: top;
-        text-align: left;
-    }
-    .example-response {
-        background-color: #f0f4f8; /* Light grey-blue background for readability */
-        border-radius: 0.25rem; /* Rounded corners */
-        padding: 1rem; /* Padding inside the box */
-        border: 1px solid #d3d3d3; /* Light grey border */
-    }
-</style>
+<link rel="stylesheet" th:href="@{/css/api.css}" />
 <nav th:replace="~{fragments/nav}"></nav>
 
 <div class="container-fluid mt-5">
+    <h2 th:text="#{api.doc.title}"></h2>
     <div class="row">
         <!-- Lateral Navigation Sidebar -->
-        <div class="col-md-2">
-            <h2 th:text="#{api.doc.title}"></h2>
+        <div class="col-md-2 pr-md-3">
             <p th:text="#{api.doc.description}"></p>
             <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
                 <a class="nav-link active" id="v-pills-players-tab" data-toggle="pill" href="#v-pills-players" role="tab" aria-controls="v-pills-players" aria-selected="true">/api/players</a>

diff --git a/src/main/resources/templates/fragments/footer.html b/src/main/resources/templates/fragments/footer.html
@@ -1,6 +1,22 @@
 <!-- footer.html -->
 <footer class="footer bg-primary">
   <div class="container">
-    <span class="text-white bg-primary">&copy; ASW - Grupo 04 B</span>
+    <!-- Navigation Menu to the left -->
+    <div class="row">
+      <div class="col-md-4">
+        <nav class="nav flex-column">
+          <a class="nav-link text-white" href="/api">API docs</a>
+        </nav>
+      </div>
+
+      <!-- Centered Copyright Notice -->
+      <div class="col-md-4 text-center">
+        <span class="text-white" th:text="#{footer.copyright}"></span>
+      </div>
+
+      <div class="col-md-4"></div>
+    </div>
   </div>
 </footer>
+
+
diff --git a/src/main/resources/templates/player/login.html b/src/main/resources/templates/player/login.html
@@ -9,14 +9,14 @@
   <h2 th:text="#{login.title}"> </h2>
   <form class="form-horizontal" method="post" action="/login">
     <div class="form-group">
-      <label class="control-label col-sm-2" for="username" th:text="#{login.username.label}"></label>
+      <label class="control-label col-sm-10" for="username" th:text="#{login.username.label}"></label>
       <div class="col-sm-10">
         <input type="text" class="form-control" id="username" name="username"
                th:placeholder="#{login.username.placeholder}" required="true" />
       </div>
     </div>
     <div class="form-group">
-      <label class="control-label col-sm-2" for="password" th:text="#{login.password.label}"></label>
+      <label class="control-label col-sm-10" for="password" th:text="#{login.password.label}"></label>
       <div class="col-sm-10">
         <input type="password" class="form-control" id="password" name="password"
                th:placeholder="#{login.password.placeholder}" required="true" />

diff --git a/src/main/resources/templates/player/signup.html b/src/main/resources/templates/player/signup.html
@@ -8,31 +8,31 @@
     <h2 th:text="#{signup.title}"></h2>
     <form class="form-horizontal" th:object="${user}" method="post" action="/signup">
         <div class="form-group">
-            <label class="control-label col-sm-2" for="username" th:text="#{signup.username.label}"> </label>
+            <label class="control-label col-sm-10" for="username" th:text="#{signup.username.label}"> </label>
             <div class="col-sm-10">
                 <input type="text" class="form-control" id="username" name="username"
                        th:placeholder="#{signup.username.placeholder}" required="true"/>
                 <span class="text-danger" th:if="${#fields.hasErrors('username')}" th:errors="*{username}"></span>
             </div>
         </div>
         <div class="form-group">
-            <label class="control-label col-sm-2" for="email" th:text="#{signup.email.label}"></label>
+            <label class="control-label col-sm-10" for="email" th:text="#{signup.email.label}"></label>
             <div class="col-sm-10">
                 <input type="text" class="form-control" id="email" name="email"
                        th:placeholder="#{signup.email.placeholder}" required="true" />
                 <span class="text-danger" th:if="${#fields.hasErrors('email')}" th:errors="*{email}"></span>
             </div>
         </div>
         <div class="form-group">
-            <label class="control-label col-sm-2" for="password" th:text="#{signup.password.label}"></label>
+            <label class="control-label col-sm-10" for="password" th:text="#{signup.password.label}"></label>
             <div class="col-sm-10">
                 <input type="password" id="password" class="form-control" name="password"
                        th:placeholder="#{signup.password.placeholder}" />
                 <span class="text-danger" th:if="${#fields.hasErrors('password')}" th:errors="*{password}"></span>
             </div>
         </div>
         <div class="form-group">
-            <label class="control-label col-sm-2" for="passwordConfirm" th:text="#{signup.passwordConfirm.label}"></label>
+            <label class="control-label col-sm-10" for="passwordConfirm" th:text="#{signup.passwordConfirm.label}"></label>
             <div class="col-sm-10">
                 <input type="password" id="passwordConfirm" class="form-control" name="passwordConfirm"
                        th:placeholder="#{signup.passwordConfirm.placeholder}" />