MediaWiki:Timeless.css

From A3! Wiki
Revision as of 10:42, 10 November 2024 by Nikathelostone (talk | contribs)

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)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* General */
body {
	line-height: 1.6;
	background: #fff;
}
table {
	border-collapse: separate;
	border-spacing: 2px
}
#mw-body h2 { overflow-y: hidden; }
#mw-body div.floatright, table.floatright { margin: 0 0 .5em .5em; }
#mw-body div.floatleft,table.floatleft { margin: 0 .5em .5em 0; }

#p-logo-text a {
	color: var(--a3-blue);
	font-family: 'Arvo', sans-serif;
	text-transform: uppercase;
	font-weight: 700;
}

/* Navigation */
#mw-site-navigation .mw-portlet h3 {
	text-transform: uppercase;
	font-family: 'Arvo', sans-serif;
	font-weight: 700;
}
#mw-site-navigation .mw-portlet h3::before {
	content: '🌸';
	color: var(--mankai);
}

/* Navbar Colours */

.color-left {
    background: var(--a3-yellow)!important;
}
.color-middle {
    background: var(--a3-pink)!important;
}
.color-right {
    background: var(--a3-blue)!important;
}

/* Heading Fonts */

#mw-content h1, #mw-content h2, #mw-content h3, #mw-content h4, #mw-content h5, #mw-content h6, #mw-content dt {
    font-family: 'Arvo', sans-serif;
}

#mw-content .list h5 {
    margin-top: 1em;
}

#mw-content h2.welcomeheader {
    border-bottom: none;
    font-size: 1.8rem;
}

#mw-content h5 span.mw-headline {
    font-weight: bold;
    font-size: 1.25rem;
}

#mw-content h1.firstHeading {
     border-bottom: solid 4px #ff54aa;
}

#mw-footer-container { color: #000; border-top: 4px solid var(--a3-pink); }
#mw-footer-container a { color: var(--mankai); }

#mw-content-container {
    border-bottom: none;
}

/* Sidebar Logo Spacing Fix */

#p-logo {
    margin: 1em auto;
}

/* Image Thumbnail Fix */

#mw-content li.gallerybox div.thumb {
    background: none;
    border: none;
    padding: 0;
    box-shadow: none;
}

#mw-content .flex-container {
    width: 100%;
    max-width: 100%;
}



/* [begin] Responsive Adjustments */
@media screen and (max-width: 1099px) {

#mw-site-navigation .mw-portlet {
display: inline-block; 
vertical-align: top; 
padding-right: 1em; 
}

#mw-content { overflow: visible; }
}

@media screen and (max-width: 1099px) and (min-width: 851px) {

#mw-header-nav-hack, #mw-content-block > #mw-site-navigation, #mw-content-block > #mw-related-navigation {
position: fixed;
}
#mw-content-block > #mw-related-navigation {
right: 0;
}

#mw-content h1.firstHeading {
margin-top: 2em;
}
#mw-site-navigation .sidebar-inner {
max-height: 70vh;
width: 70vw;
overflow-y: scroll;
}
}

#mw-content-container { padding-bottom: 0; }

@media screen and (max-width: 850px) {
#mw-header-container > #mw-header > #user-tools > #p-personal > h2 > span { display: none; }

#mw-site-navigation .sidebar-inner {
max-height: 90%;
width: 100%;
overflow-y: scroll;
}
#mw-site-navigation #p-logo { display: none; }
#p-namespaces li a, #p-pagetools li a { background-image: none; }
}

#mw-footer { padding: 1em 0.5em 0 1em; }

/* Forces TOC to align next to an infobox instead of being forced underneath. */
@media only screen and (max-width: 850px) and (min-width: 541px) {
    .toc {width: inherit;}
}
/* [end] Responsive Adjustments */