feat: UI changes

novosga · Oct 29, 2024 · 23a7f57 · 23a7f57
1 parent d1491a8
commit 23a7f57
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 45 deletions.
diff --git a/src/Resources/views/default/form.html.twig b/src/Resources/views/default/form.html.twig
@@ -4,15 +4,14 @@
 
 {% block body %}
 <div id="users-form">
-    <h1>
-        <i class="fa fa-users" aria-hidden="true"></i>
-        {{ 'title'|trans }}
-        <small>
-            {{ 'subtitle'|trans }}
-        </small>
-    </h1>
-
-    <hr>
+    <div class="d-flex">
+        <div>
+            <h1>
+                <i class="fa fa-users" aria-hidden="true"></i> {{ 'title'|trans }}
+            </h1>
+            <p>{{ 'subtitle'|trans }}</p>
+        </div>
+    </div>
 
     {{ form_start(form) }}
 
@@ -72,7 +71,7 @@
                     {% endif %}
                 </fieldset>
             </div>
-            <div class="col-6 ml-auto" id="lotacoes">
+            <div class="col-6 ms-auto" id="lotacoes">
                 <fieldset>
                     <legend>{{ 'section.lotation.title'|trans }}</legend>
 
@@ -130,14 +129,12 @@
             </div>
         </div>
 
-        <hr>
-
-        <div class="buttons">
+        <div class="d-flex">
             <button type="submit" class="btn btn-primary">
                 <i class="fa fa-check"></i> 
                 {{ 'button.save'|trans }}
             </button>
-            <a href="{{ path('novosga_users_index') }}" class="btn btn-secondary">
+            <a href="{{ path('novosga_users_index') }}" class="btn btn-link text-decoration-none ms-2">
                 <i class="fa fa-chevron-left"></i>
                 {{ 'button.back'|trans }}
             </a>

diff --git a/src/Resources/views/default/index.html.twig b/src/Resources/views/default/index.html.twig
@@ -3,43 +3,40 @@
 {% trans_default_domain 'NovosgaUsersBundle' %}
 
 {% block body %}
-    <div class="row">
-        <div class="col-md-6  col-lg-8">
+    <div class="d-flex">
+        <div>
             <h1>
-                <i class="fa fa-users" aria-hidden="true"></i>
-                {{ 'title'|trans }}
-                <small>
-                    {{ 'subtitle'|trans }}
-                </small>
+                <i class="fa fa-users" aria-hidden="true"></i> {{ 'title'|trans }}
             </h1>
+            <p>{{ 'subtitle'|trans }}</p>
         </div>
-        <div class="col-md-6 col-lg-4 text-end">
-            <form class="form-inline">
-                <div class="input-group">
-                    <input type="text" class="form-control" name="q" placeholder="{{ 'label.search'|trans }}" value="{{ app.request.get('q') }}">
-                    <span class="input-group-btn">
-                        <button type="submit" class="btn btn-secondary">
-                            <i class="fa fa-search"></i>
-                        </button>
-                    </span>
-                </div>
-                <a href="{{ path('novosga_users_new') }}" class="btn btn-primary ml-auto">
-                    <i class="fa fa-plus"></i>
-                    {{ 'button.new_user'|trans }}
-                </a>
-            </form>
+        <form class="ms-auto me-3 mt-3">
+            <div class="input-group">
+                <input type="text" class="form-control" name="q" placeholder="{{ 'label.search'|trans }}" value="{{ app.request.get('q') }}">
+                <span class="input-group-btn">
+                    <button type="submit" class="btn btn-secondary">
+                        <i class="fa fa-search"></i>
+                    </button>
+                </span>
+            </div>
+        </form>
+        <div class="mt-3">
+            <a href="{{ path('novosga_users_new') }}" class="btn btn-primary ml-auto">
+                <i class="fa fa-plus"></i>
+                {{ 'button.new_user'|trans }}
+            </a>
         </div>
     </div>
-
-    <hr>
 
-    <table class="table table-bordered">
-        <thead class="thead-light">
-            <th>#</th>
-            <th>{{ 'label.username'|trans }}</th>
-            <th>{{ 'label.name'|trans }}</th>
-            <th>{{ 'label.status'|trans }}</th>
-            <th></th>
+    <table class="table table-hover border">
+        <thead>
+            <tr class="table-primary">
+                <th>#</th>
+                <th>{{ 'label.username'|trans }}</th>
+                <th>{{ 'label.name'|trans }}</th>
+                <th>{{ 'label.status'|trans }}</th>
+                <th></th>
+            </tr>
         </thead>
         <tbody>
             {% for usuario in usuarios %}