MediaWiki:Hauptseite.css: Unterschied zwischen den Versionen

aus Memory Alpha, der freien deutschen Star-Trek-Datenbank
Spring zu: Navigation, suche
Zeile 100: Zeile 100:
 
left: auto;
 
left: auto;
 
}
 
}
 +
 
/*Kacheln*/
 
/*Kacheln*/
 
div.tabcontents.vertical-centered-content > div.content img  {
 
div.tabcontents.vertical-centered-content > div.content img  {
Zeile 109: Zeile 110:
 
div.tabcontainer span.tab.explain {
 
div.tabcontainer span.tab.explain {
 
text-decoration: none;
 
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;
 
}
 
}

Version vom 7. September 2019, 13:14 Uhr

/*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;
}