Jump to content

Template:Infobox musical artist

From Musician Wiki
Revision as of 18:51, 12 April 2026 by Jasongeek (talk | contribs) (Created page with "======================: Infobox Musical Artist: ======================: .infobox { border: 1px solid #a2a9b1; background-color: #f8f9fa; margin: 0.5em 0 0.5em 1em; padding: 0.2em; float: right; clear: right; width: 22em; font-size: 88%; Slightly smaller than body text: line-height: 1.4em; border-collapse: collapse; color: #222; } .infobox caption { font-size: 125%; font-weight: bold; text-align...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

/* ====================== */ /* Infobox Musical Artist */ /* ====================== */

.infobox {

   border: 1px solid #a2a9b1;
   background-color: #f8f9fa;
   margin: 0.5em 0 0.5em 1em;
   padding: 0.2em;
   float: right;
   clear: right;
   width: 22em;
   font-size: 88%; /* Slightly smaller than body text */
   line-height: 1.4em;
   border-collapse: collapse;
   color: #222;

}

.infobox caption {

   font-size: 125%;
   font-weight: bold;
   text-align: center;
   padding: 0.3em 0.5em 0.4em;
   background-color: #f0f0f0;
   border-bottom: 1px solid #a2a9b1;
   margin-bottom: 0.3em;

}

.infobox td, .infobox th {

   vertical-align: top;
   padding: 0.3em 0.6em 0.3em 0.4em;
   border-bottom: 1px solid #ddd;

}

.infobox th {

   text-align: right;
   font-weight: normal;
   width: 40%;
   padding-right: 0.8em;
   color: #555;
   background-color: #f8f9fa;

}

.infobox td {

   width: 60%;

}

/* Image handling */ .infobox-image {

   text-align: center;
   padding: 0.4em 0;

}

.infobox-image img {

   max-width: 100%;
   height: auto;
   border: 1px solid #aaa;

}

/* Header / Title row (name of the artist/band) */ .infobox-above, .infobox-title {

   font-size: 130%;
   font-weight: bold;
   text-align: center;
   padding: 0.4em 0.5em;
   background-color: #e6e6e6;
   border-bottom: 2px solid #a2a9b1;

}

/* Subheaders (e.g. "Born", "Origin", etc.) */ .infobox-subheader {

   font-weight: bold;
   background-color: #f0f0f0;
   text-align: center;
   padding: 0.2em;

}

/* Remove bottom border on last row */ .infobox tr:last-child td, .infobox tr:last-child th {

   border-bottom: none;

}

/* Make it look nicer on narrow screens */ @media (max-width: 720px) {

   .infobox {
       float: none;
       margin: 0.5em auto;
       width: 90%;
       max-width: 300px;
   }

}

/* Optional: Dark mode support (for modern skins) */ @media (prefers-color-scheme: dark) {

   .infobox {
       background-color: #202122;
       border-color: #54595d;
       color: #ddd;
   }
   .infobox th {
       background-color: #202122;
       color: #aaa;
   }
   .infobox caption,
   .infobox-above,
   .infobox-title,
   .infobox-subheader {
       background-color: #2a2a2e;
       color: #fff;
       border-color: #54595d;
   }

}

/* ====================== */ /* Specific to Musical Artist */ /* ====================== */

/* Background color variation based on |background= parameter */ /* You can add more classes if your template outputs them */

.infobox-musician-solo, .infobox .background-solo_singer {

   border-left: 8px solid #b0c4de; /* Light steel blue */

}

.infobox-musician-band, .infobox .background-group_or_band {

   border-left: 8px solid #98fb98; /* Pale green */

}

/* You can expand these if your template adds specific classes */