MediaWiki:Portable infobox.css: Unterschied zwischen den Versionen
Master (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „.portable-infobox { width:210px; padding:3px; border:1px solid #3c3c43; box-sizing:border-box; font-size:10px; line-height:12px; ma…“) |
|||
(Eine dazwischenliegende Version desselben Benutzers wird nicht angezeigt) | |||
Zeile 13: | Zeile 13: | ||
.portable-infobox .pi-secondary-background { | .portable-infobox .pi-secondary-background { | ||
background-color:transparent; | background-color:transparent; | ||
+ | background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #0e1519), color-stop(50%, #3a5766), color-stop(100%, #0e1519)); | ||
+ | background: -webkit-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%); | ||
+ | background: -moz-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%); | ||
+ | background: -o-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%); | ||
+ | background: linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%); | ||
} | } | ||
.portable-infobox .pi-border-color { | .portable-infobox .pi-border-color { | ||
Zeile 34: | Zeile 39: | ||
padding: 4px; | padding: 4px; | ||
text-align: center; | text-align: center; | ||
− | font-weight: | + | font-weight:700; |
color:inherit; | color:inherit; | ||
} | } | ||
Zeile 83: | Zeile 88: | ||
.portable-infobox .pi-collapse .pi-header { | .portable-infobox .pi-collapse .pi-header { | ||
margin:0 0 .5em 0; | margin:0 0 .5em 0; | ||
− | width: | + | width:100%; |
− | text-align: | + | text-align:center; |
color:rgb(213,213,212); | color:rgb(213,213,212); | ||
transition:color 200ms linear; | transition:color 200ms linear; | ||
Zeile 90: | Zeile 95: | ||
} | } | ||
.portable-infobox .pi-collapse.pi-collapse-closed .pi-header { | .portable-infobox .pi-collapse.pi-collapse-closed .pi-header { | ||
− | color:# | + | color:#e69710; |
} | } | ||
.portable-infobox .pi-collapse .pi-header .pi-collapse-dots { | .portable-infobox .pi-collapse .pi-header .pi-collapse-dots { | ||
Zeile 125: | Zeile 130: | ||
width:auto; | width:auto; | ||
height:auto; | height:auto; | ||
+ | } | ||
+ | |||
+ | .pi-data-value:not(:first-child){ | ||
+ | padding-left: 10px; | ||
} | } | ||
Aktuelle Version vom 2. November 2019, 21:45 Uhr
.portable-infobox {
width:210px;
padding:3px;
border:1px solid #3c3c43;
box-sizing:border-box;
font-size:10px;
line-height:12px;
margin:0 0 16px 16px;
}
.portable-infobox.pi-background {
background-color:#222226;
}
.portable-infobox .pi-secondary-background {
background-color:transparent;
background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #0e1519), color-stop(50%, #3a5766), color-stop(100%, #0e1519));
background: -webkit-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: -moz-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: -o-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
}
.portable-infobox .pi-border-color {
border:0 transparent;
}
.portable-infobox .pi-font,.portable-infobox .pi-secondary-font,.portable-infobox .pi-title, .portable-infobox .pi-header {
font-size:inherit;
line-height:inherit;
}
.portable-infobox .pi-item-spacing {
padding:0;
}
.portable-infobox .pi-title {
cursor:pointer;
background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #0e1519), color-stop(50%, #3a5766), color-stop(100%, #0e1519));
background: -webkit-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: -moz-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: -o-linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
background: linear-gradient(left center, #0e1519 0%, #3a5766 50%, #0e1519 100%);
padding: 4px;
text-align: center;
font-weight:700;
color:inherit;
}
.portable-infobox .pi-image-thumbnail {
max-width:100%;
height:auto;
}
.portable-infobox .pi-data {
justify-content:space-between;
margin-bottom:1px;
}
.portable-infobox .pi-data-label {
text-align:right;
flex-basis:49%;
color:inherit;
}
.portable-infobox .pi-data-value {
flex-basis:49%;
padding:0;
}
.portable-infobox .pi-data-value dd {
margin:0;
}
.portable-infobox .pi-group {
margin:1em 0;
}
.portable-infobox .pi-navigation {
font-weight:normal;
text-align:center;
margin-top:1.5em;
}
.portable-infobox .pi-collapse {
overflow:hidden;
animation-name:open;
animation-duration:200ms;
animation-timing-function:ease-in;
max-height:none;
margin:.4em 0 .5em 0;
}
.portable-infobox .pi-collapse.pi-collapse-closed {
animation-name:close;
animation-duration:200ms;
animation-timing-function:ease-out;
max-height:1.4em;
margin:.4em 0 0 0;
}
.portable-infobox .pi-collapse .pi-header {
margin:0 0 .5em 0;
width:100%;
text-align:center;
color:rgb(213,213,212);
transition:color 200ms linear;
cursor: pointer;
}
.portable-infobox .pi-collapse.pi-collapse-closed .pi-header {
color:#e69710;
}
.portable-infobox .pi-collapse .pi-header .pi-collapse-dots {
opacity:0;
transition:opacity 200ms linear;
}
.portable-infobox .pi-collapse.pi-collapse-closed .pi-header .pi-collapse-dots {
opacity:1;
}
.portable-infobox .pi-collapse .pi-header:first-child::after {
display:none;
}
.portable-infobox .pi-collapse.pi-collapse-closed .pi-data {
display:flex;
}
@keyframes close {
0% {max-height:20em}
100% {max-height:1.4em}
}
@keyframes open {
0% {max-height:1.4em}
100% {max-height:20em}
}
.portable-infobox .releases .article-thumb{
margin:0;
max-width:100%;
width:auto !important;
height:auto;
}
.portable-infobox .releases .article-thumb img{
max-width:100%;
width:auto;
height:auto;
}
.pi-data-value:not(:first-child){
padding-left: 10px;
}
/*Releases*/
.portable-infobox .releases .sub-sidebar {display:flex!important; flex-direction:row-reverse; margin-top:.7em}
.portable-infobox .releases dt {display:none}
.portable-infobox .releases dd {margin-left:4px; width:97px}
.portable-infobox .releases dl {text-align:left; flex-basis:97px; margin:0; flex-grow:0; order:1}
.portable-infobox .releases figcaption {display:none}
.portable-infobox .releases figure {flex-basis:100px; order:2}