/** * @file * Organisation badge (akp_source_badge formatter). * * Rest state is grey and toned down; hover/focus restores colour and opacity * only, never a size. Skin with the --akp-source-* tokens; each falls back to * the Bootstrap preset variable. */ .akp-source-badge { --akp-source-badge-size: 30px; --akp-source-badge-max-width: 60px; --akp-source-badge-opacity: 0.65; } .akp-source-badge__link img { height: var(--akp-source-badge-size); width: auto; max-width: var(--akp-source-badge-max-width); object-fit: contain; filter: grayscale(1); opacity: var(--akp-source-badge-opacity); transition: filter 0.3s ease, opacity 0.3s ease; } .akp-source-badge__link:hover img, .akp-source-badge__link:focus-visible img { filter: grayscale(0); opacity: 1; } /* Touch: no hover, so show the logo in colour. */ @media (hover: none) { .akp-source-badge__link img { filter: grayscale(0); opacity: 1; } } /* Field wrapper classes come from bootstrap_barrio's field.html.twig (label hidden + multi-value): badges flow as an inline row, and the base theme's 1.2em bottom margin on entity-reference fields is cancelled so the icon sits on the centre line of the neighbouring tag or title. */ .akp-source-badges .field--type-entity-reference { margin: 0; } .akp-source-badges .field__items { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; } .akp-source-badges .field__item { line-height: 1; } /* Popover shell (rendered in ): card tokens over Bootstrap fallbacks. */ .akp-source-popover-tip { --bs-popover-bg: var(--akp-source-popover-bg, var(--bs-body-bg)); --bs-popover-body-color: var(--akp-source-popover-color, var(--bs-body-color)); --bs-popover-border-color: var(--akp-source-popover-border-color, var(--bs-border-color)); --bs-popover-max-width: 20rem; } .akp-source-popover__logo img { max-height: 60px; width: auto; object-fit: contain; }