Module:Infobox/styles.css: Difference between revisions

From wiki
Jump to navigation Jump to search
1>Jon (WMF)
(Fixes phab:T369874. Please see talk page and do not revert without discussion. See also meta:User:Jon_(WMF)/Edit_for_dark_mode_support)
 
m (1 revision imported)
 
(One intermediate revision by one other user not shown)
Line 1: Line 1:
/* {{pp|small=y}} */
/*
/*
  * This TemplateStyles sheet deliberately does NOT include the full set of
  * This TemplateStyles sheet deliberately does NOT include the full set of
Line 28: Line 29:
.infobox .navbar {
.infobox .navbar {
font-size: 100%;
font-size: 100%;
}
/* T281642 */
body.skin-minerva .infobox-header,
body.skin-minerva .infobox-subheader,
body.skin-minerva  .infobox-above,
body.skin-minerva .infobox-title,
body.skin-minerva  .infobox-image,
body.skin-minerva  .infobox-full-data,
body.skin-minerva .infobox-below {
text-align: center;
}
}


Line 48: Line 38:
      /* switch with var( --color-base ) when supported. */
      /* switch with var( --color-base ) when supported. */
      color: #f8f9fa;
      color: #f8f9fa;
}
@media screen and ( prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) div:not(.notheme) {
      background: #1f1f23 !important;
      /* switch with var( --color-base ) when supported. */
      color: #f8f9fa;
    }
}
html.skin-theme-clientpref-night .infobox td div:not(.notheme)[style] {
background: transparent !important;
    color: var(--color-base,#202122);
}
@media screen and ( prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .infobox td div:not(.notheme)[style] {
background: transparent !important;
    color: var(--color-base,#202122);
    }
}
html.skin-theme-clientpref-night .infobox td div.NavHead:not(.notheme)[style] {
  background: transparent !important;
}
}
}
}
Line 77: Line 43:


@media screen and ( prefers-color-scheme: dark) {
@media screen and ( prefers-color-scheme: dark) {
     html.skin-theme-clientpref-os .infobox td div.NavHead:not(.notheme)[style] {
     html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) div:not(.notheme) {
background: transparent !important;
      background: #1f1f23 !important;
      /* switch with var( --color-base ) when supported. */
      color: #f8f9fa;
     }
     }
}
}


/* Since infobox is a table, many infobox templates take advantage of this to add columns and rows to the infobox itself rather than as part of a new table inside them. This class should be discouraged and removed on the long term, but allows us to at least identify these tables going forward
/* Since infobox is a table, many infobox templates take advantage of this to add columns and rows to the infobox itself rather than as part of a new table inside them. This class should be discouraged and removed on the long term, but allows us to at least identify these tables going forward

Latest revision as of 12:17, 23 April 2025

/* Template:Pp */ /*

* This TemplateStyles sheet deliberately does NOT include the full set of
* infobox styles. We are still working to migrate all of the manual
* infoboxes. See MediaWiki talk:Common.css/to do#Infobox
* DO NOT ADD THEM HERE
*/

/*

* not strictly certain these styles are necessary since the modules now
* exclusively output infobox-subbox or infobox, not both
* just replicating the module faithfully
*/

.infobox-subbox { padding: 0; border: none; margin: -3px; width: auto; min-width: 100%; font-size: 100%; clear: none; float: none; background-color: transparent; }

.infobox-3cols-child { margin: auto; }

.infobox .navbar { font-size: 100%; }

/* Dark theme: William_Wragg, Coral_Castle */

@media screen {

   html.skin-theme-clientpref-night .infobox-full-data:not(.notheme) > div:not(.notheme)[style] {

background: #1f1f23 !important; /* switch with var( --color-base ) when supported. */ color: #f8f9fa; } }


@media screen and ( prefers-color-scheme: dark) {

   html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) div:not(.notheme) {
     background: #1f1f23 !important;
     /* switch with var( --color-base ) when supported. */
     color: #f8f9fa;
   }

}


/* Since infobox is a table, many infobox templates take advantage of this to add columns and rows to the infobox itself rather than as part of a new table inside them. This class should be discouraged and removed on the long term, but allows us to at least identify these tables going forward Currently in use on: Module:Infobox3cols Fixes issue described in https://phabricator.wikimedia.org/F55300125 on Vector 2022.

  • /

@media (min-width: 640px) {

 body.skin--responsive .infobox-table {
   display: table !important;
 }
 body.skin--responsive .infobox-table > caption {
   display: table-caption !important;
 }
 body.skin--responsive .infobox-table > tbody {
   display: table-row-group;
 }
 body.skin--responsive .infobox-table tr {
   display: table-row !important;
 }
 body.skin--responsive .infobox-table th,
 body.skin--responsive .infobox-table td {
   padding-left: inherit;
   padding-right: inherit;
 }

}