Difference between revisions of "MediaWiki:Common.css"

From AoW: Planetfall
Jump to navigation Jump to search
m
m
 
Line 81: Line 81:
  
 
.gridBG {
 
.gridBG {
background: #3c5a6e url(/images/a/ad/AoW_MainBG.jpg) repeat left center;
+
background: #605336 url(/images/a/ad/AoW_MainBG.jpg) repeat left center;
 
}
 
}

Latest revision as of 09:08, 30 May 2020

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


/* RWD test */
/* hide options */
@media only screen and (max-width: 600px) {
  .hides {display: none;}
}

@media only screen and (max-width: 1200px) {
  .hidem {display: none;}
}

@media only screen and (min-width: 1201px) {
  .hidel {display: none;}
}

/* Grid layout test */
* {
/*  box-sizing: border-box; */
}

/* grid container (large screen) */
.grid-container {
  display: grid;
  grid-template-areas: 
    'header header header header header header' 
    'left middle middle middle middle right' 
    'left middle2 middle2 middle2 middle2 right' 
    'left middle3 middle3 middle3 middle3 right' 
    'left footer footer footer footer footer';
} 

/* grid container (medium screen) */
@media only screen and (max-width: 1200px) {
  .grid-container  {
    grid-template-areas: 
    'header header header header header header' 
    'left middle middle middle middle middle ' 
    'left middle2 middle2 middle2 middle2 middle2 ' 
    'left middle3 middle3 middle3 middle3 middle3 ' 
    'left footer footer footer footer footer';
  }
}

/* grid container (small screen) */
@media only screen and (max-width: 600px) {
  .grid-container  {
    grid-template-areas: 
      'header header header header header header' 
      'middle middle middle middle middle middle' 
      'middle2 middle2 middle2 middle2 middle2 middle2' 
      'left left left left left left' 
      'middle3 middle3 middle3 middle3 middle3 middle3' 
      'footer footer footer footer footer footer';
  }
}

/* grid area location classes */
.header {
  grid-area: header;
}
.footer {
  grid-area: footer;
}
.left {
  grid-area: left;
}
.right {
  grid-area: right;
}
.middle {
  grid-area: middle;
}
.middle2 {
  grid-area: middle2;
}
.middle3 {
  grid-area: middle3;
}

.gridBG {
	background: #605336 url(/images/a/ad/AoW_MainBG.jpg) repeat left center;
}