MediaWiki:Vector.css: Difference between revisions

Revision as of 16:56, 18 November 2023

/* 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 */


/* Logo link always brown */
  a.mw-logo, strong.mw-wordmark { 
     color: #B0925C;
  }
  a.mw-logo:hover {
     color: #b95;
  }