MediaWiki:Themes.css: Difference between revisions

From The Sims Wiki, a collaborative database for The Sims series
Jump to navigation Jump to search
Content added Content deleted
sims>C.Syde65
mNo edit summary
imported>Mechemik
mNo edit summary
 
(19 intermediate revisions by 3 users not shown)
Line 1: Line 1:
.portable-infobox .pi-navigation,
/*SIMS ALL*/
.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-theme-all {
.portable-infobox .pi-header, .portable-infobox .pi-title {
width: 250px;
background:#808080;
float: right;
text-align:center;
clear: right;
color:white;
margin: 0 0 1em 1em;
text-shadow:1px 1px 2px #222222;
border: 1px solid #007FFF;
box-shadow:1px 1px 3px #777777;
background: #FFFFFF;
font-weight:bold;
-webkit-border-radius: 10px;
padding: 10px 10px 10px 10px;
}
}


.portable-infobox.pi-theme-all .pi-title {
.portable-infobox .pi-title {
font-style: italic;
font-size: 125%;
background: white;
padding: 1px;
color: #3A3A3A;
color:#ffffff;
font-size: 94%;
margin: 0 3% 0 3%;
padding-top: 0;
padding-bottom: 0;
text-align: center;
font-weight: bold;
}
}


.portable-infobox.pi-theme-all .pi-caption {
.portable-infobox .pi-header {
text-align: center;
font-size: 95%;
color: #3A3A3A;
padding:3px;
padding-top: 0;
padding-bottom: 0;
font-style: inherit;
}
}


.portable-infobox.pi-theme-all .pi-image-thumbnail {
.portable-infobox .pi-image {
width: 235px;
margin-bottom:3px;
height: auto;
background-color: white;
border:1px solid #E0E0E0;
}
}


.pi-border-color {
/*SIMS 2*/
border:none !important;
}


.pi-caption {
.pi-theme-sim2.portable-infobox {
font-size:smaller;
border: 2px solid #6495ed;
font-style:italic;
border-radius: 5px;
line-height:22px;
background: #ffffff;
text-align:center;
}
}


.pi-theme-sim2 .pi-title,
.pi-data-label {
padding: 3px 3px 0px 0px;
.pi-theme-sim2 .pi-header,
.pi-theme-sim2 .pi-navigation {
padding: 2px;
font-size: 11pt;
}
}


.pi-theme-sim2 .pi-title {
.pi-data-value {
padding: 3px 0px;
background: #4466ff;
}
}


.portable-infobox .pi-data.pi-item-spacing {
.pi-theme-sim2 .pi-header,
padding: 3px;
.pi-theme-sim2 .pi-navigation {
background: #6495ed;
}
}


/* slight spacing between a title and header if no image inbetween */
.pi-theme-sim2 .pi-data.pi-item-spacing {
.pi-title + h2, .pi-title + .pi-group {
padding: 0;
margin-top: 3px !important;
}
}


/* slight different spacing for more than one infobox on a page */
.pi-theme-sim2.portable-infobox .pi-data {
.portable-infobox:nth-child(1n+0) {
border-bottom: 1px solid #99bbff;
margin-bottom:0px;
}
}


.portable-infobox:last-of-type {
.pi-theme-sim2 .pi-data-label {
margin-bottom:5px !important;
background: #bfdfff;
-ms-flex-preferred-size: 104px;
-webkit-flex-basis: 104px;
-moz-flex-basis: 104px;
flex-basis: 104px;
}
}


/*** tabber for portable infobox and images ***/
.pi-theme-sim2 .pi-data-label,
/* the whole tab row */
.pi-theme-sim2 .pi-data-value {
ul.pi-image-collection-tabs {
padding: 5px;
margin-top: 5px;
}
}


/* all tabs */
.portable-infobox.pi-theme-sim2 .pi-header a,
.portable-infobox.pi-theme-sim2 .pi-title a {
ul.pi-image-collection-tabs .pi-tab-link {
color: #0000a4;
padding: 0px 5px;
text-decoration: none;
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 */
.pi-theme-sim2.pi-background {
ul.pi-image-collection-tabs li.current {
background: #6495ed;
background-color: white;
border: 1px solid #4466ff;
color: #808080;
border-radius: 5px;
border: 1px solid #E0E0E0;
font-size: 90%;
border-bottom: none;
overflow: hidden;
padding: 2px;
width: 260px;
}
}


/* activated hover tab and inactive hover tab */
.pi-theme-sim2 .pi-title {
ul.pi-image-collection-tabs li.current:hover, ul.pi-image-collection-tabs li:hover {
background: #4466ff;
color: #808080;
font-size: 104%;
padding: 1px;
text-align: center;
color: #ffffff;
font-weight: bold;
}
}
/*** end tabber code for portable infobox and images ***/



.pi-theme-sim2 section:nth-of-type(1) .pi-header {
/* The Sims infobox theme */
font-size: 90%;
.pi-theme-The-Sims.portable-infobox {
background: #4466ff;
background: #FFE9E5;
text-align: center;
color: #ffffff;
}
}


.pi-theme-The-Sims .pi-title, .pi-theme-The-Sims .pi-header, .pi-theme-The-Sims .pi-navigation {
.pi-theme-sim2 .pi-biography {
color: #4466ff;
background-color: #FA8072;
font-size: smaller;
font-style: italic;
line-height: 22px;
text-align: center;
}
}


/*** This is for the hr tag within the infobox and changes on theme ***/
.pi-theme-sim2 .pi-header {
.pi-theme-The-Sims hr {
background: #6495ed;
border-top:1px solid #FA8072 !important;
font-size: 104%;
border:none;
padding: 3px;
}
}


/* for gallery tabs in infobox */
.pi-theme-sim2 .pi-item.pi-data {
.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 {
background: #ffffff;
color: #FA8072;
border-bottom: 1px solid #99bbff;
padding: 0;
}
}


/* The Sims 2 infobox theme */
.pi-theme-sim2 .pi-data-label {
.pi-theme-The-Sims-2.portable-infobox {
background: #bfdfff;
background-color:#E5E8FF !important;
padding: 3px;
-ms-flex-preferred-size: 104px;
-webkit-flex-basis: 104px;
-moz-flex-basis: 104px;
flex-basis: 104px;
}
}


.pi-theme-The-Sims-2 .pi-title, .pi-theme-The-Sims-2 .pi-header, .pi-theme-The-Sims-2 .pi-navigation {
.pi-theme-sim2 .pi-data-value {
padding: 3px;
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-sim2 .pi-image {
.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 {
background: #ffffff;
color: #18B4F7;
padding: 3px 0;
}
}

Latest revision as of 20:38, 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, .pi-title + .pi-group {
  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;
}