Ajustes en formato para Portal

src/templates/acerca_de.html

@@ -3,40 +3,41 @@
 {% load filtros_de_entorno %}
 
 {% block content  %}
-<section id="interface">
+<div class="container-xl">  
+    <div class="position-relative mb-3">
+        <h3 class="i-name">
+            Acerca de...
+        </h3>
 
-    <h3 class="i-name">
-        Acerca de...
-    </h3>
+        <div class="row g-4 mb-4">
+            <table class="table app-table-hover mb-0 text-left" width="100%">
+                <thead>
+                    <tr>
+                        <td>Aplicación</td>
+                        <td>Versión</td>
+                        <td>Versión de la imagen</td>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>
+                            <h5>{{ app_name }}</h5>
+                        </td>
 
-    <div class="board">
-        <table width="100%">
-            <thead>
-                <tr>
-                    <td>Aplicación</td>
-                    <td>Versión</td>
-                    <td>Versión de la imagen</td>
-                </tr>
-            </thead>
-            <tbody>
-                <tr class="{% cycle 'fila-impar' 'fila-par' %}">
-                    <td>
-                        <h5>{{ app_name }}</h5>
-                    </td>
+                        <td>
+                            <h5>{{ app_version }}</h5>
+                        </td>
 
-                    <td>
-                        <h5>{{ app_version }}</h5>
-                    </td>
-
-                    <td>
-                        <h5>{{ img_version }}</h5>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
-        <div class="botones">
-                <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
+                        <td>
+                            <h5>{{ img_version }}</h5>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+            <div class="row g-4 mb-4">
+                    <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
+            </div>
         </div>
     </div>
-</section>
+</div>
 {% endblock %}

src/templates/agregar_cuenta.html

@@ -1,9 +1,9 @@
 {% extends "base.html" %}
 
 {% block content %}
-<section id="interface">
-    <div class="board">
-        <div class="div-form">
+<div class="container-xl">  
+    <div class="position-relative mb-3">
+        <div class="row g-4 mb-4">
             <h1>Crear Nueva Cuenta</h1>
 
             <div class="form-group">
@@ -15,9 +15,9 @@
             </div>
         </div>
 
-        <div class="botones">
+        <div class="row g-4 mb-4">
             <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
         </div>
     </div>
-</section>  
+</div>  
 {% endblock %}

src/templates/agregar_movimiento.html

@@ -1,10 +1,11 @@
 {% extends "base.html" %}
 
 {% block content %}
-<section id="interface">
-    <div class="board">
-        <div class="div-form">
+<div class="container-xl">  
+    <div class="position-relative mb-3">
+        <div class="row g-4 mb-4">
             <h1>Agregar Movimiento</h1>
+            
             <div class="form-group">
                 <form method="post">
                     {% csrf_token %}
@@ -14,9 +15,9 @@
             </div>
         </div>
 
-        <div class="botones">
+        <div class="row g-4 mb-4">
             <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
         </div>
     </div>
-</section> 
+</div> 
 {% endblock %}

src/templates/buscatotal.html

@@ -4,13 +4,13 @@
 
 {% block content %}
 
-<section id="interface">
-
+<div class="container-xl">  
+    <div class="position-relative mb-3">
     <h3 class="i-name">
         Bienvenido, {{ user.nombre }}
     </h3>
 
-    <div class="board">
+     <div class="row g-4 mb-4">
         <div class="form-group">
             <form method="get" class="form-inline mb-3">
                 <div class="row g-2 align-items-end">
@@ -65,21 +65,16 @@
                     <td class="movimiento">
                         {{ m.descripcion }}
                     </td>
-                    <td class="edit">
-                        <a href="{% url 'editar_movimiento' m.id %}">
-                            <i class="bi bi-pencil-square"></i>
-                        </a>                        
-                        <a href="{% url 'eliminar_movimiento' m.id %}">
-                            <i class="bi bi-trash3"></i>
-                        </a>                        
-                        <a href="{% url 'duplicar_movimiento' m.id %}">
-                            <i class="bi bi-copy"></i>
-                        </a>
-                    </td> 
+                    <td class="cell">
+                        <a class="btn-sm app-btn-secondary" href="{% url 'editar_movimiento' m.id %}">Editar</a>
+                        <a class="btn-sm app-btn-secondary" href="{% url 'eliminar_movimiento' m.id %}">Eliminar</a>
+                        <a class="btn-sm app-btn-secondary" href="{% url 'duplicar_movimiento' m.id %}">Duplicar</a>
+                    </td>
                 </tr>
             {% endfor %}
             </tbody>
         </table>
     </div>
-</section>
+    </div>
+</div>
 {% endblock %}

src/templates/eliminar_movimiento.html

@@ -2,18 +2,19 @@
 
 {% block content %}
 
-<section id="interface">
-    <div class="board">
+<div class="container-xl">  
+    <div class="position-relative mb-3">
         <div class="div-form">
-        <h1>¿Estás seguro de que deseas eliminar este movimiento?</h1>
-        <p>{{ movimiento.fecha|date:"d-m-Y H:i" }} - {{ movimiento.cuenta_origen.nombre }} → {{ movimiento.cuenta_destino.nombre }}: {{ movimiento.monto }}</p>
-        <div class="form-group">
-            <form method="post">
-                {% csrf_token %}
-                <button  class="btn btn-success" type="submit">Sí, eliminar</button>
-                <a href="{% url 'dashboard' %}"><button class="btn btn-danger" type="button">Cancelar</button></a>
-            </form>
+            <h1>¿Estás seguro de que deseas eliminar este movimiento?</h1>
+            <p>{{ movimiento.fecha|date:"d-m-Y H:i" }} - {{ movimiento.cuenta_origen.nombre }} → {{ movimiento.cuenta_destino.nombre }}: {{ movimiento.monto }}</p>
+            <div class="form-group">
+                <form method="post">
+                    {% csrf_token %}
+                    <button  class="btn btn-success" type="submit">Sí, eliminar</button>
+                    <a href="{% url 'dashboard' %}"><button class="btn btn-danger" type="button">Cancelar</button></a>
+                </form>
+            </div>
         </div>
     </div>
-</section>
+</div>
 {% endblock %}      

src/templates/listar_cuentas.html

@@ -3,55 +3,56 @@
 
 {% block content %}
 
-<section id="interface">
-    
-    <h3 class="i-name">
-        Mis Cuentas
-    </h3>
-    
-    <div class="board">    
-        <table width="100%">
-            <thead>
-                <tr>
-                    <td>Nombre</td>
-                    <td>Tipo</td>
-                    <td>Saldo</td>
-                    <td>Acciones</td>
-                    <td>Favorita</td>
-                </tr>
-            </thead>
+<div class="container-xl">
+    <div class="position-relative mb-3">  
+        <h3 class="i-name">
+            Mis Cuentas
+        </h3>
+        
+        <div class="row g-4 mb-4">
+            <table width="100%" class="table app-table-hover mb-0 text-left">
+                <thead>
+                    <tr>
+                        <td>Nombre</td>
+                        <td>Tipo</td>
+                        <td>Saldo</td>
+                        <td>Acciones</td>
+                        <td>Favorita</td>
+                    </tr>
+                </thead>
 
-            <tbody>
-            {% for cuenta in cuentas %}
-                <tr class="{% cycle 'fila-impar' 'fila-par' %}">
-                    <td class="movimiento">
-                        <a href="{% url 'informe_cuenta' %}?cuenta_id={{ cuenta.id }}&fecha_inicio={{ fecha_inicio }}&fecha_fin={{ fecha_fin }}">{{ cuenta.nombre }}</a>
-                    </td>
+                <tbody>
+                {% for cuenta in cuentas %}
+                    <tr class="{% cycle 'fila-impar' 'fila-par' %}">
+                        <td class="movimiento">
+                            <a href="{% url 'informe_cuenta' %}?cuenta_id={{ cuenta.id }}&fecha_inicio={{ fecha_inicio }}&fecha_fin={{ fecha_fin }}">{{ cuenta.nombre }}</a>
+                        </td>
 
-                    <td class="movimiento">
-                        {{ cuenta.tipo }}
-                    </td>
-                    
-                    <td class="movimiento-monto" style="width: 20px;">
-                        {{ cuenta.saldo|floatformat:2|intcomma }}
-                    </td>
+                        <td class="movimiento">
+                            {{ cuenta.tipo }}
+                        </td>
+                        
+                        <td class="movimiento-monto" style="width: 20px;">
+                            {{ cuenta.saldo|floatformat:2|intcomma }}
+                        </td>
 
-                    <td class="edit">                      
-                        <a href="{% url 'informe_cuenta' %}?cuenta_id={{ cuenta.id }}&fecha_inicio={{ fecha_inicio }}&fecha_fin={{ fecha_fin }}">
-                            <i class="bi bi-filetype-pdf"></i>
-                        </a>
-                    </td>   
-                    <td>{% if cuenta.favorita %}⭐{% else %}-{% endif %}</td>
-             
-                </tr>
-            {% empty %}
-                <tr><td colspan="3">No tienes cuentas aún.</td></tr>
-            {% endfor %}
-            </tbody>
-        </table>
-        <div class="botones">
-            <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
+                        <td class="edit">                      
+                            <a href="{% url 'informe_cuenta' %}?cuenta_id={{ cuenta.id }}&fecha_inicio={{ fecha_inicio }}&fecha_fin={{ fecha_fin }}">
+                                <i class="bi bi-filetype-pdf"></i>
+                            </a>
+                        </td>   
+                        <td>{% if cuenta.favorita %}⭐{% else %}-{% endif %}</td>
+                
+                    </tr>
+                {% empty %}
+                    <tr><td colspan="3">No tienes cuentas aún.</td></tr>
+                {% endfor %}
+                </tbody>
+            </table>
+            <div class="row g-4 mb-4">
+                <a href="{% url 'dashboard' %}"><button class="btn btn-secondary" type="button">Volver al Dashboard</button></a>
+            </div>
         </div>
     </div>
-</section>
+</div>
 {% endblock %}