Difference between revisions of "MediaWiki:Common.css"

From The Viking Age Compendium
Jump to: navigation, search
m
m
Line 13: Line 13:
  
 
/* CSS Responsive Gallery */
 
/* CSS Responsive Gallery */
.wrap {
+
@media only screen and (max-width : 940px),
  overflow: hidden;
+
only screen and (max-device-width : 940px){
 
+
.galleryItem {width: 21%;}
 
}
 
}
.box {
+
  float: left;
+
@media only screen and (max-width : 720px),
  position: relative;
+
only screen and (max-device-width : 720px){
  width: 20%;
+
.galleryItem {width: 29.33333%;}
  padding-bottom: 10%;
+
 
}
 
}
.boxInner {
+
  position: absolute;
+
@media only screen and (max-width : 530px),
 
+
only screen and (max-device-width : 530px){
  overflow: hidden;
+
.galleryItem {width: 46%;}
 
}
 
}
.boxImg {
+
  width: 100%;
+
@media only screen and (max-width : 320px),
}
+
only screen and (max-device-width : 320px){
 
+
.galleryItem {width: 96%;}
 
+
@media only screen and (max-width : 480px) {
+
  /* Smartphone view: 1 tile */
+
  .box {
+
      width: 100%;
+
      padding-bottom: 50%;
+
  }
+
}
+
@media only screen and (max-width : 650px) and (min-width : 481px) {
+
  /* Tablet view: 2 tiles */
+
  .box {
+
      width: 50%;
+
      padding-bottom: 25%;
+
  }
+
}
+
@media only screen and (max-width : 1050px) and (min-width : 651px) {
+
  /* Small desktop / ipad view: 3 tiles */
+
  .box {
+
      width: 33.3%;
+
      padding-bottom: 16.2%;
+
  }
+
}
+
@media only screen and (max-width : 1290px) and (min-width : 1051px) {
+
  /* Medium desktop: 4 tiles */
+
  .box {
+
      width: 25%;
+
      padding-bottom: 12.5%;
+
  }
+
 
}
 
}
 
/* CSS Responsive Gallery END*/
 
/* CSS Responsive Gallery END*/

Revision as of 22:12, 5 December 2016

/* CSS placed here will be applied to all skins */

#ca-history { display:none!important; }
/* #filehistory {display: none} */ /* Hides the "File history" header */
/* .special {display: none}  */ /* Hides the Edit history */
#metadata {display: none} /* Hides the "Metadata" header */
#mw_metadata {display: none} /* Hides the Metadata graph */

#ca-talk { display:none!important; }

/* Hides Mobile only elements */
#mf-HideOnDesktop { display: none; }

/* CSS Responsive Gallery */
@media only screen and (max-width : 940px),
only screen and (max-device-width : 940px){
	.galleryItem {width: 21%;}
}
 
@media only screen and (max-width : 720px),
only screen and (max-device-width : 720px){
	.galleryItem {width: 29.33333%;}
}
 
@media only screen and (max-width : 530px),
only screen and (max-device-width : 530px){
	.galleryItem {width: 46%;}
}
 
@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px){
	.galleryItem {width: 96%;}
	
}
/* CSS Responsive Gallery END*/


.tocnumber { display: none !important; }
.toc { width: 200px; } 

/* Allow limiting of which header levels are shown in a TOC;
   <div class="toclimit-3">, for instance, will limit to
   showing ==headings== and ===headings=== but no further
   (as long as there are no =headings= on the page, which
   there shouldn't be according to the MoS).*/
.toclimit-2 .toclevel-2,
.toclimit-3 .toclevel-3,
.toclimit-4 .toclevel-4,
.toclimit-5 .toclevel-5,
.toclimit-6 .toclevel-6,
.toclimit-7 .toclevel-7 { display: none; }

#toc { float:right };

#footer-places-Privacy_policy { display:none;}
#footer-places-disclaimer { display:none;}
#footer-places-about { display:none;}

.hidden {display:none}

/*Add this text at the end of [[Mediawiki:Commons.css]]
/*For HarvardReferences extension */
.harvVisitedLink { 
	background-color: #AAAAAA;
}
.harvReferenceLink { 
	background-color: #FFFF00;
}
.harvNone { 
	background-color: inherit;
}
.harvBackground { 
	background-color: #DDEEFF;
}

/* CSS Hover Gallery for Mediawiki
 * 
 * @author: Unknown
 * current version crafted together by [[User:Christharp]] from several CSS sites. For my website:[http://www.yellpedia.com/wiki/Main_Page Yellpedia]
 */

.zoom_img img{
-moz-transition:-moz-transform 0.1s ease-in; 
-webkit-transition:-webkit-transform 0.1s ease-in; 
-o-transition:-o-transform 0.1s ease-in;
transition:transform 0.1 ease-in;
}

.zoom_img img:hover{
-moz-transform:scale(2); 
-webkit-transform:scale(2);
-o-transform:scale(2);
transform:scale(2);
}