MediaWiki:Vector.css

From The Talos Principle Wiki
Revision as of 16:38, 18 November 2023 by Theadamabrams (talk | contribs) (Added ...-legacy so that Vector 2022 looks better.)

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)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* All CSS here will be loaded for users of the Vector skin */



/* Customizing the navigation list in the sidebar */
  #p-navigation .vector-menu-content-list {
    list-style: none;
    padding: 0;
    margin-left: -8px;
    margin-right: -6px;
  }
  
  #p-navigation .vector-menu-content-list .mw-list-item {
    margin-bottom: 1px; /* Adjust the spacing between buttons as needed */
  }
  
  #p-navigation .vector-menu-content-list a {
    display: block; /* Set to block for full width */
    padding: 8px 6px; /* Adjust the padding as needed */
    text-decoration: none;
    font-size: 110%;
    background-color: #dc9; /* Set your desired background color */
    color: #000; /* Set your desired text color */
    border: 1px solid #b95; /* Set your desired border color */
    border-radius: 4px; /* Adjust the border radius as needed */
    transition: background-color 0.3s ease;
  }
  
  #p-navigation .vector-menu-content-list a:hover {
    background-color: #b95; /* Set your desired background color on hover */
    border-color: #dc9; /* Set your desired border color on hover */
    color: #fff; /* Set your desired text color on hover */
  }

  /* Tools links */
  #p-tb a {
    color: #874; /* Set your desired text color */
  }
  #p-tb a:hover {
    text-decoration: underline; /* Optional: Add underline on hover */
    color: #b95; /* Set your desired text color on hover */
  }
/* End navbar customization */

/* Customizing border around pages */
  .vector-legacy-menu-tabs-legacy, .vector-menu-tabs-legacy a, #mw-head .vector-menu-dropdown-legacy .vector-menu-heading-legacy {
    background-image: linear-gradient(to bottom, rgba(176, 144, 80, 0) 0, #b95 100%);
  }
  .vector-legacy-menu-tabs-legacy li {
    background-image: linear-gradient(to top, #CFAF6C 0, #EEEBE1 1px, #ffffff 100%);
  }
  .mw-body { 
    border-color: #b95;
  }
/* End border customization */