MediaWiki:Themes.css: Difference between revisions
Jump to navigation
Jump to search
Content added Content deleted
(we do not need to migrate our infoboxes here. HA! take that Wikia!!) Tag: Replaced |
imported>Mechemik m (updated themes for portable infoboxes (don't see any currently using portable but let me know if something was/got messed up)) |
||
Line 1: | Line 1: | ||
.portable-infobox .pi-navigation, |
|||
/*SIMS ALL*/ |
|||
.portable-infobox.pi- |
.portable-infobox .pi-header, |
||
.portable-infobox .pi-caption, |
|||
width: 250px; |
|||
.portable-infobox .pi-data-value, |
|||
float: right; |
|||
.portable-infobox .pi-data-label { |
|||
clear: right; |
|||
-webkit-hyphens:none; |
|||
margin: 0 0 1em 1em; |
|||
-moz-hyphens:none; |
|||
border: 1px solid #007FFF; |
|||
-ms-hyphens:none; |
|||
hyphens:none; |
|||
-webkit-border-radius: 10px; |
|||
} |
|||
padding: 10px 10px 10px 10px; |
|||
.portable-infobox { |
|||
padding:5px; |
|||
margin: 0px 1px 5px 5px; |
|||
font-size:90%; |
|||
border:1px solid #E0E0E0; |
|||
background-color:#F9F9F9; |
|||
box-shadow:1px 1px 3px #777777; |
|||
} |
} |
||
.portable-infobox.pi- |
.portable-infobox .pi-header, .portable-infobox .pi-title { |
||
background:#808080; |
|||
text-align:center; |
|||
color: |
color:white; |
||
text-shadow:1px 1px 2px #222222; |
|||
box-shadow:1px 1px 3px #777777; |
|||
font-weight:bold; |
|||
padding-bottom: 0; |
|||
text-align: center; |
|||
font-weight: bold; |
|||
} |
} |
||
.portable-infobox |
.portable-infobox .pi-title { |
||
font-size: 125%; |
|||
padding: 1px; |
|||
color:#ffffff; |
|||
} |
|||
padding-bottom: 0; |
|||
font-style: inherit; |
|||
.portable-infobox .pi-header { |
|||
font-size: 95%; |
|||
padding:3px; |
|||
} |
|||
.portable-infobox .pi-image { |
|||
margin-bottom:3px; |
|||
background-color: white; |
|||
border:1px solid #E0E0E0; |
|||
} |
|||
.pi-border-color { |
|||
border:none !important; |
|||
} |
|||
.pi-caption { |
|||
font-size:smaller; |
|||
font-style:italic; |
|||
line-height:22px; |
|||
text-align:center; |
|||
} |
|||
.pi-data-label { |
|||
padding: 3px 3px 0px 0px; |
|||
} |
|||
.pi-data-value { |
|||
padding: 3px 0px; |
|||
} |
|||
.portable-infobox .pi-data.pi-item-spacing { |
|||
padding: 3px; |
|||
} |
|||
/* slight spacing between a title and header if no image inbetween */ |
|||
.pi-title + h2 { |
|||
margin-top: 3px !important; |
|||
} |
|||
/* slight different spacing for more than one infobox on a page */ |
|||
.portable-infobox:nth-child(1n+0) { |
|||
margin-bottom:0px; |
|||
} |
|||
.portable-infobox:last-of-type { |
|||
margin-bottom:5px !important; |
|||
} |
|||
/*** tabber for portable infobox and images ***/ |
|||
/* the whole tab row */ |
|||
ul.pi-image-collection-tabs { |
|||
margin-top: 5px; |
|||
} |
|||
/* all tabs */ |
|||
ul.pi-image-collection-tabs .pi-tab-link { |
|||
padding: 0px 5px; |
|||
background-color: none; |
|||
margin: 0px 2px; |
|||
border: none; |
|||
} |
|||
/* activated tab, important: make sure this is AFTER the one that affects all tabs, otherwise border will disappear */ |
|||
ul.pi-image-collection-tabs li.current { |
|||
background-color: white; |
|||
color: #808080; |
|||
border: 1px solid #E0E0E0; |
|||
border-bottom: none; |
|||
} |
|||
/* activated hover tab and inactive hover tab */ |
|||
ul.pi-image-collection-tabs li.current:hover, ul.pi-image-collection-tabs li:hover { |
|||
color: #808080; |
|||
} |
|||
/*** end tabber code for portable infobox and images ***/ |
|||
/* The Sims infobox theme */ |
|||
.pi-theme-The-Sims.portable-infobox { |
|||
background: #FFE9E5; |
|||
} |
|||
.pi-theme-The-Sims .pi-title, .pi-theme-The-Sims .pi-header, .pi-theme-The-Sims .pi-navigation { |
|||
background-color: #FA8072; |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-The-Sims hr { |
|||
border-top:1px solid #FA8072 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-The-Sims ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims ul.pi-image-collection-tabs li:hover { |
|||
color: #FA8072; |
|||
} |
|||
/* The Sims 2 infobox theme */ |
|||
.pi-theme-The-Sims-2.portable-infobox { |
|||
background-color:#E5E8FF !important; |
|||
} |
|||
.pi-theme-The-Sims-2 .pi-title, .pi-theme-The-Sims-2 .pi-header, .pi-theme-The-Sims-2 .pi-navigation { |
|||
padding: 2px; |
|||
background-color: #7788E0; |
|||
} |
|||
.portable-infobox.pi-theme-The-Sims-2 .pi-header a, .portable-infobox.pi-theme-The-Sims-2 .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-The-Sims-2 hr { |
|||
border-top:1px solid #7788E0 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-The-Sims-2 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-2 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-2 ul.pi-image-collection-tabs li:hover { |
|||
color: #7788E0; |
|||
} |
|||
/* The Sims 3 infobox theme */ |
|||
.pi-theme-The-Sims-3.portable-infobox { |
|||
background-color:#EEFFE5 !important; |
|||
} |
|||
.pi-theme-The-Sims-3 .pi-title, |
|||
.pi-theme-The-Sims-3 .pi-header, |
|||
.pi-theme-The-Sims-3 .pi-navigation { |
|||
padding:2px; |
|||
background-color:#96CF24; |
|||
} |
|||
.portable-infobox.pi-theme-The-Sims-3 .pi-header a, |
|||
.portable-infobox.pi-theme-The-Sims-3 .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-The-Sims-3 hr { |
|||
border-top:1px solid #96CF24 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-The-Sims-3 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-3 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-3 ul.pi-image-collection-tabs li:hover { |
|||
color: #96CF24; |
|||
} |
|||
/* The Sims 4 infobox theme */ |
|||
.pi-theme-The-Sims-4.portable-infobox { |
|||
background-color:#E5F7FF !important; |
|||
} |
|||
.pi-theme-The-Sims-4 .pi-title, |
|||
.pi-theme-The-Sims-4 .pi-header, |
|||
.pi-theme-The-Sims-4 .pi-navigation { |
|||
padding:2px; |
|||
background-color:#25A8E0; |
|||
} |
|||
.portable-infobox.pi-theme-The-Sims-4 .pi-header a, |
|||
.portable-infobox.pi-theme-The-Sims-4 .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-The-Sims-4 hr { |
|||
border-top:1px solid #25A8E0 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-The-Sims-4 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-4 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-4 ul.pi-image-collection-tabs li:hover { |
|||
color: #25A8E0; |
|||
} |
|||
/* Urbz infobox theme */ |
|||
.pi-theme-Urbz.portable-infobox { |
|||
background-color:#FFF5E5 !important; |
|||
} |
|||
.pi-theme-Urbz .pi-title, |
|||
.pi-theme-Urbz .pi-header, |
|||
.pi-theme-Urbz .pi-navigation { |
|||
padding:2px; |
|||
background-color:#FFC154; |
|||
} |
|||
.portable-infobox.pi-theme-Urbz .pi-header a, |
|||
.portable-infobox.pi-theme-Urbz .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-Urbz hr { |
|||
border-top:1px solid #FFC154 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-Urbz ul.pi-image-collection-tabs li.current, .pi-theme-Urbz ul.pi-image-collection-tabs li.current:hover, .pi-theme-Urbz ul.pi-image-collection-tabs li:hover { |
|||
color: #FFC154; |
|||
} |
|||
/* Medieval infobox theme */ |
|||
.pi-theme-Medieval.portable-infobox { |
|||
background-color:#FFFBE5 !important; |
|||
} |
|||
.pi-theme-Medieval .pi-title, |
|||
.pi-theme-Medieval .pi-header, |
|||
.pi-theme-Medieval .pi-navigation { |
|||
padding:2px; |
|||
background-color:#DAA520; |
|||
} |
|||
.portable-infobox.pi-theme-Medieval .pi-header a, |
|||
.portable-infobox.pi-theme-Medieval .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-Medieval hr { |
|||
border-top:1px solid #DAA520 !important; |
|||
border:none; |
|||
} |
|||
/* for gallery tabs in infobox */ |
|||
.pi-theme-Medieval ul.pi-image-collection-tabs li.current, .pi-theme-Medieval ul.pi-image-collection-tabs li.current:hover, .pi-theme-Medieval ul.pi-image-collection-tabs li:hover { |
|||
color: #DAA520; |
|||
} |
|||
/* Social infobox theme */ |
|||
.pi-theme-Social.portable-infobox { |
|||
background-color:#E5FFFC !important; |
|||
} |
|||
.pi-theme-Social .pi-title, |
|||
.pi-theme-Social .pi-header, |
|||
.pi-theme-Social .pi-navigation { |
|||
padding:2px; |
|||
background-color:#18B4F7; |
|||
} |
|||
.portable-infobox.pi-theme-Social .pi-header a, |
|||
.portable-infobox.pi-theme-Social .pi-title a { |
|||
/* if this is ever needed, fix the color for this |
|||
color:#000000; |
|||
text-decoration:none; |
|||
*/ |
|||
} |
|||
/*** This is for the hr tag within the infobox and changes on theme ***/ |
|||
.pi-theme-Social hr { |
|||
border-top:1px solid #18B4F7 !important; |
|||
border:none; |
|||
} |
} |
||
/* for gallery tabs in infobox */ |
|||
.portable-infobox.pi-theme-all .pi-image-thumbnail { |
|||
.pi-theme-Social ul.pi-image-collection-tabs li.current, .pi-theme-Social ul.pi-image-collection-tabs li.current:hover, .pi-theme-Social ul.pi-image-collection-tabs li:hover { |
|||
width: 235px; |
|||
color: #18B4F7; |
|||
} |
} |
Revision as of 19:17, 14 August 2019
.portable-infobox .pi-navigation,
.portable-infobox .pi-header,
.portable-infobox .pi-caption,
.portable-infobox .pi-data-value,
.portable-infobox .pi-data-label {
-webkit-hyphens:none;
-moz-hyphens:none;
-ms-hyphens:none;
hyphens:none;
}
.portable-infobox {
padding:5px;
margin: 0px 1px 5px 5px;
font-size:90%;
border:1px solid #E0E0E0;
background-color:#F9F9F9;
box-shadow:1px 1px 3px #777777;
}
.portable-infobox .pi-header, .portable-infobox .pi-title {
background:#808080;
text-align:center;
color:white;
text-shadow:1px 1px 2px #222222;
box-shadow:1px 1px 3px #777777;
font-weight:bold;
}
.portable-infobox .pi-title {
font-size: 125%;
padding: 1px;
color:#ffffff;
}
.portable-infobox .pi-header {
font-size: 95%;
padding:3px;
}
.portable-infobox .pi-image {
margin-bottom:3px;
background-color: white;
border:1px solid #E0E0E0;
}
.pi-border-color {
border:none !important;
}
.pi-caption {
font-size:smaller;
font-style:italic;
line-height:22px;
text-align:center;
}
.pi-data-label {
padding: 3px 3px 0px 0px;
}
.pi-data-value {
padding: 3px 0px;
}
.portable-infobox .pi-data.pi-item-spacing {
padding: 3px;
}
/* slight spacing between a title and header if no image inbetween */
.pi-title + h2 {
margin-top: 3px !important;
}
/* slight different spacing for more than one infobox on a page */
.portable-infobox:nth-child(1n+0) {
margin-bottom:0px;
}
.portable-infobox:last-of-type {
margin-bottom:5px !important;
}
/*** tabber for portable infobox and images ***/
/* the whole tab row */
ul.pi-image-collection-tabs {
margin-top: 5px;
}
/* all tabs */
ul.pi-image-collection-tabs .pi-tab-link {
padding: 0px 5px;
background-color: none;
margin: 0px 2px;
border: none;
}
/* activated tab, important: make sure this is AFTER the one that affects all tabs, otherwise border will disappear */
ul.pi-image-collection-tabs li.current {
background-color: white;
color: #808080;
border: 1px solid #E0E0E0;
border-bottom: none;
}
/* activated hover tab and inactive hover tab */
ul.pi-image-collection-tabs li.current:hover, ul.pi-image-collection-tabs li:hover {
color: #808080;
}
/*** end tabber code for portable infobox and images ***/
/* The Sims infobox theme */
.pi-theme-The-Sims.portable-infobox {
background: #FFE9E5;
}
.pi-theme-The-Sims .pi-title, .pi-theme-The-Sims .pi-header, .pi-theme-The-Sims .pi-navigation {
background-color: #FA8072;
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-The-Sims hr {
border-top:1px solid #FA8072 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-The-Sims ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims ul.pi-image-collection-tabs li:hover {
color: #FA8072;
}
/* The Sims 2 infobox theme */
.pi-theme-The-Sims-2.portable-infobox {
background-color:#E5E8FF !important;
}
.pi-theme-The-Sims-2 .pi-title, .pi-theme-The-Sims-2 .pi-header, .pi-theme-The-Sims-2 .pi-navigation {
padding: 2px;
background-color: #7788E0;
}
.portable-infobox.pi-theme-The-Sims-2 .pi-header a, .portable-infobox.pi-theme-The-Sims-2 .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-The-Sims-2 hr {
border-top:1px solid #7788E0 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-The-Sims-2 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-2 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-2 ul.pi-image-collection-tabs li:hover {
color: #7788E0;
}
/* The Sims 3 infobox theme */
.pi-theme-The-Sims-3.portable-infobox {
background-color:#EEFFE5 !important;
}
.pi-theme-The-Sims-3 .pi-title,
.pi-theme-The-Sims-3 .pi-header,
.pi-theme-The-Sims-3 .pi-navigation {
padding:2px;
background-color:#96CF24;
}
.portable-infobox.pi-theme-The-Sims-3 .pi-header a,
.portable-infobox.pi-theme-The-Sims-3 .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-The-Sims-3 hr {
border-top:1px solid #96CF24 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-The-Sims-3 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-3 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-3 ul.pi-image-collection-tabs li:hover {
color: #96CF24;
}
/* The Sims 4 infobox theme */
.pi-theme-The-Sims-4.portable-infobox {
background-color:#E5F7FF !important;
}
.pi-theme-The-Sims-4 .pi-title,
.pi-theme-The-Sims-4 .pi-header,
.pi-theme-The-Sims-4 .pi-navigation {
padding:2px;
background-color:#25A8E0;
}
.portable-infobox.pi-theme-The-Sims-4 .pi-header a,
.portable-infobox.pi-theme-The-Sims-4 .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-The-Sims-4 hr {
border-top:1px solid #25A8E0 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-The-Sims-4 ul.pi-image-collection-tabs li.current, .pi-theme-The-Sims-4 ul.pi-image-collection-tabs li.current:hover, .pi-theme-The-Sims-4 ul.pi-image-collection-tabs li:hover {
color: #25A8E0;
}
/* Urbz infobox theme */
.pi-theme-Urbz.portable-infobox {
background-color:#FFF5E5 !important;
}
.pi-theme-Urbz .pi-title,
.pi-theme-Urbz .pi-header,
.pi-theme-Urbz .pi-navigation {
padding:2px;
background-color:#FFC154;
}
.portable-infobox.pi-theme-Urbz .pi-header a,
.portable-infobox.pi-theme-Urbz .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-Urbz hr {
border-top:1px solid #FFC154 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-Urbz ul.pi-image-collection-tabs li.current, .pi-theme-Urbz ul.pi-image-collection-tabs li.current:hover, .pi-theme-Urbz ul.pi-image-collection-tabs li:hover {
color: #FFC154;
}
/* Medieval infobox theme */
.pi-theme-Medieval.portable-infobox {
background-color:#FFFBE5 !important;
}
.pi-theme-Medieval .pi-title,
.pi-theme-Medieval .pi-header,
.pi-theme-Medieval .pi-navigation {
padding:2px;
background-color:#DAA520;
}
.portable-infobox.pi-theme-Medieval .pi-header a,
.portable-infobox.pi-theme-Medieval .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-Medieval hr {
border-top:1px solid #DAA520 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-Medieval ul.pi-image-collection-tabs li.current, .pi-theme-Medieval ul.pi-image-collection-tabs li.current:hover, .pi-theme-Medieval ul.pi-image-collection-tabs li:hover {
color: #DAA520;
}
/* Social infobox theme */
.pi-theme-Social.portable-infobox {
background-color:#E5FFFC !important;
}
.pi-theme-Social .pi-title,
.pi-theme-Social .pi-header,
.pi-theme-Social .pi-navigation {
padding:2px;
background-color:#18B4F7;
}
.portable-infobox.pi-theme-Social .pi-header a,
.portable-infobox.pi-theme-Social .pi-title a {
/* if this is ever needed, fix the color for this
color:#000000;
text-decoration:none;
*/
}
/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-Social hr {
border-top:1px solid #18B4F7 !important;
border:none;
}
/* for gallery tabs in infobox */
.pi-theme-Social ul.pi-image-collection-tabs li.current, .pi-theme-Social ul.pi-image-collection-tabs li.current:hover, .pi-theme-Social ul.pi-image-collection-tabs li:hover {
color: #18B4F7;
}