MediaWiki:Common.css: Difference between revisions

From Center for Cognitive Neuroscience
Jump to navigation Jump to search
No edit summary
No edit summary
Line 4: Line 4:


#toc {
#toc {
   float: right; /* You can use float: left; to float it to the left */
   position: fixed; /* This makes the TOC stay in place as the user scrolls */
   width: 300px; /* Adjust width as needed, e.g., 25% or a fixed pixel value */
  right: 10px; /* Adjust distance from the right edge as needed */
   margin: 0 0 1em 1em; /* Example margin: top right bottom left (for float:right). Adjust as needed. */
  top: 7em; /* Adjust distance from the top; this might need tweaking based on your header's height */
   width: 250px; /* Or your preferred width */
   background-color: #f9f9f9; /* A light background color */
  border: 1px solid #aaa; /* A light border */
   padding: 1em;
   padding: 1em;
   border: 1px solid #aaa;
   z-index: 100; /* Ensures it stays on top of other page content */
   background-color: #f9f9f9; /* Or your preferred background */
   max-height: 70vh; /* Limits the height to 70% of the viewport height */
   /* Remove position: fixed; and related properties like top, right, z-index if you used them previously for a fixed TOC */
   overflow-y: auto; /* Adds a scrollbar within the TOC if its content is too long */
}
}


/* Optional: If the TOC has many items and you want its internal content to scroll
/* Optional: Adjustments for the TOC title if needed */
  even when the TOC block itself scrolls with the page, you can add: */
#toc #toctitle {
#toc > ul {
   text-align: center; /* Centers the "Contents" title */
   max-height: 400px; /* Adjust as desired, or remove if you want the TOC to expand fully */
   margin-bottom: 0.5em;
   overflow-y: auto; /* Adds a scrollbar if the list of contents is taller than max-height */
}
 
/* Optional: Ensure the list within the TOC doesn't have excessive margins */
#toc ul {
  margin-top: 0;
  padding-left: 1.5em; /* Adjust list indentation if needed */
}
}

Revision as of 16:53, 20 May 2025

/* CSS placed here will be applied to all skins */



#toc {
  position: fixed; /* This makes the TOC stay in place as the user scrolls */
  right: 10px; /* Adjust distance from the right edge as needed */
  top: 7em; /* Adjust distance from the top; this might need tweaking based on your header's height */
  width: 250px; /* Or your preferred width */
  background-color: #f9f9f9; /* A light background color */
  border: 1px solid #aaa; /* A light border */
  padding: 1em;
  z-index: 100; /* Ensures it stays on top of other page content */
  max-height: 70vh; /* Limits the height to 70% of the viewport height */
  overflow-y: auto; /* Adds a scrollbar within the TOC if its content is too long */
}

/* Optional: Adjustments for the TOC title if needed */
#toc #toctitle {
  text-align: center; /* Centers the "Contents" title */
  margin-bottom: 0.5em;
}

/* Optional: Ensure the list within the TOC doesn't have excessive margins */
#toc ul {
  margin-top: 0;
  padding-left: 1.5em; /* Adjust list indentation if needed */
}