|
|
| Line 1: |
Line 1: |
| /* All CSS here will be loaded for users of the Vector skin */ | | /* All CSS here will be loaded for users of the Vector skin */ |
| /* ==========================================================================
| |
| PortableInfobox - Vector (2022) Skin Alignment
| |
| ========================================================================== */
| |
|
| |
| .portable-infobox {
| |
| /* Exact Wikipedia Vector Design Tokens */
| |
| --pi-background: #f8f9fa !important; /* Vector default layout grey-white */
| |
| --pi-secondary-background: #f8f9fa !important; /* Seamless header blend */
| |
| --pi-border-color: #a2a9b1 !important; /* System border hex */
| |
| --pi-text-color: #202122 !important; /* Vector 2022 body text grey */
| |
| --pi-header-text-color: #000000 !important;
| |
|
| |
| /* Typography & Structural Footprint */
| |
| font-family: sans-serif !important;
| |
| font-size: 88% !important; /* Standard Vector layout text down-scaling */
| |
| line-height: 1.5em !important;
| |
| width: 22em !important; /* Hardcoded Wikipedia baseline width */
| |
|
| |
| /* Layout Framing */
| |
| border: 1px solid var(--pi-border-color) !important;
| |
| border-radius: 0px !important; /* Sharp edges to match standard tables */
| |
| padding: 0.2em !important;
| |
| box-shadow: none !important; /* Removes Fandom-style block shadows */
| |
| background-color: var(--pi-background) !important;
| |
|
| |
| /* Document Placement positioning */
| |
| float: right !important;
| |
| clear: right !important;
| |
| margin: 0.5em 0 1em 1em !important;
| |
| }
| |
|
| |
| /* Page Titles within the Infobox */
| |
| .portable-infobox .pi-title {
| |
| font-size: 125% !important;
| |
| font-weight: bold !important;
| |
| font-family: 'Linux Libertine', 'Georgia', 'Times', serif !important; /* Wikipedia Header Font */
| |
| text-align: center !important;
| |
| padding: 0.2em 0.4em !important;
| |
| background-color: transparent !important;
| |
| }
| |
|
| |
| /* Subsection Divider Bars */
| |
| .portable-infobox .pi-header {
| |
| font-size: 100% !important;
| |
| font-weight: bold !important;
| |
| text-align: center !important;
| |
| background-color: #eff1f4 !important; /* Muted grey highlight bar used in Vector components */
| |
| border: 1px solid var(--pi-border-color) !important;
| |
| padding: 0.3em 0.5em !important;
| |
| margin: 0.3em 0 !important;
| |
| }
| |
|
| |
| /* Media/Image Layout frames */
| |
| .portable-infobox .pi-media,
| |
| .portable-infobox .pi-image {
| |
| text-align: center !important;
| |
| padding: 0.4em 0 !important;
| |
| }
| |
| .portable-infobox .pi-image-caption {
| |
| font-size: 92% !important; /* Smaller caption spacing text */
| |
| line-height: 1.3em !important;
| |
| color: #54595d !important; /* Secondary text grey */
| |
| padding-top: 0.3em !important;
| |
| }
| |
|
| |
| /* Left Metadata Column (Labels) */
| |
| .portable-infobox .pi-data-label {
| |
| font-weight: bold !important;
| |
| text-align: left !important;
| |
| padding: 0.3em 0.6em 0.3em 0.2em !important;
| |
| width: 35% !important; /* Proportional column block distribution */
| |
| vertical-align: top !important;
| |
| background: transparent !important;
| |
| }
| |
|
| |
| /* Right Metadata Column (Values) */
| |
| .portable-infobox .pi-data-value {
| |
| text-align: left !important;
| |
| padding: 0.3em 0.2em 0.3em 0 !important;
| |
| vertical-align: top !important;
| |
| background: transparent !important;
| |
| }
| |
