Note: After saving, you may have to bypass your browser's cache to see the changes.
- Chrome - Windows: Hold the Ctrl key and press the F5 key. OS X: Hold both the ⌘ Cmd and ⇧ Shift keys and press the R key.
- Safari - Hold down the ⇧ Shift key and click the Reload toolbar button.
- Firefox - Windows: Hold the Ctrl key, and press F5. OS X: Hold the ⌘ Cmd and ⇧ Shift keys, and then press R.
- Internet Explorer - Hold the Ctrl key, and press F5 (or click the Refresh button).
/*
<pre>
*/
/* ===============================
S I D E B A R S . C S S
is the repository for all styling
that affects 2015-era portable
infobox code.
At the top is code which GENERALLY affects
all infoboxes, and can be recognised easily
because it begins with .portable-infobox.
At the bottom are all the various INDIVIDUAL
infobox themes. This code starts with .pi-theme-something.
This page dates from 2 Sept 2016, but much of the code
on it comes from the last quarter of 2015.
================================= *
/***** Portable Infobox/Sidebar ******/
.portable-infobox {
width: 292px;
border: 1px solid #666;
background-color: #222222;
}
/** Make the image the full width, and preserve the ratio. Stretches smaller images, but no way around this yet **/
.pi-image-thumbnail {
width:100%;
height: auto;
}
.skin-monobook .pi-background {
background-color: #222222;
}
/** Centre captions and titles **/
.portable-infobox .pi-title {
/* background-color: #252525; */
background: #000000 url(http://images.wikia.com/memoryalpha/eo/images/f/f7/MA_page_bar.png) repeat-x;
/* color: #FFD942; */
color: #FFFFFF;
padding:5px;
text-align:center !important;
font-weight: bold;
font-size: larger;
line-height: 22px;
}
.portable-infobox .pi-caption {
padding:0;
text-align:center !important;
font-size: smaller !important;
color: inherit;
line-height: 130%;
font-style: normal;
}
.portable-infobox .pi-data {
border-bottom-style: none;
border-bottom-width: 0px;
}
.portable-infobox .pi-data-value {
font-size: smaller;
line-height: 110%;
}
.portable-infobox .pi-data-label {
color: white !important;
font-size: smaller;
flex-basis: 105px;
line-height: 110%;
}
.portable-infobox .pi-item-spacing {
padding: 3px 3px;
}
.portable-infobox .pi-header {
font-size: smaller;
text-align: center;
background-color: #660000;
color: white;
line-height: 130%;
}
.portable-infobox .pi-navigation {
text-align:center !important;
background-color: inherit;
font-size: smaller;
font-weight: normal;
}
.portable-infobox.pi-layout-stacked .pi-data-value {
text-align:center !important;
}
.portable-infobox.pi-layout-stacked .pi-data-label {
text-align:center !important;
font-weight: normal;
font-style: italic;
}
/* Horizontal groups */
.pi-horizontal-group .pi-header {
background: #000000 url(http://images.wikia.com/memoryalpha/eo/images/f/f7/MA_page_bar.png) repeat-x;
color: #FFFFFF;
padding:5px;
text-align:center !important;
font-weight: bold;
font-size: larger!important;
line-height: 22px;
}
.pi-horizontal-group .pi-horizontal-group-item:not(:first-child) {
border-left-style:dotted;
border-left-color:#aaa;
}
/* Potentially useful, if there are ever true unordered lists in sidebars */
.portable-infobox .pi-data-value ul {
text-indent:-1em;
padding-left:1.5em;
padding-top:.25em
}
/* Getting rid of auto hyphenation, per sulfur */
.portable-infobox .pi-data-value,
.portable-infobox .pi-data-label {
-webkit-hyphens:none;
-moz-hyphens:none;
-ms-hyphens:none;
hyphens:none;
}
/* ==========================
T H E M E S
========================== */
/*** Special sidebar_video theming... ***/
/** BLU-RAY **/
.portable-infobox.pi-theme-bd .pi-navigation {
text-align:center !important;
background-color: royalblue;
color: white;
font-size: smaller;
font-weight: bold;
}
/** BETAMAX **/
.portable-infobox.pi-theme-bm .pi-navigation {
text-align:center !important;
background-color: saddlebrown;
color: white;
font-size: smaller;
font-weight: bold;
}
/** CED **/
.portable-infobox.pi-theme-ced .pi-navigation {
text-align:center !important;
background-color: indigo;
color: white;
font-size: smaller;
font-weight: bold;
}
/** DIGITAL RELEASES **/
.portable-infobox.pi-theme-dr .pi-navigation {
text-align:center !important;
background-color: transparent;
color: white;
font-size: smaller;
font-weight: bold;
}
/** DVD **/
.portable-infobox.pi-theme-dvd .pi-navigation {
text-align:center !important;
background-color: silver;
color: black;
font-size: smaller;
font-weight: bold;
}
/** HD DVD **/
.portable-infobox.pi-theme-hddvd .pi-navigation {
text-align:center !important;
background-color: darkred;
color: white;
font-size: smaller;
font-weight: bold;
}
/** LASERDISC **/
.portable-infobox.pi-theme-ld .pi-navigation {
text-align:center !important;
background-color: khaki;
color: black;
font-size: smaller;
font-weight: bold;
}
/** VCD **/
.portable-infobox.pi-theme-vcd .pi-navigation {
text-align:center !important;
background-color: springgreen;
color: black;
font-size: smaller;
font-weight: bold;
}
/** VHD **/
.portable-infobox.pi-theme-vhd .pi-navigation {
text-align:center !important;
background-color: orangered;
color: white;
font-size: smaller;
font-weight: bold;
}
/** VHS / UKVHS / USVHS **/
.portable-infobox.pi-theme-vhs .pi-navigation {
text-align:center !important;
background-color: black;
color: white;
font-size: smaller;
font-weight: bold;
}
.portable-infobox.pi-theme-ukvhs .pi-navigation {
text-align:center !important;
background-color: black;
color: white;
font-size: smaller;
font-weight: bold;
}
.portable-infobox.pi-theme-usvhs .pi-navigation {
text-align:center !important;
background-color: black;
color: white;
font-size: smaller;
font-weight: bold;
}
/** UMD **/
.portable-infobox.pi-theme-umd .pi-navigation {
text-align:center !important;
background-color: mediumslateblue;
color: black;
font-size: smaller;
font-weight: bold;
}
/** END VIDEO THEMING **/
/* Episode */
.pi-theme-episode .pi-data-value,
.pi-theme-episode .pi-layout-stacked .pi-data-value {
padding-left:0;
}
.pi-theme-episode .larr {
float:left;
}
.pi-theme-episode .rarr {
float:right;
}
/* Conflict */
.pi-theme-conflict .pi-border-color {
border:none;
}
.pi-theme-conflict .pi-navigation {
/* This allows infoboxes to remain 292px wide,
as is the tradition here at MA, but still
use {{sidebar image portable}} to set the
image width at 292px as well. If you DON'T
do this, then any {{sidebar image portable}}-enabled
images will overhang the right edge of the
sidebar. Only those infoboxes that use
{{sidebar image portable}} need this code snippet.
If you later want to trim the padding-bottom,
just add padding-bottom:0!important.
(Oh, and the !important is necessary.)
*/
padding-left:0!important;
padding-right:0!important;
}
.conflict-subtitle {
font-size:11px;
}
.pi-theme-conflict .pi-data-value ul {
text-indent:-1em;
padding-left:1.5em;
padding-top:.25em
}
.pi-theme-conflict .pi-horizontal-group {
text-align:left;
}
.pi-theme-conflict .pi-horizontal-group:not(:first-child) {
padding:1px!important;
}
.pi-theme-conflict .sb-twoimg {
display:inherit;
}
.pi-theme-conflict .pi-data-value:not(:first-child) {
-ms-flex-preferred-size:280px;
-webkit-flex-basis:280px;
-moz-flex-basis:280px;
flex-basis:280px;
padding-left:5px;
}
.pi-theme-conflict .pi-data-value,
.pi-theme-conflict .pi-data-label {
line-height:130%!important;
font-size:11px!important;
}
.pi-theme-conflict .pi-horizontal-group-item.pi-data-value {
font-size:13px!important;
}
.pi-theme-conflict .pi-item.pi-group {
line-height:130%!important;
padding:2px;
font-size:12px; /* smaller in this case means 12px */
}
.pi-theme-conflict .pi-title {
padding:2px;
font-size:19px;
}
.pi-theme-conflict .pi-horizontal-group .pi-header {
font-size:19px!important;
padding:1px;
}
.pi-theme-conflict dl {
margin:1em 0 !important
}
/* Starship */
.pi-theme-starship .pi-navigation {
padding-left:0!important;
padding-right:0!important;
}
/* Planet */
.pi-theme-planet.portable-infobox {
line-height:150%
}
.pi-theme-planet .pi-navigation {
padding-left:0!important;
padding-right:0!important;
}
/* Government */
.pi-theme-government .pi-navigation {
padding-left:0!important;
padding-right:0!important;
}
/* Comic */
.pi-theme-comic .pi-navigation {
padding-left:0!important;
padding-right:0!important;
}
/* Novel */
.pi-theme-novel .pi-navigation {
padding-left:0!important;
padding-right:0!important;
}
/*
</pre>
*/