Jump to content

MediaWiki:Infobox.css

From The Petit Planet Wiki
Revision as of 08:50, 15 November 2025 by Stevium (talk | contribs) (Added skin-theme-clientpref-os)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/*infobox*/
.portable-infobox {
	min-width: 340px;
    background: var(--theme-color-1);
    border-radius: 20px;
    padding: 10px;
}

.pi-title {
    background-color: var(--theme-accent-color);
    text-align: center;
    border-radius: 10px;
    color: var(--page-text-color);
    margin-bottom: 5px !important;
}

.skin-theme-clientpref-night .pi-title,
.skin-theme-clientpref-os .pi-title {
    color: var(--page-background-color);
}

.pi-data {
    background-color: var(--theme-color-3);
    border-radius: 10px;
    margin-bottom: 5px;
    border: none;
}

.pi-data:last-child {
    margin-bottom: 0;
}

.pi-data-label {
    color: var(--theme-link-color);
    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(--theme-color-6) !important;
}

.pi-media-collection-tabs li {
    border-radius: 10px !important;
    background-color: var(--theme-color-3) !important;
}

.pi-section-navigation .pi-section-tab, .pi-media-collection .pi-tab-link {
    max-width: none !important;
    flex-grow: 1;
}

.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(--theme-color-1) !important;
        border-width: 5px !important;
        background-color: var(--theme-color-3);
    }
}

.pi-group {
    border: none;
}