Module:WpInfobox/styles.css: Difference between revisions

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

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

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

.infobox-hiddenrow {
  display: none;
}

body.skin--responsive.skin--responsive .infobox .infobox-hiddenrow {
  display: none;
}

.infobox {
  border: 1px solid #a2a9b1;
  color: black;
  padding: 0.2em;
  font-size: 88%;
  line-height: 1.5em;
  border-spacing: 3px;
  margin: 0.5em 0;
}

.infobox-header {
  vertical-align: top;
}

.infobox-label {
  vertical-align: top;
  text-align: left;
}

.infobox-above {
  vertical-align: top;
}

.infobox-full-data {
  vertical-align: top;
}

.infobox-data {
  vertical-align: top;
  text-align: left;
}

.infobox-below {
  vertical-align: top;
}

.infobox-subheader {
  vertical-align: top;
}

.infobox-image {
  vertical-align: top;
}

.infobox-navbar {
  vertical-align: top;
}

.infobox th {
  vertical-align: top;
  text-align: left;
}

.infobox td {
  vertical-align: top;
  text-align: left;
}

.infobox .infobox-above {
  font-size: 125%;
  font-weight: bold;
  text-align: center;
}

.infobox .infobox-title {
  font-size: 125%;
  font-weight: bold;
  text-align: center;
}

.infobox caption {
  font-size: 125%;
  font-weight: bold;
  text-align: center;
  padding: 0.2em;
}

.infobox-title {
  padding: 0.2em;
}

.infobox .infobox-header {
  text-align: center;
}

.infobox .infobox-subheader {
  text-align: center;
}

.infobox .infobox-image {
  text-align: center;
}

.infobox .infobox-full-data {
  text-align: center;
}

.infobox .infobox-below {
  text-align: center;
}

.infobox .infobox-navbar {
  text-align: right;
}

@media (min-width: 640px) {
	.infobox {
		
		margin-left: 1em;
		
		float: right;
		
		clear: right;
		width: 22em;
	}
}

@media screen {
	html.skin-theme-clientpref-night .infobox-full-data:not(.notheme) > div:not(.notheme)[style] {
		background: #1f1f23 !important;
		
		color: #f8f9fa;
	}
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) > div:not(.notheme)[style] {
		background: #1f1f23 !important;
		
		color: #f8f9fa;
	}
}

@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 th,
	body.skin--responsive .infobox-table td {
		padding-left: inherit;
		padding-right: inherit;
	}
}

@media screen {
	.infobox {
		background-color: var(--background-color-neutral-subtle, #f8f9fa);
    }
}

@media (max-width: 640px) {
	.infobox {
		width: 100%;
	}
    
	.infobox .nowrap {
		white-space: normal;
	}
}