MediaWiki:Gadget-Infobox.css: Difference between revisions
Appearance
m Stevium moved page MediaWiki:Infobox.css to MediaWiki:Gadget-Infobox.css without leaving a redirect: Changing how the Infobox stylesheet is loaded: now uses ResourceLoader instead of @import |
Updated |
||
| Line 1: | Line 1: | ||
.portable-infobox { | .portable-infobox { | ||
min-width: 340px; | |||
background: var(--background-color-1); | background: var(--background-color-1); | ||
border-radius: 20px; | border-radius: 20px; | ||
| Line 8: | Line 7: | ||
.pi-title { | .pi-title { | ||
background-color: var(-- | background-color: var(--color-accent); | ||
text-align: center; | text-align: center; | ||
border-radius: 10px; | border-radius: 10px; | ||
color: var(--color- | color: var(--color-accent-text); | ||
margin-bottom: 5px !important; | margin-bottom: 5px !important; | ||
} | } | ||
| Line 77: | Line 71: | ||
} | } | ||
/* Group | /* Group styling */ | ||
.pi-horizontal-group { | .pi-horizontal-group { | ||
margin-bottom: 5px; | margin-bottom: 5px; | ||
| Line 88: | Line 82: | ||
.pi-horizontal-group { | .pi-horizontal-group { | ||
td , th { | td, | ||
th { | |||
border-color: var(--background-color-1) !important; | border-color: var(--background-color-1) !important; | ||
border-width: 5px !important; | border-width: 5px !important; | ||
| Line 97: | Line 92: | ||
.pi-group { | .pi-group { | ||
border: none; | border: none; | ||
} | |||
/* Hide dummy infobox */ | |||
aside.pi-theme-dummy, | |||
aside.pi-theme-dummy ~ aside.portable-infobox + p > br:first-child, | |||
aside.pi-theme-dummy ~ aside.portable-infobox + p:empty + p > br:first-child { | |||
display: none; | |||
} | } | ||
Revision as of 13:36, 25 November 2025
.portable-infobox {
min-width: 340px;
background: var(--background-color-1);
border-radius: 20px;
padding: 10px;
}
.pi-title {
background-color: var(--color-accent);
text-align: center;
border-radius: 10px;
color: var(--color-accent-text);
margin-bottom: 5px !important;
}
.pi-data {
background-color: var(--background-color-2);
border-radius: 10px;
margin-bottom: 5px;
border: none;
}
.pi-data:last-child {
margin-bottom: 0;
}
.pi-data-label {
color: var(--color-progressive);
font-family: 'Inter' !important;
font-weight: 700 !important;
}
.portable-infobox .pi-data-label {
flex: 95px;
}
.pi-image img {
border-radius: 10px;
overflow: hidden;
margin-bottom: 5px !important;
}
.pi-media-collection-tabs {
gap: 5px;
align-items: stretch !important;
margin-bottom: 2px !important;
}
.pi-media-collection-tabs .current {
background-color: var(--background-color-4) !important;
}
.pi-media-collection-tabs li {
border-radius: 10px !important;
background-color: var(--background-color-2) !important;
}
.pi-section-navigation .pi-section-tab, .pi-media-collection .pi-tab-link {
max-width: none !important;
flex-grow: 1;
}
.pi-media-collection .pi-tab-link {
border: 0;
}
.pi-header {
background-color: transparent !important;
text-align: center;
font-weight: 500 !important;
}
/* Group styling */
.pi-horizontal-group {
margin-bottom: 5px;
border: 1px solid transparent !important;
border-spacing: 5px 0;
border-collapse: collapse;
border-radius: 10px;
overflow: hidden;
}
.pi-horizontal-group {
td,
th {
border-color: var(--background-color-1) !important;
border-width: 5px !important;
background-color: var(--background-color-2);
}
}
.pi-group {
border: none;
}
/* Hide dummy infobox */
aside.pi-theme-dummy,
aside.pi-theme-dummy ~ aside.portable-infobox + p > br:first-child,
aside.pi-theme-dummy ~ aside.portable-infobox + p:empty + p > br:first-child {
display: none;
}