MediaWiki:Infobox.css

/* CSS for the wiki's infoboxes - Inspired by Wookieepedia and Harry Potter Wiki */ .portable-infobox { width: 250px; border: none; } .portable-infobox.pi-background { background: none; } .portable-infobox .pi-border-color { border: none; }

/* Data background colors */ .portable-infobox .pi-data:nth-child(even) { background-color: #f0f0f0; } .portable-infobox .pi-data:nth-child(odd) { background-color: #f9f9f9; }

/* Slightly reduce padding between items */ .portable-infobox .pi-item-spacing { padding: 4px; }

/* Title and header settings */ .portable-infobox .pi-title { color: white; text-align: center; font-size: 14px !important; padding: 4px !important; font-weight: 500 !important; line-height: 1.5; }

.portable-infobox .pi-header { color: black; text-align: left; font-size: 12px !important; padding: 4px !important; font-weight: 500 !important; line-height: 1.5; }

/* Unbolding labels */ .portable-infobox .pi-data-label { font-weight: normal !important; font-size: 11px !important; flex-basis: auto; width: 40%; align-items: center; padding-bottom: 0; } .portable-infobox .pi-data-value { font-size: 11px; flex-basis: auto; width: 60%; align-items: center; }

/* Navigation */ .portable-infobox .pi-navigation { text-align: center; font-weight: 500; font-size: 11px; line-height: 1.5; } .portable-infobox .pi-navigation { /* Bottom rounded corners */ border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .portable-infobox .pi-navigation .selflink { font-weight: 500; }

/* Horizontal group listings */ .portable-infobox .pi-horizontal-group-item:nth-child(even) { background-color: #f0f0f0; } .portable-infobox .pi-horizontal-group-item:nth-child(odd) { background-color: #f9f9f9; }

/* Dark theme background colors */ .theme-fandomdesktop-dark .portable-infobox .pi-data:nth-child(even), .theme-fandomdesktop-dark .portable-infobox .pi-horizontal-group-item:nth-child(even) { background-image: linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,.2)); } .theme-fandomdesktop-dark .portable-infobox .pi-data:nth-child(odd), .theme-fandomdesktop-dark .portable-infobox .pi-horizontal-group-item:nth-child(odd) { background-image: linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)); }

/* Preventing translucent data items on dark theme */ .theme-fandomdesktop-dark .portable-infobox .pi-data, .theme-fandomdesktop-dark .portable-infobox .pi-horizontal-group-item { background-color: var(--theme-page-background-color); }

/* Fix spacing */ /** People **/ .portable-infobox.pi-theme-person .pi-data-label { width: 30%; } .portable-infobox.pi-theme-person .pi-data-value { width: 70%; } /** Series **/ .portable-infobox.pi-theme-series .pi-data-label { width: 36%; } .portable-infobox.pi-theme-series .pi-data-value { width: 64%; } /** Characters **/ .portable-infobox.pi-theme-character .pi-data-label { width: 32%; } .portable-infobox.pi-theme-character .pi-data-value { width: 68%; } /** Companies **/ .portable-infobox.pi-theme-company .pi-data-label { width: 34%; } .portable-infobox.pi-theme-company .pi-data-value { width: 66%; }

/* Enhance logo visibility on light theme */ .theme-fandomdesktop-light .portable-infobox .pi-image img[data-image-name="Nickelodeon Logo (2023).svg"] { background-color: #f0f0f0; }