MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
.character-infobox { | .character-infobox { | ||
float: right; | float: right; | ||
| Line 10: | Line 6: | ||
border-spacing: 0; | border-spacing: 0; | ||
border: 2px solid var(--infobox-color); | border: 2px solid var(--infobox-color); | ||
border-radius: 0 0 | border-radius: 0 0 10px 10px; | ||
overflow: hidden; | overflow: hidden; | ||
background: #ffffff; | background: #ffffff; | ||
box-shadow: 0 | box-shadow: 0 3px 8px rgba(0,0,0,0.18); | ||
font-size: 90%; | font-size: 90%; | ||
} | } | ||
/* Title/Header */ | |||
.character-infobox-title { | .character-infobox-title { | ||
background: var(--infobox-color); | background: var(--infobox-color); | ||
| Line 22: | Line 21: | ||
font-size: 130%; | font-size: 130%; | ||
font-weight: bold; | font-weight: bold; | ||
padding: | padding: 10px; | ||
border-radius: 0; | border-radius: 0; | ||
} | } | ||
/* Image Area */ | |||
.character-infobox-image { | .character-infobox-image { | ||
text-align: center; | text-align: center; | ||
padding: | padding: 12px; | ||
background: # | background: #f7f7f7; | ||
} | } | ||
/* Labels */ | |||
.character-infobox th { | .character-infobox th { | ||
width: 35%; | width: 35%; | ||
text-align: left; | text-align: left; | ||
vertical-align: top; | |||
padding: 7px; | |||
background: #eeeeee; | background: #eeeeee; | ||
border-top: 1px solid #d5d5d5; | |||
border-top: 1px solid # | |||
font-weight: bold; | font-weight: bold; | ||
} | } | ||
/* Values */ | |||
.character-infobox td { | .character-infobox td { | ||
padding: | padding: 7px; | ||
border-top: 1px solid # | border-top: 1px solid #d5d5d5; | ||
background: #ffffff; | |||
} | } | ||
/* Remove first row borders */ | |||
.character-infobox tr:first-of-type th, | .character-infobox tr:first-of-type th, | ||
.character-infobox tr:first-of-type td { | .character-infobox tr:first-of-type td { | ||
| Line 51: | Line 60: | ||
} | } | ||
/* Hover effect */ | |||
.character-infobox tr:hover th, | .character-infobox tr:hover th, | ||
.character-infobox tr:hover td { | .character-infobox tr:hover td { | ||
background: rgba(0,0,0,0. | background: rgba(0,0,0,0.04); | ||
} | |||
/* Bottom rounded corners */ | |||
.character-infobox tr:last-child th { | |||
border-radius: 0 0 0 8px; | |||
} | |||
.character-infobox tr:last-child td { | |||
border-radius: 0 0 8px 0; | |||
} | |||
/* Image rounding */ | |||
.character-infobox-image img { | |||
max-width: 100%; | |||
height: auto; | |||
} | |||
/* Links inside infobox */ | |||
.character-infobox a { | |||
color: inherit; | |||
} | } | ||
/* Mobile support */ | /* Mobile support */ | ||
@media (max-width: 700px) { | @media screen and (max-width: 700px) { | ||
.character-infobox { | .character-infobox { | ||
float: none; | float: none; | ||
| Line 63: | Line 99: | ||
margin: 1em 0; | margin: 1em 0; | ||
} | } | ||
} | } | ||
Revision as of 18:39, 16 July 2026
.character-infobox {
float: right;
width: 300px;
margin: 0 0 1em 1em;
border-collapse: separate;
border-spacing: 0;
border: 2px solid var(--infobox-color);
border-radius: 0 0 10px 10px;
overflow: hidden;
background: #ffffff;
box-shadow: 0 3px 8px rgba(0,0,0,0.18);
font-size: 90%;
}
/* Title/Header */
.character-infobox-title {
background: var(--infobox-color);
color: var(--infobox-text);
text-align: center;
font-size: 130%;
font-weight: bold;
padding: 10px;
border-radius: 0;
}
/* Image Area */
.character-infobox-image {
text-align: center;
padding: 12px;
background: #f7f7f7;
}
/* Labels */
.character-infobox th {
width: 35%;
text-align: left;
vertical-align: top;
padding: 7px;
background: #eeeeee;
border-top: 1px solid #d5d5d5;
font-weight: bold;
}
/* Values */
.character-infobox td {
padding: 7px;
border-top: 1px solid #d5d5d5;
background: #ffffff;
}
/* Remove first row borders */
.character-infobox tr:first-of-type th,
.character-infobox tr:first-of-type td {
border-top: none;
}
/* Hover effect */
.character-infobox tr:hover th,
.character-infobox tr:hover td {
background: rgba(0,0,0,0.04);
}
/* Bottom rounded corners */
.character-infobox tr:last-child th {
border-radius: 0 0 0 8px;
}
.character-infobox tr:last-child td {
border-radius: 0 0 8px 0;
}
/* Image rounding */
.character-infobox-image img {
max-width: 100%;
height: auto;
}
/* Links inside infobox */
.character-infobox a {
color: inherit;
}
/* Mobile support */
@media screen and (max-width: 700px) {
.character-infobox {
float: none;
width: 100%;
margin: 1em 0;
}
}