butterfly/themes/sunset-mesh/login.scss
Claude fc6e04e659 Fix temas: background não aparecia (body do login é .welcome-anonymous)
O body da tela de login do GLPI 11 é <body class="welcome-anonymous">;
.page-anonymous fica no <main>. Os seletores body.page-anonymous nunca
casavam e o cinza padrão do Tabler ficava por cima. Agora o fundo é
aplicado em body.welcome-anonymous, body.login-page e main.page-anonymous
(background-attachment: fixed alinha as camadas no viewport).

Gotcha de dev: o cache do compileScss é chaveado pelo texto do @import,
não pelo conteúdo do arquivo — editar login.scss exige ?reload=1 na URL
do login para recompilar.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-03 20:31:32 -03:00

80 lines
2.1 KiB
SCSS

/* Tema Sunset Mesh — mesh gradient quente */
$btn-background-color: #1f1235 !default;
$btn-foreground-color: #ffffff !default;
body.welcome-anonymous,
body.login-page,
main.page-anonymous {
min-height: 100vh;
background-color: #fff1eb;
background-image:
radial-gradient(45% 55% at 10% 15%, rgba(255, 122, 89, 0.55) 0%, transparent 70%),
radial-gradient(50% 60% at 90% 10%, rgba(255, 190, 92, 0.50) 0%, transparent 70%),
radial-gradient(55% 65% at 85% 85%, rgba(196, 113, 245, 0.40) 0%, transparent 70%),
radial-gradient(45% 55% at 15% 90%, rgba(250, 113, 133, 0.45) 0%, transparent 70%);
background-attachment: fixed;
}
.page-anonymous .main-content-card .card-body {
background: rgba(255, 255, 255, 0.72);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border: 1px solid rgba(255, 255, 255, 0.85);
border-radius: 22px;
padding: 2.3rem !important;
box-shadow: 0 22px 55px rgba(148, 63, 106, 0.22);
}
.page-anonymous .card-header {
color: #3b1d54;
border: 0;
background: transparent;
font-weight: 700;
}
.page-anonymous .form-label {
color: #6b4a7e;
font-weight: 500;
}
.page-anonymous .form-control,
.page-anonymous .form-select {
background: rgba(255, 255, 255, 0.85);
border: 1px solid rgba(196, 113, 245, 0.30);
border-radius: 12px;
color: #3b1d54;
padding: 0.65rem 0.85rem;
&:focus {
background: #ffffff;
border-color: #c471f5;
box-shadow: 0 0 0 0.25rem rgba(196, 113, 245, 0.20);
}
}
.page-anonymous .btn.btn-primary {
background: $btn-background-color;
border: 0;
border-radius: 12px;
color: $btn-foreground-color;
padding: 0.7rem;
font-weight: 600;
letter-spacing: 0.02em;
box-shadow: 0 12px 26px rgba(31, 18, 53, 0.35);
transition: transform 0.15s ease, box-shadow 0.15s ease;
&:hover {
transform: translateY(-1px);
box-shadow: 0 16px 32px rgba(31, 18, 53, 0.45);
}
}
.page-anonymous .text-muted,
.page-anonymous .copyright {
color: #8a6aa0 !important;
}
.page-anonymous a {
color: #7828c8 !important;
}