MediaWiki:Common.css: Porovnání verzí
MediaWiki interface page
More actions
Bez shrnutí editace |
Bez shrnutí editace |
||
| Řádek 1: | Řádek 1: | ||
/* ===== Portable Infobox – GOLD, bez radiusu, viditelné | /* ===== Portable Infobox – GOLD, bez radiusu, labely viditelné, 2 sloupce ===== */ | ||
:root{ --pi-accent:#BF8B20; } | :root{ --pi-accent:#BF8B20; } | ||
| Řádek 26: | Řádek 26: | ||
} | } | ||
/* OBRÁZEK – centrovaný */ | /* OBRÁZEK – centrovaný, bez kliknutí a bez hover-zoomu/animací */ | ||
.portable-infobox .pi-image, | .portable-infobox .pi-image, | ||
.portable-infobox .pi-image-collection{ text-align:center !important; background:transparent !important; } | .portable-infobox .pi-image-collection{ | ||
text-align:center !important; background:transparent !important; | |||
} | |||
.portable-infobox .pi-image a, | |||
.portable-infobox .pi-image .image{ | |||
pointer-events:none !important; /* zakáže kliknutí na odkaz obrázku */ | |||
cursor: default !important; | |||
} | |||
.portable-infobox .pi-image img{ | .portable-infobox .pi-image img{ | ||
display:block !important; margin:0 auto !important; | display:block !important; margin:0 auto !important; | ||
| Řádek 34: | Řádek 41: | ||
border-bottom:1px solid rgba(0,0,0,.12); | border-bottom:1px solid rgba(0,0,0,.12); | ||
border-radius:0 !important; | border-radius:0 !important; | ||
/* vypnout efekty, co přidává skin (zoom/transition) */ | |||
transform:none !important; | |||
transition:none !important; | |||
} | |||
.portable-infobox .pi-image a:hover img, | |||
.portable-infobox .pi-image a:focus img{ | |||
transform:none !important; | |||
} | } | ||
| Řádek 44: | Řádek 58: | ||
.portable-infobox .pi-group:first-of-type{ border-top:none; } | .portable-infobox .pi-group:first-of-type{ border-top:none; } | ||
/* HLAVIČKA SKUPINY – plné zlato, bez | /* HLAVIČKA SKUPINY – plné zlato, centrovaná, bez radiusu */ | ||
.portable-infobox .pi-header{ | .portable-infobox .pi-header{ | ||
margin:0 !important; | margin:0 !important; width:100% !important; | ||
background:var(--pi-accent) !important; color:#111 !important; | |||
background:var(--pi-accent) !important; | |||
padding:10px 14px !important; | padding:10px 14px !important; | ||
border-radius:0 !important; | border-radius:0 !important; | ||
border-bottom:1px solid rgba(0,0,0,.12); | border-bottom:1px solid rgba(0,0,0,.12); | ||
font-weight:700; | font-weight:700; | ||
text-align:center !important; | |||
display:flex !important; align-items:center !important; justify-content:center !important; | |||
} | } | ||
| Řádek 77: | Řádek 91: | ||
border-top:none !important; | border-top:none !important; | ||
} | } | ||
.portable-infobox .pi-data + .pi-data{ border-top:1px solid rgba(0,0,0,.10) !important; } | .portable-infobox .pi-data + .pi-data{ | ||
border-top:1px solid rgba(0,0,0,.10) !important; | |||
} | |||
.portable-infobox .pi-data-value{ word-break:break-word; } | .portable-infobox .pi-data-value{ word-break:break-word; } | ||
| Řádek 91: | Řádek 107: | ||
/* DARK – automaticky přes systém */ | /* DARK – automaticky přes systém */ | ||
@media (prefers-color-scheme: dark){ | @media (prefers-color-scheme: dark){ | ||
.portable-infobox{ border-color:rgba(255,255,255,.22); box-shadow:0 4px 18px rgba(0,0,0,.25); } | .portable-infobox{ | ||
.portable-infobox .pi-title{ border-bottom-color:rgba(255,255,255,.16); color:#111 !important; } | border-color:rgba(255,255,255,.22); | ||
.portable-infobox .pi-image img{ border-bottom-color:rgba(255,255,255,.14); } | box-shadow:0 4px 18px rgba(0,0,0,.25); | ||
.portable-infobox .pi-group{ border-top-color:rgba(255,255,255,.16); } | } | ||
.portable-infobox .pi-header{ border-bottom-color:rgba(255,255,255,.16); color:#111 !important; } | .portable-infobox .pi-title{ | ||
.portable-infobox .pi-data + .pi-data{ border-top-color:rgba(255,255,255,.16) !important; } | border-bottom-color:rgba(255,255,255,.16); | ||
color:#111 !important; /* na zlatu zůstává tmavý text */ | |||
} | |||
.portable-infobox .pi-image img{ | |||
border-bottom-color:rgba(255,255,255,.14); | |||
} | |||
.portable-infobox .pi-group{ | |||
border-top-color:rgba(255,255,255,.16); | |||
} | |||
.portable-infobox .pi-header{ | |||
border-bottom-color:rgba(255,255,255,.16); | |||
color:#111 !important; | |||
} | |||
.portable-infobox .pi-data + .pi-data{ | |||
border-top-color:rgba(255,255,255,.16) !important; | |||
} | |||
} | } | ||
/* RESPONSIVE */ | /* RESPONSIVE */ | ||
@media (max-width:720px){ | @media (max-width:720px){ | ||
.portable-infobox{ float:none !important; width:100% !important; margin:0 0 1rem 0 !important; } | .portable-infobox{ | ||
float:none !important; width:100% !important; margin:0 0 1rem 0 !important; | |||
} | |||
.portable-infobox .pi-image img{ max-height:260px; } | .portable-infobox .pi-image img{ max-height:260px; } | ||
} | } | ||
Verze z 9. 10. 2025, 14:13
/* ===== Portable Infobox – GOLD, bez radiusu, labely viditelné, 2 sloupce ===== */
:root{ --pi-accent:#BF8B20; }
/* BOX */
.portable-infobox{
width:min(360px,100%);
float:right;
margin:0 0 1rem 1rem;
background:transparent;
border:1px solid rgba(0,0,0,.12);
border-radius:0 !important;
box-shadow:0 4px 18px rgba(0,0,0,.08);
color:inherit;
overflow:visible !important;
}
/* TITULEK – plná zlato, centrovaný */
.portable-infobox .pi-title{
background:var(--pi-accent) !important;
color:#111 !important;
display:flex !important; align-items:center !important; justify-content:center !important;
text-align:center !important;
padding:12px 14px 10px !important;
border-bottom:1px solid rgba(0,0,0,.12);
border-top-left-radius:0 !important; border-top-right-radius:0 !important;
}
/* OBRÁZEK – centrovaný, bez kliknutí a bez hover-zoomu/animací */
.portable-infobox .pi-image,
.portable-infobox .pi-image-collection{
text-align:center !important; background:transparent !important;
}
.portable-infobox .pi-image a,
.portable-infobox .pi-image .image{
pointer-events:none !important; /* zakáže kliknutí na odkaz obrázku */
cursor: default !important;
}
.portable-infobox .pi-image img{
display:block !important; margin:0 auto !important;
max-height:320px; object-fit:contain;
border-bottom:1px solid rgba(0,0,0,.12);
border-radius:0 !important;
/* vypnout efekty, co přidává skin (zoom/transition) */
transform:none !important;
transition:none !important;
}
.portable-infobox .pi-image a:hover img,
.portable-infobox .pi-image a:focus img{
transform:none !important;
}
/* SKUPINY – bez vnitřních mezer, header přes CELÝ box */
.portable-infobox .pi-group{
padding:0 !important;
background:transparent;
border-top:1px solid rgba(0,0,0,.10);
}
.portable-infobox .pi-group:first-of-type{ border-top:none; }
/* HLAVIČKA SKUPINY – plné zlato, centrovaná, bez radiusu */
.portable-infobox .pi-header{
margin:0 !important; width:100% !important;
background:var(--pi-accent) !important; color:#111 !important;
padding:10px 14px !important;
border-radius:0 !important;
border-bottom:1px solid rgba(0,0,0,.12);
font-weight:700;
text-align:center !important;
display:flex !important; align-items:center !important; justify-content:center !important;
}
/* TĚLO SKUPINY – odsazení pro položky */
.portable-infobox .pi-header + .pi-data,
.portable-infobox .pi-header + .pi-data ~ .pi-data{
padding:8px 14px !important;
}
/* LABELY – odskrýt (Citizen je schovává) + layout 2 sloupce */
.portable-infobox .pi-data-label{
all:unset !important; 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;
font-weight:600 !important; opacity:.9;
margin:0;
}
.portable-infobox .pi-data{
display:grid !important;
grid-template-columns:44% 56% !important;
gap:6px 10px !important;
padding:8px 0 !important;
border-top:none !important;
}
.portable-infobox .pi-data + .pi-data{
border-top:1px solid rgba(0,0,0,.10) !important;
}
.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:1px solid rgba(0,0,0,.10);
background:color-mix(in srgb, currentColor 5%, transparent);
border-radius:0 !important;
}
/* DARK – automaticky přes systém */
@media (prefers-color-scheme: dark){
.portable-infobox{
border-color:rgba(255,255,255,.22);
box-shadow:0 4px 18px rgba(0,0,0,.25);
}
.portable-infobox .pi-title{
border-bottom-color:rgba(255,255,255,.16);
color:#111 !important; /* na zlatu zůstává tmavý text */
}
.portable-infobox .pi-image img{
border-bottom-color:rgba(255,255,255,.14);
}
.portable-infobox .pi-group{
border-top-color:rgba(255,255,255,.16);
}
.portable-infobox .pi-header{
border-bottom-color:rgba(255,255,255,.16);
color:#111 !important;
}
.portable-infobox .pi-data + .pi-data{
border-top-color:rgba(255,255,255,.16) !important;
}
}
/* RESPONSIVE */
@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; }
}