comunatec/controles
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: ajustes visuais - degradê, card branco, logo e barra vermelha

Browse Source
This commit is contained in:
andersonid
2025-04-02 14:55:01 -03:00
parent b815f77240
commit 1ff8e97bbc
3 changed files with 19 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
static/css/style.css
View File

@@ -21,7 +21,8 @@ body {
.navbar {
background: var(--secondary-color) !important;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
border-top: 3px solid var(--primary-color);
border-bottom: 3px solid var(--primary-color);
padding: 0.5rem 1rem;
}
.navbar-brand {
@@ -41,13 +42,14 @@ body {
height: 35px;
width: auto;
margin-right: 10px;
object-fit: contain;
display: block;
}
.login-logo {
height: 100px;
width: auto;
object-fit: contain;
display: block;
margin: 0 auto;
}
.nav-link {

4
templates/base.html
View File

@@ -16,9 +16,9 @@
{% if current_user is defined and current_user.is_authenticated %}
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="{{ url_for('home') }}">
<a class="navbar-brand" href="{{ url_for('home') }}">
<img src="{{ url_for('static', filename='img/logo002-alpha.png') }}" alt="Logo OCI" class="navbar-logo">
Controles OCI
<span>Controles OCI</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>

32
templates/login.html
View File

@@ -9,7 +9,7 @@
<div class="card-body p-4 p-sm-5">
<div class="text-center mb-4">
<img src="{{ url_for('static', filename='img/logo002-alpha.png') }}" alt="Logo OCI" class="login-logo">
<h2 class="card-title mb-4 text-light">Controles OCI</h2>
<h2 class="card-title mb-4">Controles OCI</h2>
</div>
{% with messages = get_flashed_messages(with_categories=true) %}
@@ -25,20 +25,20 @@
<form method="POST" action="{{ url_for('login') }}" class="needs-validation" novalidate>
<div class="form-floating mb-3">
<input type="email" class="form-control bg-dark text-light" id="email" name="email" placeholder="Email" required autofocus>
<label for="email" class="text-light-50">Email</label>
<div class="invalid-feedback text-light">
<input type="email" class="form-control" id="email" name="email" placeholder="Email" required autofocus>
<label for="email">Email</label>
<div class="invalid-feedback">
Por favor, informe seu email.
</div>
</div>
<div class="form-floating mb-4">
<input type="password" class="form-control bg-dark text-light" id="senha" name="senha" placeholder="Senha" required>
<label for="senha" class="text-light-50">Senha</label>
<div class="invalid-feedback text-light">
<input type="password" class="form-control" id="senha" name="senha" placeholder="Senha" required>
<label for="senha">Senha</label>
<div class="invalid-feedback">
Por favor, informe sua senha.
</div>
<button class="btn btn-link text-light position-absolute end-0 top-50 translate-middle-y me-2" type="button" id="togglePassword">
<button class="btn btn-link text-secondary position-absolute end-0 top-50 translate-middle-y me-2" type="button" id="togglePassword">
<i class="fas fa-eye"></i>
</button>
</div>
@@ -53,7 +53,7 @@
</div>
<div class="text-center mt-4">
<small class="text-light">
<small class="text-dark">
Precisa de ajuda? Entre em contato com o administrador.
</small>
</div>
@@ -97,38 +97,30 @@ document.addEventListener('DOMContentLoaded', function() {
<style>
body {
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
background: linear-gradient(135deg, var(--primary-color), white);
min-height: 100vh;
}
.card {
background-color: rgba(45, 45, 45, 0.95);
background-color: white;
border: none;
border-radius: 15px;
backdrop-filter: blur(10px);
}
.login-logo {
height: 100px;
width: auto;
margin-bottom: 1rem;
filter: drop-shadow(0 0 10px rgba(255,255,255,0.1));
}
.form-control {
border: 1px solid rgba(255,255,255,0.1);
}
.form-control:focus {
background-color: var(--secondary-dark) !important;
border-color: var(--primary-color);
box-shadow: 0 0 0 0.25rem rgba(232, 0, 12, 0.25);
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
color: var(--primary-light);
opacity: 0.8;
color: var(--primary-color);
}
.btn-danger {