MediaWiki:Vector.css

Note: After saving, 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)
• Microsoft Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.

/* CSS placed here will affect users of the Vector skin */

/* Fix the sidebar in place when scrolling, as long as we are not on a small screen (e.g. a phone) */
@media (min-device-width:481px)
{
  div#mw-panel
  {
    position:fixed;
    height:100%;
    /* Prevent content overlay when sidewards scrolling */
    background-color:#F6F6F6;
  }

  body::before
  {
    content: "hopefully this is a desktop";
    font-weight: bold;
    display: block;
    text-align: center;
    background: rgba(255, 255, 0, 0.9); /* Semi-transparent yellow */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
  }
}

/* For small screens, fix the sidebar this way to avoid overlap when zooming */
@media (max-device-width:480px)
{
  div#mw-panel
  {
    position:absolute;
  }

  body::before
  {
    content: "hopefully this is a phone";
    font-weight: bold;
    display: block;
    text-align: center;
    background: rgba(255, 255, 0, 0.9); /* Semi-transparent yellow */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
  }
}

/* Darken the background for code tags just a tiny bit
** so code stands out more (default is 249, 249, 249)
*/
code
{
    background-color: rgb(245, 245, 245);
}

/* Raise size of text in diff views to 100% since
** Vector makes them 88% by default
*/
td.diff-addedline,
td.diff-deletedline,
td.diff-context
{
    font-size: 100%;
}