@charset "UTF-8"; /* * Tema AREPC — Associação Residencial Ecológica Patrimônio do Carmo * Paleta extraída do logotipo institucional: * #3e4095 indigo (fundo do logo, cor dominante) * #03086e azul (moldura) * #60ad1d verde (colina) * #ed8522 laranja (sol e pássaro) * * O verde de marca (#60ad1d) atinge apenas 4,0:1 sobre branco, abaixo do * mínimo de 4,5:1 para texto. Para elementos de ação usamos #427a14, que * mantém a mesma matiz e atinge 5,2:1. O verde original fica reservado * para superfícies e para a amostra da paleta. */ :root[data-glpi-theme=patrimoniodocarmo] { --tblr-primary-rgb: 66, 122, 20; --tblr-primary-fg: #fff; --tblr-link-color-rgb: 62, 64, 149; --glpi-mainmenu-bg: #3e4095; --glpi-mainmenu-fg: #fff; --glpi-helpdesk-header: #e0edd4; --glpi-palette-color-1: #3e4095; --glpi-palette-color-2: #fff; --glpi-palette-color-3: #60ad1d; --glpi-palette-color-4: #ed8522; } /* * Logotipo AREPC no lugar do logotipo GLPI. * * Caminhos absolutos de proposito: este tema e servido por /front/css.php, * entao um caminho relativo resolveria a partir de /front/ e nao a partir * de /css/ como acontece em css/includes/_base.scss. * * Os arquivos sao gerados por tools/make-logos.php a partir de * planilhas/logo-01.jpg: fundo #3e4095 removido para transparencia, arte * recortada (110x112) e centrada em tela quadrada. */ :root[data-glpi-theme=patrimoniodocarmo] { --glpi-logo-light: url("/pics/logos/arepc-logo.png?v=2"); --glpi-logo-light-reduced: url("/pics/logos/arepc-logo-mark.png?v=2"); --glpi-logo-dark: url("/pics/logos/arepc-logo.png?v=2"); --glpi-logo-dark-reduced: url("/pics/logos/arepc-logo-mark.png?v=2"); --glpi-logo-dark-login: url("/pics/logos/arepc-logo.png?v=2"); --glpi-logo-light-login: url("/pics/logos/arepc-logo.png?v=2"); } /* * Enquadramento. * * O GLPI dimensiona a caixa do logo para uma marca larga: em * css/includes/_base.scss a regra e `height: 55px; width: 100px` sem * `background-size`, ou seja `auto` — a imagem e desenhada no tamanho * natural e o que passa de 55px de altura fica cortado. A marca da AREPC e * quadrada, entao a caixa precisa ser quadrada e a imagem precisa caber * dentro dela. */ :root[data-glpi-theme=patrimoniodocarmo] .page .glpi-logo { width: 100%; height: 72px; background-size: contain; background-position: center; } /* * Topo do autoatendimento (menu horizontal). * * Aqui a regra acima nao serve: no topo, o link do logo (.navbar-brand) nao * tem largura propria, cresce com o conteudo. `width: 100%` de uma caixa sem * largura da zero, e o logo sumia, deixando so um vao antes do menu. A caixa * tem tamanho fixo, na proporcao da imagem. * * A imagem e o selo original (public/pics/logos/arepc-logo-selo.jpg, identico * a planilhas/logo-01.jpg, 134x137), escolhido pela AREPC. O fundo dele e o * mesmo indigo do topo (#3e4095), entao ele se funde a barra, e sai sem o * contorno serrilhado da versao recortada. 60px de altura: em tela de alta * densidade fica perto do tamanho natural do arquivo, sem ampliar. */ :root[data-glpi-theme=patrimoniodocarmo] .page .topbar .glpi-logo { background-image: url("/pics/logos/arepc-logo-selo.jpg?v=1"); width: 59px; height: 60px; background-size: contain; background-position: center; } /* * Tela de login: o seletor original usa `content: var(--logo)`, o que trata * o elemento como imagem substituida — width/height a esticariam. Mantemos * a proporcao com object-fit e uma caixa quadrada. */ :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .glpi-logo { width: 128px; height: 128px; object-fit: contain; margin-inline: auto; } /* * Tela de login: pagina em branco, cartao no azul do interior do * logotipo (#030870, medido na arte de origem). * * O seletor comeca em :root porque o atributo do tema fica no ; as * classes .welcome-anonymous / .page-anonymous so existem nas telas sem * sessao, entao nada disso vaza para o sistema logado. * * Os campos ficam com fundo branco de proposito: texto escuro sobre branco * e mais legivel para digitacao do que texto claro sobre o azul. */ :root[data-glpi-theme=patrimoniodocarmo] body.welcome-anonymous { background-color: #fff; } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card { background-color: #030870; border-color: #030870; box-shadow: 0 8px 28px rgba(3, 8, 112, 0.28); } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card h2, :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-label, :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-check-label { color: #fff; } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .card-header { background-color: transparent; border-bottom-color: rgba(255, 255, 255, 0.12); } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-control, :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-select { background-color: #fff; border-color: rgba(255, 255, 255, 0.3); color: #1a1d21; } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-control:focus, :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-select:focus { border-color: #60ad1d; box-shadow: 0 0 0 0.2rem rgba(96, 173, 29, 0.4); } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-check-input { background-color: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.45); } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card .form-check-input:checked { background-color: #60ad1d; border-color: #60ad1d; } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card a { color: #cfe3b8; } :root[data-glpi-theme=patrimoniodocarmo] .page-anonymous .main-content-card a:hover { color: #fff; }