MediaWiki
MediaWiki:Foreground.css
From Grouse House Wiki
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.
/* CSS added to this page will only be applied to desktop users. To adjust CSS for mobile users, visit https://grousehouse.wiki/MediaWiki:Minerva.css */
/* Large image grid */
.imagegrid {
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
.gridimage {
padding: 10px;
}
.gridimage img {
height: 150px;
width: auto;
border-radius: 10px;
border: 1px solid black;
}
/* Collapsible headers */
.c-header span:before {
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 100% auto;
content: '';
display: block;
height: 12px;
left: 0;
margin: 0 0.8em;
min-height: 1.1em;
position: absolute;
right: 0;
width: 12px;
}
.c-header.hidden span:before {
background-image: url(http://grousehouse.wiki/images/6/62/Downarrow.png);
}
.c-header.active span:before {
background-image: url(https://grousehouse.wiki/images/3/37/Uparrow.png);
}
.c-header {
margin-left: 1em;
}
.c-header.active {
margin-left: 1em;
}
.c-content {
display: none;
overflow: hidden;
}
/* Search page specifics */
/* Results values (1 - 3, etc) */
.results-info {
margin-bottom: -1em;
}
/* Create this page line */
p.mw-search-createlink {
margin-top: -0.8em;
}
/* Start of search results container */
.mw-search-results-container {
margin-top: 1.2em;
}
/* Search button */
div#mw-search-top-table button {
height: 2.33em;
}
.mw-search-profile-tabs {
margin-top: 1em;
}
/* Wiki Editor */
.wikiEditor-ui-toolbar .tabs span.tab a {
color: #5388a0 !important;
cursor: pointer;
display: block;
height: 32px;
padding-left: 18px;
padding-right: 12px;
}
#msupload-dropzone {
margin: 3px;
padding: 5px;
border: 1px dashed #aaaaaa;
text-align: center;
height: 38px !important;
color: #222222;
}
.wikiEditor-ui-toolbar .booklet > .index > .current {
background-color: #5388a03d !important;
color: #5388a0 !important;
}
/* Footer Links */
span#footer-credits:after {
content: "\A";
white-space: pre;
}
span#footer-about:after {
content: " | ";
}
span#footer-disclaimers:after {
content: " | ";
}
span#footer-mobileview:after {
content: " | ";
}
/* Recent Updates */
#recentupdates {
padding: 1em 1em;
border: none !important;
display: block;
margin: 1.5em 0;
position: fixed !important;
}
/* Fixing top margin for logged-in users */
h1#firstHeading {
margin-top: 0.2em !important;
margin-bottom: 1em;
}
a#actions-button {
margin-top: 0 !important;
}
/* Fixing breaking content */
div#uploadtext {
overflow: scroll;
}
div#p-cactions {
text-wrap: wrap;
word-break: break-word;
}
/* Headers and text sizing */
h1#firstHeading {
font-weight: bold;
}
/* IMPORTANT SCALING FOR MAIN CONTENT */
/* Desktop 1920px# through 1281px#*/
@media only screen and (max-width: 120rem) {
/* Width of main content */
div#page-container {
width: 80vw;
}
/* Margin at top of page */
div#main-content {
margin-top: 5em !important;
margin-bottom: 0.7em;
}
}
/* TOC Positioning */
div#toc {
left: 9.4vw;
width: 200px;
top: 5em;
}
/* Recent Updates Basic Formatting */
#recentupdates {
left: 10.376vw;
width: 180px;
top: 3.7em;
}
div#updatestitle {
font-weight: bold;
margin-bottom: 1em;
border-bottom: 1px solid gray;
padding-bottom: 1em;
}
div#updatedate {
font-style: italic;
font-size: 0.9em;
}
div#updatecontent {
border-bottom: 1px solid #bfbbbb;
padding-bottom: 1em;
}
/* Footer Height */
footer.row {
height: 6.5em;
}
/* Search Bar Length */
input#searchInput {
width: 190px;
}
div#mw-content-text {
width: 100%;
}
div#mw-imagepage-section-filehistory {
max-width: 55vw;
width: auto;
overflow: scroll;
}
.mw-rcfilters-ui-changesListWrapperWidget {
position: relative;
max-width: 89vw;
width: auto;
overflow: scroll;
}
}
/* Desktop 1280px# through 994px# (navbar collapse width) */
@media only screen and (max-width: 80rem) {
/* Width of main content */
div#page-container {
width: 80vw;
}
/* Margin at top of page */
div#main-content {
margin-top: 5em !important;
margin-bottom: 0.7em;
}
/* TOC Positioning */
div#toc {
left: 9.1vw;
width: 200px;
top: 5em;
}
/* Search Bar Length */
input#searchInput {
width: 190px;
}
/* Footer Height */
footer.row {
height: 7em;
}
div#mw-content-text {
width: 100%;
}
div#mw-imagepage-section-filehistory {
max-width: 55vw;
width: auto;
overflow: scroll;
}
.mw-rcfilters-ui-changesListWrapperWidget {
position: relative;
max-width: 89vw;
width: auto;
overflow: scroll;
}
}
/* Desktop 1066px# through 993px# (navbar total collapse width) */
@media only screen and (max-width: 66.625rem) {
#recentupdates {
left: 10.6vw;
width: 200px;
top: 3em;
}
h1#firstHeading {
font-size: 1.5rem;
}
}
/* Desktop 993px# through 712px# (navbar total collapse width) */
@media only screen and (max-width: 62.063em) {
#recentupdates {
left: 5.4vw;
width: 200px;
top: 6.5em;
}
h1#firstHeading {
font-size: 1.5rem;
}
}
/* Desktop 712px# through 647px# (navbar total collapse width) */
@media only screen and (max-width: 44.5em) {
#recentupdates {
left: 5.4vw;
width: 200px;
top: 5.5em;
}
h1#firstHeading {
font-size: 1.2rem;
}
}
/* Desktop 647px# through 640px# (navbar total collapse width) */
@media only screen and (max-width: 40.438rem) {
#recentupdates {
left: 5.4vw;
width: 200px;
top: 5.5em;
}
h1#firstHeading {
font-size: 1.1rem;
}
}
/* Desktop 993px# through 641px# (navbar total collapse width) */
@media only screen and (max-width: 62.063rem) {
/* Width of main content */
div#page-container {
width: 90vw;
}
/* Margin at top of page */
div#main-content {
margin-top: 7em !important;
margin-bottom: 0.7em;
}
/* TOC Positioning */
div#toc {
left: 4.5vw;
width: 200px;
top: 8em;
}
/* Search Bar Length */
input#searchInput {
width: 190px;
}
/* Footer Height */
footer.row {
height: 7em;
}
div#mw-content-text {
width: 100%;
}
div#mw-imagepage-section-filehistory {
max-width: 55vw;
width: auto;
overflow: scroll;
}
.mw-rcfilters-ui-changesListWrapperWidget {
position: relative;
max-width: 89vw;
width: auto;
overflow: scroll;
font-size: 0.8em;
}
#filetoc {
max-width: 55vw;
}
}
/* Mobile 640px# and under (navbar total collapse width) */
@media only screen and (max-width: 40rem) {
/* Top navigation bar height */
.top-bar {
height: 3.7rem;
}
/* Hide sidebar */
div#sidebar {
display: none;
}
/* Width of main content */
div#page-container {
width: 100vw;
}
/* Margin at top of page */
div#main-content {
margin-top: 4em !important;
margin-bottom: 0.7em;
}
/* Hide TOC */
div#toc {
display: none
}
/* Search Bar Length */
input#searchInput {
width: 190px;
}
/* Recent Updates Positioning */
#recentupdates {
display: none;
}
/* Footer Height */
footer.row {
height: 9em;
}
/* Top navigation on mobile */
.top-bar-section .has-dropdown {
margin-right: 0px !important;
}
/* Elements that break out on mobile */
.mw-rcfilters-ui-changesListWrapperWidget {
max-width: 89vw;
overflow: scroll;
font-size: 0.8em
}
div#mw-content-text {
width: 100%;
}
@supports (aspect-ratio:16 / 9)
#file img {
max-width: 100%;
height: auto;
}
div#mw-imagepage-section-filehistory {
max-width: 90vw;
width: auto;
overflow: scroll;
}
#filetoc {
max-width: 90vw;
}
}
/* Adjustments for Logged-in Users */
/* Desktop 1280px# through 1067px# (navbar collapse width) */
@media only screen and (max-width: 120rem) {
div#p-cactions:has(> #actions) {
margin-top: -1em;
}
}
@media only screen and (max-width: 66.625rem) {
div#p-cactions:has(> #actions) {
margin-top: 1.5em;
}
}
@media only screen and (max-width: 62.063rem) {
div#p-cactions:has(> #actions) {
margin-top: -0.3em;
}
footer.row:has(> #footer > #footer-left > #footer-left-ul > #footer-credits) {
height: 10em;
}
}
@media only screen and (max-width: 44.5rem) {
div#p-cactions:has(> #actions) {
margin-top: 2.6em;
}
footer.row:has(> #footer > #footer-left > #footer-left-ul > #footer-credits) {
height: 10em;
}
}
@media only screen and (max-width: 40.438rem) {
div#p-cactions:has(> #actions) {
margin-top: 5.3em;
}
footer.row:has(> #footer > #footer-left > #footer-left-ul > #footer-credits) {
height: 10em;
}
}
@media only screen and (max-width: 40rem) {
div#p-cactions:has(> #actions) {
margin-top: -0.4rem;
}
footer.row:has(> #footer > #footer-left > #footer-left-ul > #footer-credits) {
height: 14em;
}
}
/* Remove footer if height is small to fix keyboard bug on mobile */
@media only screen and (max-height: 25rem) {
footer.row {
display: none;
}
}
.fullImageLink img {
max-width: 90vw;
width: 100%;
}
.mw_metadata {
max-width: 400px;
width: auto!important;
}
.mw-rcfilters-ui-filterWrapperWidget {
width: 95%;
}
.mw-search-results-container, .mw-search-results-info {
float: left;
width: 100% !important;
}
/* Page Body Font Sizes */
div#mw-clearyourcache ul li {
font-size: 0.8em;
}
pre.mw-code.mw-css {
font-size: 0.9em;
}
ul, ol, dl {
font-size: 0.9rem;
}
p {
font-size: 0.9rem;
}
.crowdsource-warning {
font-size: 0.9rem;
}
/* Category section */
#catlinks {
border-top: 1px solid lightgray !important;
padding: 0.25rem;
padding-top: 1rem;
margin-top: 1em;
border: none;
}
/* Search padding */
#mw-content-text .mw-search-results {
margin-top: -5px;
}
.mw-search-result-heading {
margin-top: -0.7em;
}
#mw-search-top-table div.oo-ui-actionFieldLayout {
float: left;
width: 55vw;
}
.mw-search-results-container {
margin-top: 1.2em;
}
div#mw-search-top-table button {
height: 2.31em;
}
.mw-search-profile-tabs {
margin-top: 1em;
}
div#main-content {
width: 100%;
}