/* ============================================================================ ckanext-sgc-theme — Branding UPeU · Portal de Datos Abiertos del SGC Paleta institucional (brand-tokens.md): azul brand #003865 · azul profundo #023052 · ámbar accent #F8A900 Se mapea sobre Bootstrap 5 + el CSS base de CKAN 2.11 (public/base/css/main.css), que define --bs-primary: #206b82 y compila botones/masthead con valores fijos. Este archivo SOLO sobreescribe; no toca el core. Carga después de `base/main`. ============================================================================ */ :root { --upeu-blue: #003865; /* brand primario (SVG oficial upeu.edu.pe) */ --upeu-blue-deep: #023052; /* hover / franjas oscuras */ --upeu-amber: #F8A900; /* acento institucional (barra del logo) */ --upeu-amber-600: #e59c00; /* ámbar hover */ --upeu-amber-700: #c98a00; /* ámbar active */ /* Bootstrap: variable primaria de CKAN 2.11 (#206b82 -> azul UPeU) */ --bs-primary: #003865; --bs-primary-rgb: 0, 56, 101; --bs-link-color: #003865; --bs-link-color-rgb: 0, 56, 101; --bs-link-hover-color: #023052; } /* ---- Cabecera estilo upeu.edu.pe -------------------------------------------- Barra superior (utilidades / Iniciar Sesión) azul profundo #023052 y barra principal (logo + menú) gris claro #EAEAEA con texto navy. Colores muestreados del propio upeu.edu.pe: top bar rgb(2,48,82) = #023052 · texto #F2F2F2 main bar rgb(234,234,234)= #EAEAEA · texto #00263D (~#003865) ------------------------------------------------------------------------- */ /* Barra superior — azul profundo (CKAN base: .account-masthead{#003647}) */ .account-masthead { background: #023052 !important; } /* El navegador pinta el lienzo bajo el contenido con el fondo de . Se iguala al footer para que no aparezca una franja blanca al fondo si la página es más corta que la pantalla. */ html { background-color: #023052; } /* Barra principal — gris claro (CKAN base: .masthead{#005d7a}) */ .masthead { background: #EAEAEA !important; border-bottom: 3px solid var(--upeu-blue); color: var(--upeu-blue); } /* Menú principal en navy; hover/activo con tinte azul suave (base: color:#fff) */ .masthead .main-navbar ul li a { color: var(--upeu-blue); } .masthead .main-navbar ul li:hover a, .masthead .main-navbar ul li:focus a, .masthead .main-navbar ul li.active a { color: var(--upeu-blue); background-color: rgba(0, 56, 101, .10); } /* Buscador del masthead sobre fondo claro (base lo asumía sobre azul) */ .masthead .section.controls .form-control, .masthead .site-search .form-control, .masthead .search-input-group .form-control { background: #fff; border-color: rgba(0, 56, 101, .35); color: var(--upeu-blue); } .masthead .site-search button, .masthead .section.controls .btn, .masthead .search-input-group .btn { color: var(--upeu-blue); } /* Logo SVG del masthead: contenerlo (el asset es el wordmark blanco+ámbar). Se iguala la especificidad de CKAN (.masthead .navbar .logo img{max-height:60px}) y se fija height explícito porque el SVG se sirve con width/height propios. */ .masthead .navbar .logo img, .masthead .logo img, .navbar-brand img { height: 44px; max-height: 44px; width: auto; } /* ---- Enlaces (CKAN base los fija en #206b82) ----------------------------- */ a { color: #003865; } a:hover, a:focus { color: #023052; } /* ---- Botón primario -> ámbar acento, texto azul (contraste ~6.4:1 AA) ---- */ .btn-primary, .btn-primary:focus { color: #003865; background-color: var(--upeu-amber); border-color: var(--upeu-amber); } .btn-primary:hover { color: #003865; background-color: var(--upeu-amber-600); border-color: var(--upeu-amber-600); } .btn-primary:active, .btn-primary.active, .btn-check:checked + .btn-primary, .show > .btn-primary.dropdown-toggle { color: #003865; background-color: var(--upeu-amber-700); border-color: var(--upeu-amber-700); } .btn-check:focus + .btn-primary, .btn-primary:focus { box-shadow: 0 0 0 .25rem rgba(248, 169, 0, .4); } /* ---- Acentos varios: badges, foco, secciones destacadas ------------------ */ .badge.bg-primary, .label-primary { background-color: var(--upeu-blue) !important; } .homepage .module-search .tags .tag, .tag { /* etiquetas -> azul UPeU */ background-color: var(--upeu-blue); border-color: var(--upeu-blue); } :focus-visible { outline: 2px solid var(--upeu-amber); outline-offset: 1px; } /* ---- Página "Acerca de / Política de Datos Abiertos" --------------------- */ .sgc-about h2 { color: var(--upeu-blue); margin-top: 1.6rem; font-size: 1.35rem; } .sgc-about .lead { color: #333; } .sgc-about .sgc-niveles th { background: var(--upeu-blue); color: #fff; } .sgc-badge { display: inline-block; padding: .18rem .55rem; border-radius: .35rem; font-size: .8rem; font-weight: 600; color: #fff; white-space: nowrap; } .sgc-badge.sgc-verde { background: #2e7d32; } .sgc-badge.sgc-ambar { background: var(--upeu-amber); color: var(--upeu-blue); } .sgc-badge.sgc-rojo { background: #b3261e; } /* ---- Iconos de categoría (grupos PNDA) — estilo PNDA/datosabiertos.gob.pe -- */ /* En el sidebar de facetas "Grupos" */ .nav-facet a[href*="groups="]::before { content: ""; display: inline-block; width: 17px; height: 17px; margin-right: .45rem; vertical-align: -3px; background-size: contain; background-repeat: no-repeat; background-position: center; } .nav-facet a[href*="groups=educacion"]::before { background-image: url(/sgc-theme/icons/educacion.svg); } .nav-facet a[href*="groups=ciencia-y-tecnologia"]::before{ background-image: url(/sgc-theme/icons/ciencia-y-tecnologia.svg); } .nav-facet a[href*="groups=desarrollo-social"]::before { background-image: url(/sgc-theme/icons/desarrollo-social.svg); } .nav-facet a[href*="groups=gobernabilidad"]::before { background-image: url(/sgc-theme/icons/gobernabilidad.svg); } .nav-facet a[href*="groups=economia-y-finanzas"]::before { background-image: url(/sgc-theme/icons/economia-y-finanzas.svg); } .nav-facet a[href*="groups=salud"]::before { background-image: url(/sgc-theme/icons/salud.svg); } .nav-facet a[href*="groups=cultura"]::before { background-image: url(/sgc-theme/icons/cultura.svg); } .nav-facet a[href*="groups=ambiente"]::before { background-image: url(/sgc-theme/icons/ambiente.svg); } /* Encabezados de faceta más ordenados (estilo PNDA) */ .filters .module-heading, .facet-heading, .nav-facet ~ .module-heading { color: var(--upeu-blue); font-weight: 600; } /* Página de Grupos: el icono centrado en la tarjeta, no estirado */ .media-image[src*="/sgc-theme/icons/"], .group-list .media-image, .media-grid .media-image { object-fit: contain; background: #f4f6f8; padding: 16px; } /* ---- Footer: exactamente el mismo fondo que la barra superior (plano) ---- */ /* La barra superior es #023052 SIN textura; el footer base traía bg.png, que lo hacía verse distinto. Se iguala: fondo plano #023052, como el top bar. */ .site-footer { background: #023052 !important; } /* Bloques oscuros de CKAN (heading de búsqueda, secciones) al azul UPeU */ .module-heading, .hero .module-search .module-content { background: transparent; }