MediaWiki:Common.css: Porovnání verzí
MediaWiki interface page
More actions
Bez shrnutí editace |
Bez shrnutí editace |
||
| Řádek 1: | Řádek 1: | ||
/* | /* ZLATÝ akcent */ | ||
:root{ --pi-accent:#d4af37; } | |||
@media (prefers-color-scheme: dark){ | |||
:root{ | |||
--pi-bd: rgba(255,255,255,.22); | |||
--pi-sep: rgba(255,255,255,.16); | |||
--pi-soft: rgba(255,255,255,.05); | |||
} | |||
} | |||
/* Box */ | |||
.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; | |||
} | |||
/* Titulek – celý zlatý, centrovaný */ | |||
.portable-infobox .pi-title{ | .portable-infobox .pi-title{ | ||
background: var(--pi-accent | background:var(--pi-accent) !important; | ||
color: #111 !important; | color:#111 !important; | ||
text-align: center !important; | text-align:center !important; | ||
display: flex !important; | display:flex !important; align-items:center !important; justify-content:center !important; | ||
padding:12px 14px 10px !important; | |||
border-bottom:1px solid var(--pi-sep, rgba(0,0,0,.10)) !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,.10)) !important; | |||
border-top-left-radius: 16px !important; | |||
} | } | ||
/* | /* Obrázek – centrovaný */ | ||
.portable-infobox .pi-image, | .portable-infobox .pi-image, | ||
.portable-infobox .pi-image-collection{ text-align:center | .portable-infobox .pi-image-collection{ text-align:center; background:transparent; } | ||
.portable-infobox .pi-image img{ | .portable-infobox .pi-image img{ | ||
display:block !important; | display:block; margin:0 auto; max-height:320px; object-fit:contain; | ||
border-bottom:1px solid var(--pi-sep, rgba(0,0,0,.10)); | |||
} | |||
border- | /* HLAVIČKY SKUPIN – zlaté „proužky“ */ | ||
.portable-infobox .pi-header, | |||
.portable-infobox .pi-group .pi-group-title{ | |||
background:var(--pi-accent) !important; | |||
color:#111 !important; | |||
font-weight:700; | |||
padding:8px 12px; | |||
border-radius:10px; | |||
margin:10px 12px 6px; /* malý odsazení od rámečku */ | |||
border:1px solid var(--pi-bd, rgba(0,0,0,.12)); | |||
} | |||
/* Tělo skupiny */ | |||
.portable-infobox .pi-group{ | |||
background:var(--pi-soft, rgba(0,0,0,.035)); | |||
border-top:1px solid var(--pi-sep, rgba(0,0,0,.10)); | |||
padding:6px 12px 8px; | |||
} | } | ||
/* | /* Řádky – label vlevo, hodnota vpravo */ | ||
.portable-infobox .pi-data{ | .portable-infobox .pi-data{ | ||
display: grid !important; | display:grid !important; | ||
grid-template-columns: | grid-template-columns: 42% 58% !important; | ||
gap: 6px 10px !important; | gap:6px 10px !important; | ||
padding: | padding:6px 0 !important; | ||
border-top: none !important; | border-top:none !important; | ||
} | } | ||
.portable-infobox .pi-data + .pi-data{ | .portable-infobox .pi-data + .pi-data{ | ||
border-top: 1px solid var(--pi-sep, rgba(0,0,0,.10)) !important; | border-top:1px solid var(--pi-sep, rgba(0,0,0,.10)) !important; | ||
} | } | ||
.portable-infobox .pi-data-label{ | .portable-infobox .pi-data-label{ | ||
display: block !important; | display:block !important; | ||
font-weight: 600 !important; | font-weight:600 !important; | ||
opacity: .9; | opacity:.9; | ||
} | } | ||
.portable-infobox .pi-data-value{ word-break: break-word; } | .portable-infobox .pi-data-value{ word-break:break-word; } | ||
/* | /* Textové bloky přes celou šířku */ | ||
.portable-infobox .pi- | .portable-infobox .pi-data-type-text .pi-data-value{ | ||
grid-column:1 / -1; | |||
border | padding:8px 10px; | ||
border-radius:10px; | |||
border:1px solid var(--pi-sep, rgba(0,0,0,.10)); | |||
background: color-mix(in srgb, currentColor 5%, transparent); | |||
} | } | ||
/* | /* Responsivita */ | ||
@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; } | |||
@media ( | |||
.portable-infobox | |||
.portable-infobox .pi-image img{ | |||
} | } | ||
Verze z 9. 10. 2025, 13:37
/* ZLATÝ akcent */
:root{ --pi-accent:#d4af37; }
@media (prefers-color-scheme: dark){
:root{
--pi-bd: rgba(255,255,255,.22);
--pi-sep: rgba(255,255,255,.16);
--pi-soft: rgba(255,255,255,.05);
}
}
/* Box */
.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;
}
/* Titulek – celý zlatý, centrovaný */
.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-bottom:1px solid var(--pi-sep, rgba(0,0,0,.10)) !important;
border-top-left-radius:16px !important; border-top-right-radius:16px !important;
}
/* Obrázek – centrovaný */
.portable-infobox .pi-image,
.portable-infobox .pi-image-collection{ text-align:center; background:transparent; }
.portable-infobox .pi-image img{
display:block; margin:0 auto; max-height:320px; object-fit:contain;
border-bottom:1px solid var(--pi-sep, rgba(0,0,0,.10));
}
/* HLAVIČKY SKUPIN – zlaté „proužky“ */
.portable-infobox .pi-header,
.portable-infobox .pi-group .pi-group-title{
background:var(--pi-accent) !important;
color:#111 !important;
font-weight:700;
padding:8px 12px;
border-radius:10px;
margin:10px 12px 6px; /* malý odsazení od rámečku */
border:1px solid var(--pi-bd, rgba(0,0,0,.12));
}
/* Tělo skupiny */
.portable-infobox .pi-group{
background:var(--pi-soft, rgba(0,0,0,.035));
border-top:1px solid var(--pi-sep, rgba(0,0,0,.10));
padding:6px 12px 8px;
}
/* Řádky – label vlevo, hodnota vpravo */
.portable-infobox .pi-data{
display:grid !important;
grid-template-columns: 42% 58% !important;
gap:6px 10px !important;
padding:6px 0 !important;
border-top:none !important;
}
.portable-infobox .pi-data + .pi-data{
border-top:1px solid var(--pi-sep, rgba(0,0,0,.10)) !important;
}
.portable-infobox .pi-data-label{
display:block !important;
font-weight:600 !important;
opacity:.9;
}
.portable-infobox .pi-data-value{ word-break:break-word; }
/* Textové bloky přes celou šířku */
.portable-infobox .pi-data-type-text .pi-data-value{
grid-column:1 / -1;
padding:8px 10px;
border-radius:10px;
border:1px solid var(--pi-sep, rgba(0,0,0,.10));
background: color-mix(in srgb, currentColor 5%, transparent);
}
/* Responsivita */
@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; }
}