MediaWiki:Common.css: Porovnání verzí

Verze z 9. 10. 2025, 13:40

/* === PortableInfobox: vynutit VIDITELNÉ LABELY + zlaté group headery === */

/* Odstranění skrytí labelů, které dělá Citizen (sr-only apod.) */
.portable-infobox .pi-data-label{
  all: unset;                    /* zruší sr-only hacky */
  display: block !important;
  visibility: visible !important;
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  height: auto !important;
  width: auto !important;
  overflow: visible !important;
  white-space: normal !important;
  font-weight: 600;
  opacity: .9;
  margin: 0;
}

/* Dvousloupcové řádky: label vlevo, hodnota vpravo */
.portable-infobox .pi-data{
  display: grid !important;
  grid-template-columns: 44% 56% !important;
  align-items: start;
  gap: 6px 10px !important;
  padding: 8px 0 !important;
  border-top: none !important;
}
.portable-infobox .pi-data + .pi-data{
  border-top: 1px solid var(--pi-sep, rgba(0,0,0,.12)) !important;
}
@media (prefers-color-scheme: dark){
  .portable-infobox .pi-data + .pi-data{ border-top-color: rgba(255,255,255,.16) !important; }
}

/* Titulek – celý zlatý a centrovaný */
:root{ --pi-accent:#d4af37; }
.portable-infobox .pi-title{
  background: var(--pi-accent) !important;
  color: #111 !important;
  text-align: center !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  padding: 12px 14px 10px !important;
  border-top-left-radius: 16px !important; border-top-right-radius: 16px !important;
  border-bottom: 1px solid var(--pi-sep, rgba(0,0,0,.12));
}

/* Obrázek – centrovaný */
.portable-infobox .pi-image,
.portable-infobox .pi-image-collection{ text-align:center !important; background: transparent !important; }
.portable-infobox .pi-image img{
  display:block !important; margin:0 auto !important; max-height:320px; object-fit:contain;
  border-bottom:1px solid var(--pi-sep, rgba(0,0,0,.12));
}

/* Zlaté hlavičky skupin – potřebují <header label="..."/> v šabloně */
.portable-infobox .pi-header{
  background: var(--pi-accent) !important;
  color: #111 !important;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
  margin: 10px 12px 6px;
  border: 1px solid rgba(0,0,0,.12);
}
@media (prefers-color-scheme: dark){
  .portable-infobox .pi-header{ border-color: rgba(255,255,255,.18); }
}

/* Tělo skupiny – jemný závoj */
.portable-infobox .pi-group{
  background: var(--pi-soft, rgba(0,0,0,.035));
  border-top: 1px solid var(--pi-sep, rgba(0,0,0,.12));
  padding: 6px 12px 8px;
}
@media (prefers-color-scheme: dark){
  .portable-infobox .pi-group{
    background: rgba(255,255,255,.05);
    border-top-color: rgba(255,255,255,.16);
  }
}

/* Box a responsivita */
.portable-infobox{
  width: min(360px, 100%);
  float: right;
  margin: 0 0 1rem 1rem;
  background: transparent;
  border: 1px solid var(--pi-bd, rgba(0,0,0,.12));
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(0,0,0,.08);
  color: inherit;
}
@media (max-width: 720px){
  .portable-infobox{ float:none !important; width:100% !important; margin:0 0 1rem 0 !important; }
  .portable-infobox .pi-image img{ max-height:260px; }
}