MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
theme |
||
| Line 2: | Line 2: | ||
/* Note template styles - wiki-style info boxes */ | /* Note template styles - wiki-style info boxes */ | ||
.note { | |||
border:1px solid #ccc; | |||
border-left-width:6px; | |||
background:#f9f9f9; | |||
padding:12px 16px; | |||
margin:1em 0; | |||
border-radius:4px; | |||
box-shadow:0 1px 2px rgb(0 0 0 / 0.1); | |||
font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif; | |||
font-size:14px; | |||
line-height:1.4 | |||
} | |||
.note-info { | |||
border-left-color:#5bc0de; | |||
background:#d9edf7; | |||
color:#31708f | |||
} | |||
.note-error { | |||
border-left-color:#d9534f; | |||
background:#f2dede; | |||
color:#a94442 | |||
} | |||
.note-warn { | |||
border-left-color:#f0ad4e; | |||
background:#fcf8e3; | |||
color:#8a6d3b | |||
} | |||
.note-reminder { | |||
border-left-color:#5cb85c; | |||
background:#dff0d8; | |||
color:#3c763d | |||
} | |||
.note-inline { | |||
display:inline-block; | |||
padding:2px 6px; | |||
font-size:90%; | |||
vertical-align:middle; | |||
margin:0 0.3em; | |||
border-radius:3px; | |||
border-left-width:3px; | |||
box-shadow:none | |||
} | |||
.note-inline.note-info { | |||
border-left-color:#5bc0de; | |||
background:#e1f0fa; | |||
color:#31708f | |||
} | |||
.note-inline.note-error { | |||
border-left-color:#d9534f; | |||
background:#f8d7da; | |||
color:#a94442 | |||
} | |||
.note-inline.note-warn { | |||
border-left-color:#f0ad4e; | |||
background:#faf1d6; | |||
color:#8a6d3b | |||
} | |||
.note-inline.note-reminder { | |||
border-left-color:#5cb85c; | |||
background:#d8e9d1; | |||
color:#3c763d | |||
} | |||
/* foxwells tweeeeks */ | |||
:root { | |||
--bg-main: #f2f9fc; | |||
--bg-surface: #ffffff; | |||
--bg-sidebar: #e0f2f9; | |||
--bg-footer: #cde7f2; | |||
--bg-tabs: #c0e3f2; | |||
--border-color: #99cfe5; | |||
--accent: #339dc3; | |||
--accent-hover: #247fa3; | |||
--text-main: #1a1a1a; | |||
--text-muted: #4d4d4d; | |||
} | } | ||
body, html { | |||
margin: 0; | |||
padding: 0; | |||
font-family: "Segoe UI", "Helvetica Neue", sans-serif; | |||
background: var(--bg-main); | |||
color: var(--text-main); | |||
line-height: 1.6; | |||
} | } | ||
#mw-panel { | |||
background-color: none; | |||
border-right: none; | |||
padding-top: 1em; | |||
} | |||
#p-logo { | |||
background: none; | |||
margin-bottom: 1em; | |||
} | |||
.vector-menu h3 { | |||
color: var(--accent); | |||
font-weight: bold; | |||
padding: 0.5em 1em; | |||
} | } | ||
. | .vector-menu-portal ul { | ||
list-style: none; | |||
padding-left: 1em; | |||
} | |||
.vector-menu-portal li a { | |||
display: block; | |||
padding: 0.3em 0.5em; | |||
color: var(--accent); | |||
border-radius: 4px; | |||
} | |||
.vector-menu-portal li a:hover { | |||
background: var(--bg-tabs); | |||
color: var(--accent-hover); | |||
} | } | ||
#footer { | |||
padding: 2em; | |||
text-align: center; | |||
font-size: 0.9em; | |||
color: var(--text-muted); | |||
} | } | ||
. | |||
.wikitable, table.infobox { | |||
border: 1px solid var(--border-color); | |||
background: var(--bg-surface); | |||
color: var(--text-main); | |||
margin: 1em 0; | |||
width: 100%; | |||
} | } | ||
#firstHeading { | |||
color: var(--accent); | |||
font-size: 1.8em; | |||
margin-bottom: 0.5em; | |||
} | } | ||
/* headings */ | |||
h1, h2, h3, h4, h5, h6 { | |||
color: var(--accent); | |||
margin-top: 1.5em; | |||
margin-bottom: 0.6em; | |||
} | } | ||
/* lonks */ | |||
a { | |||
color: var(--accent); | |||
text-decoration: none; | |||
} | |||
a:hover { | |||
color: var(--accent-hover); | |||
text-decoration: underline; | |||
} | } | ||
/* mobile tweeks */ | |||
@media screen and (max-width: 768px) { | |||
#mw-panel { | |||
padding: 0.5em; | |||
} | |||
#searchform { | |||
flex-direction: column; | |||
} | |||
#content, .mw-body { | |||
padding: 1em; | |||
} | |||
} | } | ||
Revision as of 11:10, 8 July 2025
/* CSS placed here will be applied to all skins */
/* Note template styles - wiki-style info boxes */
.note {
border:1px solid #ccc;
border-left-width:6px;
background:#f9f9f9;
padding:12px 16px;
margin:1em 0;
border-radius:4px;
box-shadow:0 1px 2px rgb(0 0 0 / 0.1);
font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size:14px;
line-height:1.4
}
.note-info {
border-left-color:#5bc0de;
background:#d9edf7;
color:#31708f
}
.note-error {
border-left-color:#d9534f;
background:#f2dede;
color:#a94442
}
.note-warn {
border-left-color:#f0ad4e;
background:#fcf8e3;
color:#8a6d3b
}
.note-reminder {
border-left-color:#5cb85c;
background:#dff0d8;
color:#3c763d
}
.note-inline {
display:inline-block;
padding:2px 6px;
font-size:90%;
vertical-align:middle;
margin:0 0.3em;
border-radius:3px;
border-left-width:3px;
box-shadow:none
}
.note-inline.note-info {
border-left-color:#5bc0de;
background:#e1f0fa;
color:#31708f
}
.note-inline.note-error {
border-left-color:#d9534f;
background:#f8d7da;
color:#a94442
}
.note-inline.note-warn {
border-left-color:#f0ad4e;
background:#faf1d6;
color:#8a6d3b
}
.note-inline.note-reminder {
border-left-color:#5cb85c;
background:#d8e9d1;
color:#3c763d
}
/* foxwells tweeeeks */
:root {
--bg-main: #f2f9fc;
--bg-surface: #ffffff;
--bg-sidebar: #e0f2f9;
--bg-footer: #cde7f2;
--bg-tabs: #c0e3f2;
--border-color: #99cfe5;
--accent: #339dc3;
--accent-hover: #247fa3;
--text-main: #1a1a1a;
--text-muted: #4d4d4d;
}
body, html {
margin: 0;
padding: 0;
font-family: "Segoe UI", "Helvetica Neue", sans-serif;
background: var(--bg-main);
color: var(--text-main);
line-height: 1.6;
}
#mw-panel {
background-color: none;
border-right: none;
padding-top: 1em;
}
#p-logo {
background: none;
margin-bottom: 1em;
}
.vector-menu h3 {
color: var(--accent);
font-weight: bold;
padding: 0.5em 1em;
}
.vector-menu-portal ul {
list-style: none;
padding-left: 1em;
}
.vector-menu-portal li a {
display: block;
padding: 0.3em 0.5em;
color: var(--accent);
border-radius: 4px;
}
.vector-menu-portal li a:hover {
background: var(--bg-tabs);
color: var(--accent-hover);
}
#footer {
padding: 2em;
text-align: center;
font-size: 0.9em;
color: var(--text-muted);
}
.wikitable, table.infobox {
border: 1px solid var(--border-color);
background: var(--bg-surface);
color: var(--text-main);
margin: 1em 0;
width: 100%;
}
#firstHeading {
color: var(--accent);
font-size: 1.8em;
margin-bottom: 0.5em;
}
/* headings */
h1, h2, h3, h4, h5, h6 {
color: var(--accent);
margin-top: 1.5em;
margin-bottom: 0.6em;
}
/* lonks */
a {
color: var(--accent);
text-decoration: none;
}
a:hover {
color: var(--accent-hover);
text-decoration: underline;
}
/* mobile tweeks */
@media screen and (max-width: 768px) {
#mw-panel {
padding: 0.5em;
}
#searchform {
flex-direction: column;
}
#content, .mw-body {
padding: 1em;
}
}