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)
 
imported>Izno
(remove this block entirely, common.css and minerva.css have the relevant styles)
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

Revision as of 17:45, 12 November 2024

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

}