MediaWiki:Timeless.css: Difference between revisions

MediaWiki interface page
(Swap units to em for disclaimer box)
(Swap RPCN page for Vblank page in TOC columns)
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will affect users of the Timeless skin */
/* CSS placed here will affect users of the Timeless skin */
/* Hide the title on the main page */
.action-view.page-Main_Page #siteSub, .action-submit.page-Main_Page #siteSub,
.action-view.page-Main_Page #contentSub, .action-submit.page-Main_Page #contentSub,
.action-view.page-Main_Page .firstHeading, .action-submit.page-Main_Page .firstHeading {
  display: none;
}


/* Flexbox used in the Main page */
/* Flexbox used in the Main page */
Line 18: Line 25:
   border-color: #eaecf0;
   border-color: #eaecf0;
   border-radius: 10px;
   border-radius: 10px;
   padding-left: 15px;
   padding: 15px;
  padding-right: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
   margin: 5px;
   margin: 5px;
   box-shadow:
   box-shadow:
Line 30: Line 34:


.flexheading3 {
.flexheading3 {
  font-size: 1.4em;
   margin-top: 0em !important;
   margin-top: 0em;
}
}


.flexheading4 {
.flexheading4 {
  font-size: 1.2em;
   margin-top: 0em !important;
   margin-top: 0em;
  margin-bottom: 0.5em;
}
}


Line 48: Line 49:
.text-bottomline {
.text-bottomline {
   border-bottom-style: solid;  
   border-bottom-style: solid;  
   border-bottom-width: 1px;
   border-bottom-width: 2px;
   border-bottom-color: #a2a9b1;
   border-bottom-color: #c8ccd1;
}
 
.flexchild-borderless > ul {
  margin-top: 0em;
}
}


/* Formatting for the video game infobox template */
/* Video game infobox */
.vginfobox {
.vginfobox {
   float: right;
   float: right;
Line 63: Line 60:
   margin-bottom: 15px;
   margin-bottom: 15px;
   font-size: 90%;
   font-size: 90%;
   border-spacing: 0px;
   background-color: #f8f9fa;
   border-style: solid;
   border-style: solid;
   border-width: 1px;
   border-width: 1px;
   border-color: #eeeeee;
   border-color: #eaecf0;
  border-spacing: 0px;
   border-radius: 10px;
   border-radius: 10px;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}
}


Line 79: Line 81:


.vginfobox > * > tr > th, .vginfobox > * > tr > td {
.vginfobox > * > tr > th, .vginfobox > * > tr > td {
   padding: 10px;
   padding: 10px 15px;
}
 
/* TOC */
.toc {
  background-color: #f8f9fa;
  border-style: solid;
  border-width: 1px;
  border-color: #eaecf0;
  border-radius: 10px;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}
 
/** Add columns to TOC in certain pages **/
.page-Help_Game_Patches_Main #toc > ul:nth-child(3),
.page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
  column-count: 3;
}
}


/* Add formatting to disclaimer box */
@media screen and ( max-width: 850px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
    column-count: 2;
  }
}
 
@media screen and ( max-width: 550px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
    column-count: 1;
  }
}
 
.page-Help_Game_Patches_Main #toc > ul > .toclevel-1,
.page-Vblank_compatible_games_list #toc > ul > .toclevel-1 {
  page-break-inside: avoid;
}
 
/* Disclaimer box */
#disclaimer-box {
#disclaimer-box {
   background-color: #f8f9fa;
   background-color: #f8f9fa;
Line 126: Line 166:
     width: auto;
     width: auto;
   }
   }
}
/* Add columns to TOC in certain pages */
.page-Help_Game_Patches_Main #toc > ul:nth-child(3),
.page-RPCN_Compatibility_List #toc > ul:nth-child(3) {
  column-count: 3;
}
@media screen and ( max-width: 850px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-RPCN_Compatibility_List #toc > ul:nth-child(3) {
    column-count: 2;
  }
}
@media screen and ( max-width: 550px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-RPCN_Compatibility_List #toc > ul:nth-child(3) {
    column-count: 1;
  }
}
.page-Help_Game_Patches_Main #toc > ul > .toclevel-1,
.page-RPCN_Compatibility_List #toc > ul > .toclevel-1 {
  page-break-inside: avoid;
}
}

Latest revision as of 17:23, 26 February 2022

/* CSS placed here will affect users of the Timeless skin */

/* Hide the title on the main page */
.action-view.page-Main_Page #siteSub, .action-submit.page-Main_Page #siteSub,
.action-view.page-Main_Page #contentSub, .action-submit.page-Main_Page #contentSub,
.action-view.page-Main_Page .firstHeading, .action-submit.page-Main_Page .firstHeading {
  display: none;
}

/* Flexbox used in the Main page */
.flexbox-row-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.flexchild-stretch {
  flex-grow: 1;
}

.flexchild-border {
  background-color: #f8f9fa;
  border-style: solid;
  border-width: 1px;
  border-color: #eaecf0;
  border-radius: 10px;
  padding: 15px;
  margin: 5px;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}

.flexheading3 {
  margin-top: 0em !important;
}

.flexheading4 {
  margin-top: 0em !important;
}

@media screen and ( max-width: 850px ) {
  .flexheading4 {
    margin-top: 0.5em;
  }
}

.text-bottomline {
  border-bottom-style: solid; 
  border-bottom-width: 2px;
  border-bottom-color: #c8ccd1;
}

/* Video game infobox */
.vginfobox {
  float: right;
  max-width: 365px;
  margin-left: 15px;
  margin-bottom: 15px;
  font-size: 90%;
  background-color: #f8f9fa;
  border-style: solid;
  border-width: 1px;
  border-color: #eaecf0;
  border-spacing: 0px;
  border-radius: 10px;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}

@media screen and ( max-width: 850px ) {
  .vginfobox {
    float: none;
    font-size: 100%;
    margin: auto !important;
  }
}

.vginfobox > * > tr > th, .vginfobox > * > tr > td {
  padding: 10px 15px;
}

/* TOC */
.toc {
  background-color: #f8f9fa;
  border-style: solid;
  border-width: 1px;
  border-color: #eaecf0;
  border-radius: 10px;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}

/** Add columns to TOC in certain pages **/
.page-Help_Game_Patches_Main #toc > ul:nth-child(3),
.page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
  column-count: 3;
}

@media screen and ( max-width: 850px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
    column-count: 2;
  }
}

@media screen and ( max-width: 550px ) {
  .page-Help_Game_Patches_Main #toc > ul:nth-child(3),
  .page-Vblank_compatible_games_list #toc > ul:nth-child(3) {
    column-count: 1;
  }
}

.page-Help_Game_Patches_Main #toc > ul > .toclevel-1,
.page-Vblank_compatible_games_list #toc > ul > .toclevel-1 {
  page-break-inside: avoid;
}

/* Disclaimer box */
#disclaimer-box {
  background-color: #f8f9fa;
  border-style: solid;
  border-width: 1px;
  border-color: #eaecf0;
  border-radius: 10px;
  padding-left: 1em;
  padding-right: 1em;
  box-shadow:
    1px 2px 2px hsl(238deg 66% 65% / 0.3),
    2px 4px 4px hsl(238deg 66% 65% / 0.3),
    4px 8px 8px hsl(238deg 66% 65% / 0.3);
}

/* Add background and color to user message notifications */
.usermessage {
  background-color: #fef6e7;
  border-color: #fc3;
  border-width: 1px !important;
  border-style: solid !important;
  padding: 0.5em 1em !important;
  margin-bottom: 0.2em;
}

@media screen and ( min-width: 1100px ) {
  .usermessage {
    margin-bottom: 1em;
  }
}

/* Formatting for configuration tables */
.config-table {
  width: 100%;
}

.config-table-first-column {
  width: 220px;
}

@media screen and ( max-width: 850px ) {
  .config-table-first-column {
    width: auto;
  }
}