feat: melhorias na interface da home e navbar - Ajustes no layout da navbar e menu - Correção do logo e nome do sistema - Melhorias no estilo dos cards da dashboard - Ajustes nas permissões e autenticação - Correção de bugs na exibição de mensagens

This commit is contained in:
andersonid
2025-04-03 20:58:02 -03:00
parent 50516664e4
commit 241543ea63
12 changed files with 506 additions and 779 deletions

View File

@@ -34,106 +34,139 @@
.navbar {
background: #343a40 !important;
padding: 0.5rem;
padding: 0.5rem 1rem;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
border-bottom: var(--navbar-stripe);
}
.navbar > .container-fluid {
width: 100%;
max-width: 1140px;
max-width: 1320px;
margin: 0 auto;
padding: 0.5rem 1rem;
}
@media (max-width: 1200px) {
.navbar > .container-fluid {
max-width: 960px;
}
}
@media (max-width: 992px) {
.navbar > .container-fluid {
max-width: 720px;
}
}
@media (max-width: 768px) {
.navbar > .container-fluid {
max-width: 540px;
padding: 0.5rem;
}
}
@media (max-width: 576px) {
.navbar > .container-fluid {
width: 100%;
padding: 0.5rem;
}
padding: 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.navbar-brand {
font-weight: bold;
color: var(--primary-color) !important;
flex: 0 0 auto;
margin-right: 2rem;
font-weight: 500;
color: #fff !important;
display: flex;
align-items: center;
margin-right: 3rem;
white-space: nowrap;
font-size: 1.2rem;
}
.navbar-brand img {
height: 40px;
margin-right: 10px;
height: 35px;
margin-right: 0.75rem;
}
#navbarNav {
display: flex;
justify-content: center;
flex-grow: 1;
flex: 1;
}
.navbar-nav.me-auto {
margin: 0 auto !important;
.navbar-nav.mx-auto {
margin: 0 auto;
}
.navbar-nav:last-child {
margin-left: auto;
flex: 0 0 auto;
margin-left: 2rem;
}
.nav-link {
color: #fff !important;
transition: color 0.3s ease;
padding: 0.5rem 1rem;
color: rgba(255,255,255,0.85) !important;
transition: all 0.2s ease;
padding: 0.75rem 1rem;
white-space: nowrap;
font-size: 0.95rem;
font-weight: 400;
letter-spacing: 0.3px;
}
.nav-link:hover {
color: rgba(255, 255, 255, 0.8) !important;
color: #fff !important;
background-color: var(--primary-color);
border-radius: 4px;
}
.nav-link.active {
color: rgba(255, 255, 255, 0.9) !important;
font-weight: 500;
.nav-link i {
font-size: 0.9rem;
opacity: 0.9;
margin-right: 0.5rem;
}
.dropdown-menu {
border: none;
box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
background-color: #343a40;
border: 1px solid rgba(255,255,255,0.1);
box-shadow: 0 4px 15px rgba(0,0,0,0.2);
padding: 0.5rem;
margin-top: 0.5rem;
border-radius: 8px;
min-width: 200px;
}
.dropdown-item {
padding: 0.5rem 1.5rem;
transition: background-color 0.2s ease;
color: rgba(255,255,255,0.85) !important;
font-size: 0.9rem;
font-weight: 400;
padding: 0.6rem 1rem;
transition: all 0.2s ease;
border-radius: 6px;
}
.dropdown-item:hover {
background-color: #f8f9fa;
background-color: var(--primary-color);
color: #fff !important;
transform: translateX(3px);
}
.dropdown-item i {
margin-right: 0.5rem;
margin-right: 0.75rem;
width: 1.25rem;
text-align: center;
font-size: 0.9rem;
opacity: 0.9;
}
.dropdown-divider {
border-top: 1px solid rgba(255,255,255,0.1);
margin: 0.5rem 0;
}
/* Estilo para o menu mobile */
@media (max-width: 768px) {
.navbar-collapse {
background-color: #343a40;
padding: 1rem;
border-radius: 0 0 10px 10px;
margin-top: 0.5rem;
}
.navbar-brand img {
height: 30px;
}
.dropdown-menu {
background-color: rgba(0,0,0,0.2);
margin-left: 1rem;
min-width: auto;
}
.nav-link {
padding: 0.5rem 1rem;
}
.navbar-nav {
flex-direction: column;
align-items: stretch;
}
}
.container {
@@ -474,9 +507,9 @@
</button>
{% if session.get('user_id') %}
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav me-auto">
<ul class="navbar-nav mx-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">
<a class="nav-link" href="#" data-bs-toggle="dropdown">
<i class="fas fa-users me-1"></i>Militantes
</a>
<ul class="dropdown-menu">
@@ -488,7 +521,7 @@
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">
<a class="nav-link" href="#" data-bs-toggle="dropdown">
<i class="fas fa-dollar-sign me-1"></i>Financeiro
</a>
<ul class="dropdown-menu">
@@ -505,7 +538,7 @@
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">
<a class="nav-link" href="#" data-bs-toggle="dropdown">
<i class="fas fa-box me-1"></i>Materiais
</a>
<ul class="dropdown-menu">
@@ -527,7 +560,7 @@
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">
<a class="nav-link" href="#" data-bs-toggle="dropdown">
<i class="fas fa-chart-bar me-1"></i>Relatórios
</a>
<ul class="dropdown-menu">
@@ -546,7 +579,7 @@
</ul>
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">
<a class="nav-link" href="#" data-bs-toggle="dropdown">
<i class="fas fa-user me-1"></i>{{ session.get('username', 'Usuário') }}
</a>
<ul class="dropdown-menu dropdown-menu-end">
@@ -574,16 +607,6 @@
<div class="page-wrapper">
<div class="container py-4">
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<div class="alert alert-{{ category }} alert-dismissible fade show" role="alert">
{{ message }}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
{% endfor %}
{% endif %}
{% endwith %}
{% block content %}{% endblock %}
</div>
</div>