MediaWiki:Common.css

From Foxwells Wiki
Revision as of 11:10, 8 July 2025 by Utsuho (talk | contribs) (theme)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* 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;
    }
}