MediaWiki:Hauptseite.css
Version vom 7. September 2019, 13:35 Uhr von Phoenixclaw (Diskussion | Beiträge)
Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.
- Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
- Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
- Internet Explorer/Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
- Opera: Strg+F5
/*Für alles was da kommt... Nun nur noch für die Seriennavigation
Hauptseiten ReDesign 2.0 Rev. 3; Mai 2019*/
/*Responsible Design*/
* Screen widths: 0 < 950px < 1180px < 1650px < 2355px < 3000px */
/* width 0 < 950px */
.empty-tile { display:none; } /* No need space fillers */
@media screen and (min-width: 950px) { /* width 950px < 1180px */
.categories { max-width:750px; } /* Leave a 100px to 215px gap each side */
}
@media screen and (min-width: 1180px) { /* width 1180px < 1650px */
.empty-tile, /*{ display:inline-block; }*/
.categories { max-width:950px; } /* Leave a 115px to 200px gap each side */
}
@media screen and (min-width: 1650px) { /* width 1650px < 2355px */
.nav-titlecard { max-width:1415px; }
}
@media screen and (min-width: 2355px) { /* width 2355px < 3000px */
.nav-titlecard, /*{ max-width:2130px; }*/
.infoblock-container { max-width:2130px; }
}
@media screen and (min-width: 3000px) { /* width 3000px < inf */
.categories { max-width:2130px; }
/*.nav-titlecard { max-width:2130px; }*/
/*.infoblock-container { max-width:2130px; }*/
}
/*Seriennavigation*/
.nav-titlecard{
margin:0 auto;
/*display:flex;
flex-flow:row-reverse wrap-reverse;*/
justify-content:center;
}
.series {
display:inline-block;
position:relative;
font-size:0;
margin:2px;
}
/*
.series a {
width:100%;
height:101%;
clip:rect(0px,230px,125px,0px);
display:inline-block;
font-style:normal;
color:white;
position:absolute;
line-height:29px;
font-size:25px;
text-decoration:none;
background-color:rgba(0,0,0, 0.6);*/
/*display:flex;
flex-direction:column;*/
/* justify-content:center;
}*/
.series a:hover {
background-color:rgba(0,0,0, 0.3);
}
#mf-mainseries .series {
width: 100%;
height: 125px;
margin: 0 0 14px 0;
overflow: hidden;
}
#mf-mainseries .series img { /* May need more tweaking */
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
}
#mf-mainseries .series a {
width: 100%;
height: 100%;
text-align: left;
box-sizing: border-box;
padding: 5%; /* Changed from 16px */
justify-content: flex-start;
clip: auto;
box-shadow: inset rgba(255, 255, 255, 0.1) 0 0 0 1px;
z-index: 1;
}
#mf-mainseries .series {
bottom: 12px;
right: 16px;
left: auto;
}
/*Kacheln*/
div.tabcontents.vertical-centered-content > div.content img {
position: relative;
top: 50%;
transform: translateY(-50%);
}
div.tabcontainer span.tab.explain {
text-decoration: none;
}
table.infobox-curse-ad div.tabcontents.vertical-centered-content > div.content img {
position: relative;
top: 50%;
transform: translateY(-50%);
}
div.tabcontainer span.tab.explain {
text-decoration: none;
float: none;
display: inline-block;
}
div.tabcontainer {
margin-left: auto;
margin-right: auto;
}
div.tabcontainer-top {
padding-top: 5px;
margin-top: 0;
margin-bottom: 10px;
}
div.tabcontainer-bottom {
padding-bottom: 5px;
margin-top: 10px;
margin-bottom: 0;
}
/* Tabs */
.tabcontainer .tab {
background-color: #2a2a2a;
/* background-image:-webkit-linear-gradient(top, #6e6e6e, #2a2a2a);
background-image: -moz-linear-gradient(top, #6e6e6e, #2a2a2a);
background-image: -ms-linear-gradient(top, #6e6e6e, #2a2a2a);
background-image: -o-linear-gradient(top, #6e6e6e, #2a2a2a);
background-image: linear-gradient(top, #6e6e6e, #2a2a2a);*/
border:1px solid #250b2d;
border-radius:2px;
cursor:pointer;
float:middle;
margin:0 1px 2px;
padding:3px;
text-align:center;
white-space:nowrap;
}
.tabcontainer .tab:hover {
background-color:#1D1D1D;
/* background-image:-webkit-linear-gradient(top, #4a4a4a, #1D1D1D);
background-image: -moz-linear-gradient(top, #4a4a4a, #1D1D1D);
background-image: -ms-linear-gradient(top, #4a4a4a, #1D1D1D);
background-image: -o-linear-gradient(top, #4a4a4a, #1D1D1D);
background-image: linear-gradient(top, #4a4a4a, #1D1D1D);*/
color:#e69710;
}
.tabcontainer .tab.active {
background-color:#1D1D1D !important;
/* background-image:-webkit-linear-gradient(top, #3b3b3b, #1D1D1D);
background-image: -moz-linear-gradient(top, #3b3b3b, #1D1D1D);
background-image: -ms-linear-gradient(top, #3b3b3b, #1D1D1D);
background-image: -o-linear-gradient(top, #3b3b3b, #1D1D1D);
background-image: linear-gradient(top, #3b3b3b, #1D1D1D); Gradient ist zu 2010*/
color:#e69710;
}