MediaWiki:Documentation.css: Difference between revisions
Appearance
ReisuDesign (talk | contribs) i f'd up |
Added missing styling for light mode and reorganised |
||
| Line 1: | Line 1: | ||
/*Documentation*/ | /*Documentation*/ | ||
.template-documentation { | .template-documentation { | ||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
.template-documentation .template-documentation-header { | .template-documentation .template-documentation-header, | ||
.template-documentation .template-documentation-footer, | |||
.doctable th.doc-header { | |||
padding: 1em; | |||
background-color: var(--theme-color-2); | |||
border: 1px solid var(--theme-border-color-subtle); | |||
border-radius: 10px; | |||
} | |||
.template-documentation .template-documentation-footer { | |||
font-size: 100%; | |||
text-align: right; | |||
} | } | ||
| Line 21: | Line 26: | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
padding-bottom: 0.5em | padding-bottom: 0.5em; | ||
} | } | ||
| Line 41: | Line 46: | ||
overflow-y: auto; | overflow-y: auto; | ||
padding: 1em; | padding: 1em; | ||
} | } | ||
| Line 66: | Line 62: | ||
} | } | ||
.doctable tr.links td a, .doctable tr.links td .mw-selflink { | .doctable tr.links td a, | ||
.doctable tr.links td .mw-selflink { | |||
padding: 5px; | padding: 5px; | ||
display: block; | display: block; | ||
| Line 83: | Line 80: | ||
} | } | ||
.doctable tr.links td a:hover, .doctable tr.links td .mw-selflink { | .doctable tr.links td a:hover, | ||
.doctable tr.links td .mw-selflink { | |||
background-color: var(--theme-accent-color); | background-color: var(--theme-accent-color); | ||
color: var(--page-text-color); | color: var(--page-text-color); | ||
| Line 89: | Line 87: | ||
} | } | ||
.skin-theme-clientpref-night .doctable tr.links td a:hover, .skin-theme-clientpref-night .doctable tr.links td .mw-selflink { | .skin-theme-clientpref-night .doctable tr.links td a:hover, | ||
.skin-theme-clientpref-night .doctable tr.links td .mw-selflink { | |||
color: var(--page-background-color); | color: var(--page-background-color); | ||
} | } | ||
| Line 105: | Line 99: | ||
color: inherit; | color: inherit; | ||
/* restore link color */ | /* restore link color */ | ||
color: var(-- | color: var(--page-text-color); | ||
/* or your normal link color */ | /* or your normal link color */ | ||
background-color: var(--theme-color-6) !important; | background-color: var(--theme-color-6) !important; | ||
padding: 2px | padding: 2px 8px !important; | ||
border-radius: 10px !important; | border-radius: 10px !important; | ||
transition: ease .15s; | transition: ease .15s; | ||
| Line 114: | Line 108: | ||
a:hover { | a:hover { | ||
text-decoration: none; | |||
background-color: var(--theme-color-8) !important; | background-color: var(--theme-color-8) !important; | ||
transition: ease .15s; | transition: ease .15s; | ||
.skin-theme-clientpref-day & { | |||
background-color: var(--theme-color-4) !important; | |||
} | |||
} | } | ||
Revision as of 13:36, 14 November 2025
/*Documentation*/
.template-documentation {
overflow: hidden;
}
.template-documentation .template-documentation-header,
.template-documentation .template-documentation-footer,
.doctable th.doc-header {
padding: 1em;
background-color: var(--theme-color-2);
border: 1px solid var(--theme-border-color-subtle);
border-radius: 10px;
}
.template-documentation .template-documentation-footer {
font-size: 100%;
text-align: right;
}
.template-documentation .template-documentation-langs {
background-color: #F6F6F6;
background-color: rgba(var(--theme-border-color--rgb, 246,246,246), 0.15);
display: flex;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
padding-bottom: 0.5em;
}
.template-documentation .template-documentation-langs li {
margin: 0 0 0 1em;
padding: 0.5em 0 0;
}
.template-documentation .template-documentation-langs li.selected {
order: -1;
}
.template-documentation .template-documentation-langs li.selected a {
color: black;
font-weight: bold;
}
.template-documentation .template-documentation-content {
overflow-y: auto;
padding: 1em;
}
.doctable {
border: none;
border-spacing: 5px;
}
.doctable th.doc-header {
padding: 15px;
background-color: var(--theme-color-1);
}
.doctable tr.links td {
padding: 0;
}
.doctable tr.links td a,
.doctable tr.links td .mw-selflink {
padding: 5px;
display: block;
font-size: 1rem;
text-align: center;
text-decoration: none;
transition: 0.1s;
border-radius: 10px;
margin-top: 5px
}
.doctable tr.links td a {
background-color: var(--theme-color-1);
color: var(--theme-page-background-color);
font-weight: 700;
}
.doctable tr.links td a:hover,
.doctable tr.links td .mw-selflink {
background-color: var(--theme-accent-color);
color: var(--page-text-color);
transition: 0.1s;
}
.skin-theme-clientpref-night .doctable tr.links td a:hover,
.skin-theme-clientpref-night .doctable tr.links td .mw-selflink {
color: var(--page-background-color);
}
/* Edits appearence of buttons on Header 8 */
.template-documentation-header #doc_editlinks {
color: transparent;
/* hide text including [ and ] */
a {
color: inherit;
/* restore link color */
color: var(--page-text-color);
/* or your normal link color */
background-color: var(--theme-color-6) !important;
padding: 2px 8px !important;
border-radius: 10px !important;
transition: ease .15s;
}
a:hover {
text-decoration: none;
background-color: var(--theme-color-8) !important;
transition: ease .15s;
.skin-theme-clientpref-day & {
background-color: var(--theme-color-4) !important;
}
}
a:not(:last-child) {
margin-right: -5px;
}
a::before,
a::after {
content: '';
/* no [ ] before or after */
}
}