MediaWiki:Timeless.css: Difference between revisions
From SoS Ledger
Created page with "→All CSS here will be loaded for users of the Timeless skin: →Adjust width for the main left navigation container: #mw-site-navigation { width: 250px; →Increase this value (e.g., from default 200px): } →Adjust width for the overall navigation wrapper if necessary: →This might be needed if #mw-site-navigation alone isn't enough: #mw-navigation { width: 250px; →Make sure this matches or is slightly larger: } /* Ensure the Discord widget if..." |
(No difference)
|
Revision as of 19:11, 28 July 2025
/* All CSS here will be loaded for users of the Timeless skin */
/* Adjust width for the main left navigation container */
#mw-site-navigation {
width: 250px; /* Increase this value (e.g., from default 200px) */
}
/* Adjust width for the overall navigation wrapper if necessary */
/* This might be needed if #mw-site-navigation alone isn't enough */
#mw-navigation {
width: 250px; /* Make sure this matches or is slightly larger */
}
/* Ensure the Discord widget iframe itself can take up the new space */
#p-discord-widget .mw-portlet-body iframe {
width: 100% !important; /* Make iframe fill its container */
max-width: none !important; /* Prevent it from being constrained */
box-sizing: border-box; /* Include padding/border in width */
}
/* You might also need to adjust the margin of the content area to prevent overlap */
#mw-content-container #mw-content-block {
/* Default margin-left is often around 220px-230px depending on the Timeless version/config */
/* If your sidebar is 250px, add a bit more for padding/gap, e.g., 270px */
margin-left: 270px; /* Adjust this value */
}
/* Also check for specific rules for small screens if the above doesn't work perfectly everywhere */
@media all and ( min-width: 720px ) { /* Example breakpoint */
#mw-site-navigation {
width: 250px; /* Ensure width is applied at larger screen sizes */
}
#mw-content-container #mw-content-block {
margin-left: 270px;
}
}
