|
|
| Řádek 26: |
Řádek 26: |
| drop-shadow(0 3px 3px rgba(0,0,0,.35)) | | drop-shadow(0 3px 3px rgba(0,0,0,.35)) |
| drop-shadow(0 6px 12px rgba(0,0,0,.25)) !important; | | drop-shadow(0 6px 12px rgba(0,0,0,.25)) !important; |
| }
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* ===========================================================
| |
| PortableInfobox – styl Bradavice Online
| |
| =========================================================== */
| |
|
| |
| /* Šířka, rámeček, stín – společné */
| |
| .portable-infobox {
| |
| width: 320px;
| |
| border: 1px solid var(--pi-border, #d9dee6);
| |
| border-radius: 12px;
| |
| background: var(--pi-bg, #fff);
| |
| overflow: hidden;
| |
| box-shadow: 0 2px 10px rgba(0,0,0,.06);
| |
| font-size: 0.95em;
| |
| line-height: 1.5;
| |
| }
| |
|
| |
| /* ===========================================================
| |
| Titulek – centrovaný, zlatý text + barevný pruh
| |
| =========================================================== */
| |
| .portable-infobox .pi-title,
| |
| .portable-infobox .pi-item.pi-title {
| |
| position: relative;
| |
| padding: 12px 14px;
| |
| text-align: center;
| |
| font-weight: 700;
| |
|
| |
| /* Zlatý text (gradient do glyfů) */
| |
| background-image: linear-gradient(
| |
| 180deg,
| |
| #a0703a 0%,
| |
| #a0703a 25%,
| |
| #ffcf5b 50%,
| |
| #a0703a 75%,
| |
| #a0703a 100%
| |
| ) !important;
| |
| -webkit-background-clip: text !important;
| |
| background-clip: text !important;
| |
| -webkit-text-fill-color: transparent !important;
| |
| color: transparent !important;
| |
|
| |
| /* Backdrop stín pro čitelnost */
| |
| filter:
| |
| drop-shadow(0 1px 0 rgba(0,0,0,.35))
| |
| drop-shadow(0 3px 3px rgba(0,0,0,.35))
| |
| drop-shadow(0 6px 12px rgba(0,0,0,.25));
| |
|
| |
| /* Správné vykreslení při vícerádkovém titulku */
| |
| -webkit-box-decoration-break: clone;
| |
| box-decoration-break: clone;
| |
| }
| |
|
| |
| /* Barevný pruh (zůstává podle motivu) */
| |
| .portable-infobox .pi-title::before,
| |
| .portable-infobox .pi-item.pi-title::before {
| |
| content: "";
| |
| position: absolute;
| |
| inset: 0;
| |
| background: var(--pi-accent, #2f4f7f);
| |
| z-index: -1;
| |
| pointer-events: none;
| |
| }
| |
|
| |
| /* ===========================================================
| |
| Obrázek – centrovaný a oddělený linkou
| |
| =========================================================== */
| |
| .portable-infobox .pi-image,
| |
| .portable-infobox .pi-image-collection { background: #fff; }
| |
| .portable-infobox .pi-image img {
| |
| display: block;
| |
| margin: 0 auto;
| |
| max-height: 320px;
| |
| object-fit: contain;
| |
| border-bottom: 1px solid var(--pi-border, #d9dee6);
| |
| }
| |
|
| |
| /* ===========================================================
| |
| Skupiny – nadpis a podklad
| |
| =========================================================== */
| |
| .portable-infobox .pi-group {
| |
| background: var(--pi-muted, #f6f8fb);
| |
| padding: 8px 12px;
| |
| border-top: 1px solid var(--pi-border, #d9dee6);
| |
| }
| |
| .portable-infobox .pi-group .pi-group-title {
| |
| font-weight: 700;
| |
| margin: 6px 0 4px 0;
| |
| }
| |
|
| |
| /* ===========================================================
| |
| Řádky: dvousloupcová mřížka label / hodnota
| |
| =========================================================== */
| |
| .portable-infobox .pi-data {
| |
| display: grid;
| |
| grid-template-columns: 40% 60%;
| |
| gap: 6px 10px;
| |
| padding: 6px 0;
| |
| border-top: 1px dashed #e6eaf0;
| |
| }
| |
| .portable-infobox .pi-data-label { font-weight: 600; color: #334; }
| |
| .portable-infobox .pi-data-value { color: #111; word-break: break-word; }
| |
|
| |
| /* Textové bloky přes celou šířku (type=text) */
| |
| .portable-infobox .pi-data-type-text .pi-data-value {
| |
| grid-column: 1 / -1;
| |
| background: #fff;
| |
| border: 1px solid var(--pi-border, #d9dee6);
| |
| border-radius: 8px;
| |
| padding: 8px 10px;
| |
| }
| |
|
| |
| /* ===========================================================
| |
| Tmavý režim (Citizen)
| |
| =========================================================== */
| |
| .skin-citizen-dark .portable-infobox {
| |
| --pi-accent: #4b6bb3;
| |
| --pi-border: #2c3442;
| |
| --pi-bg: #10131a;
| |
| --pi-muted: #141a24;
| |
| color: #e6ebf3;
| |
| box-shadow: none;
| |
| }
| |
|
| |
| /* Dark mode: zesílený stín u titulku pro kontrast */
| |
| .skin-citizen-dark .portable-infobox .pi-title,
| |
| .skin-citizen-dark .portable-infobox .pi-item.pi-title {
| |
| filter:
| |
| drop-shadow(0 1px 0 rgba(0,0,0,.5))
| |
| drop-shadow(0 3px 3px rgba(0,0,0,.5))
| |
| drop-shadow(0 8px 14px rgba(0,0,0,.38));
| |
| }
| |
|
| |
| .skin-citizen-dark .portable-infobox .pi-data-label { color: #cfd8ea; }
| |
| .skin-citizen-dark .portable-infobox .pi-data { border-top-color: #2a3240; }
| |
| .skin-citizen-dark .portable-infobox .pi-data-type-text .pi-data-value {
| |
| background: #0b0e14;
| |
| border-color: #2c3442;
| |
| } | | } |
