MediaWiki:Common.css: Difference between revisions

From Wiki Maui Linux NET
Jump to navigation Jump to search
Created page with "============================== Infobox styling for software articles ==============================: General infobox container: .infobox { border: 1px solid #aaa; background-color: #f9f9f9; color: #000; margin: 0 0 1em 1em; padding: 0.2em; float: right; clear: right; width: 22em; font-size: 90%; line-height: 1.4em; border-collapse: collapse; border-radius: 6px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15); } Table headers: ..."
 
(No difference)

Latest revision as of 12:44, 20 October 2025

/* ==============================
   Infobox styling for software articles
   ============================== */

/* General infobox container */
.infobox {
  border: 1px solid #aaa;
  background-color: #f9f9f9;
  color: #000;
  margin: 0 0 1em 1em;
  padding: 0.2em;
  float: right;
  clear: right;
  width: 22em;
  font-size: 90%;
  line-height: 1.4em;
  border-collapse: collapse;
  border-radius: 6px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
}

/* Table headers */
.infobox th {
  background-color: #e6e6e6;
  text-align: left;
  padding: 0.3em 0.4em;
  vertical-align: top;
  width: 35%;
}

/* Table data cells */
.infobox td {
  padding: 0.3em 0.4em;
  vertical-align: top;
}

/* Infobox title */
.infobox caption,
.infobox th[colspan="2"] {
  background-color: #efefef;
  text-align: center;
  font-size: 120%;
  font-weight: bold;
  padding: 0.4em;
  border-bottom: 1px solid #aaa;
}

/* Centered image */
.infobox img {
  max-width: 200px;
  height: auto;
  border: none;
  margin: 0.3em 0;
}

/* Links inside infobox */
.infobox a {
  color: #0645ad;
  text-decoration: none;
}

.infobox a:hover {
  text-decoration: underline;
}

/* Optional subtle gradient header */
.infobox th[colspan="2"] {
  background: linear-gradient(to bottom, #f5f5f5 0%, #e5e5e5 100%);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

/* Prevent overlap with floating elements */
.mw-body-content::after {
  content: "";
  display: block;
  clear: both;
}