Jump to content
Toggle search
Toggle menu
  • 8 articles
  • 75 files
  • 7 users
  • 37.8K edits
Neodyland Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Template:Infobox service/styles.css: Difference between revisions

Template page
More actions

CodexBot (talk | contribs)

2 user groups
580 edits
Add styles for Neodyland service release-status badges
 
Match the service infobox styling to Template:Extension
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
.infobox-service-status {
.infobox.infobox-service {
display: inline-block;
box-sizing: border-box;
padding: 0.15em 0.55em;
width: 280px;
border: 1px solid transparent;
border: 2px solid #a2a9b1;
border-radius: 999px;
border-collapse: collapse;
font-size: 0.875em;
border-spacing: 0;
font-weight: 600;
clear: right;
line-height: 1.4;
float: right;
white-space: nowrap;
margin: 0 0 0.5em 0.5em;
background-color: #fff;
color: #333;
}
}


.infobox-service-status--planned,
.infobox-service caption {
.infobox-service-status--unknown {
padding: 0.2em 0.5em;
border-color: #a2a9b1;
text-align: center;
background: #eaecf0;
}
 
.infobox-service th,
.infobox-service td {
padding: 0.2em 0.5em;
border: 0;
vertical-align: top;
overflow-wrap: anywhere;
}
 
.infobox-service th[scope="row"] {
min-width: 7em;
text-align: left;
}
 
.infobox-service .infobox-service-header {
padding: 0.5em;
background-color: #72777d;
color: #fff;
font-size: 100% !important;
text-align: center;
}
 
.infobox-service .infobox-service-header a {
color: #fff;
}
 
.infobox-service-header__inner {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5em;
}
 
.infobox-service-header__icon {
flex: none;
}
 
.infobox-service-header__icon img {
display: block;
width: auto;
height: auto;
max-width: 40px;
max-height: 40px;
padding: 0 0.2em 0 0.5em;
}
 
.infobox-service-image {
text-align: center;
}
 
.infobox-service-image img {
max-width: 100%;
height: auto;
}
 
.infobox-service-header__copy,
.infobox-service-header__name,
.infobox-service-header__status {
display: block;
}
 
.infobox-service-header__name {
font-size: 130%;
line-height: 1;
}
 
.infobox-service-header__status {
margin-top: 0.25em;
line-height: 1.2;
}
 
.infobox-service-tagline {
padding: 0.35em 0.5em;
text-align: center;
font-style: italic;
font-weight: normal;
}
 
.infobox-service-status-stable {
border-color: #00af89;
}
 
.infobox-service-status-stable .infobox-service-header {
background-color: #068468;
}
 
.infobox-service-status-beta {
border-color: #fc3;
}
 
.infobox-service-status-beta .infobox-service-header {
background-color: #fc3;
color: #202122;
}
 
.infobox-service-status-beta .infobox-service-header a {
color: #202122;
color: #202122;
}
}


.infobox-service-status--experimental {
.infobox-service-status-experimental {
border-color: #ac6600;
border-color: #ff4500;
background: #fef6e7;
}
color: #6b4e00;
 
.infobox-service-status-experimental .infobox-service-header {
background-color: #c43e00;
}
 
.infobox-service-status-alpha,
.infobox-service-status-unstable {
border-color: #d33;
}
}


.infobox-service-status--alpha,
.infobox-service-status-alpha .infobox-service-header,
.infobox-service-status--unstable {
.infobox-service-status-unstable .infobox-service-header {
border-color: #b32424;
background-color: #b32424;
background: #fde8e8;
color: #8b1e1e;
}
}


.infobox-service-status--beta {
.infobox-service-status-maintenance {
border-color: #36c;
border-color: #36c;
background: #eaf3ff;
color: #164d7a;
}
}


.infobox-service-status--stable {
.infobox-service-status-maintenance .infobox-service-header {
border-color: #14866d;
background-color: #36c;
background: #e6f6ea;
color: #176b2c;
}
}


.infobox-service-status--maintenance {
.infobox-service-status-deprecated,
border-color: #6744b1;
.infobox-service-status-unmaintained {
background: #f1edff;
border-color: #ac6600;
color: #553c9a;
}
}


.infobox-service-status--deprecated {
.infobox-service-status-deprecated .infobox-service-header,
border-color: #ac6600;
.infobox-service-status-unmaintained .infobox-service-header {
background: #fff1d6;
background-color: #8a5200;
color: #7a4d00;
}
}


.infobox-service-status--unmaintained,
.infobox-service-status-planned,
.infobox-service-status--discontinued {
.infobox-service-status-discontinued,
.infobox-service-status-unknown {
border-color: #72777d;
border-color: #72777d;
background: #eaecf0;
}
color: #54595d;
 
.infobox-service-status-planned .infobox-service-header,
.infobox-service-status-discontinued .infobox-service-header,
.infobox-service-status-unknown .infobox-service-header {
background-color: #54595d;
}
 
@media screen {
html.skin-theme-clientpref-night .infobox-service {
background-color: inherit;
color: inherit;
}
}
 
@media screen and (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .infobox-service {
background-color: inherit;
color: inherit;
}
}
 
@media (max-width: 719px) {
body.mediawiki .infobox.infobox-service {
float: none;
clear: both;
width: 100% !important;
margin: 0 0 0.5em;
}
}
}
Retrieved from "https://wiki.neody.land/wiki/Template:Infobox_service/styles.css"
Cookies help us deliver our services. By using our services, you agree to our use of cookies.
More information