We do our best to give you all information you need. Use the Search menu to search for the page you are looking for. The most used pages are on the side menu or in the Popular Pages page.

Do you miss important stuff or do you have suggestions? Let us know via Discord or in-game. Thank you for using our Wiki!

Difference between revisions of "MediaWiki:Common.js"

From GrinderScape Wiki
Jump to: navigation, search
 
(40 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
@import url(https://fonts.googleapis.com/css?family=Open+Sans:600,600italic,700);
+
// ***************************** Structure *****************************
−
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:700);
+
−
body {
+
−
    background: url(https://www.grinderscape.org/images/home-bg.jpeg);
+
−
    font-family: Open Sans, sans-serif;
+
−
    line-height: 20px;
+
−
}
+
  
−
a {
+
/* Load fontawesome and bootstrap css dependencies */
−
    color: #272525;
+
mw.loader.load('https://use.fontawesome.com/releases/v5.8.1/css/all.css', 'text/css');
−
    text-decoration: none;
+
mw.loader.load('https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css', 'text/css');
−
}
+
  
−
a.new {
 
−
    color: #b24040;
 
−
}
 
  
−
/* nav ul {
+
// Remove unnecessary elements
−
    list-style-type: none;
+
−
    list-style-image: none;
+
−
    text-align: center;
+
−
    margin: auto;
+
−
}
+
  
−
nav ul li {
+
$("div#p-tb").remove();
−
    margin: 0;
+
$("img").removeAttr("height");
−
    display: inline-flex;
+
−
} */
+
  
−
header {
+
// Wrap the content
−
    min-width: auto;
+
−
}
+
  
−
div#logo {
+
$("div#content, div#mw-navigation").wrapAll("<div id='main-wrapper'><div class='container'></div></div>");
−
    padding: 30px 0;
+
−
    margin: auto;
+
−
    text-align: center;
+
−
}
+
  
−
div#main-wrapper {
+
// Insert the header
−
}
+
  
−
div#mw-navigation {
+
$("<header> <div class='entire-header'> <div class='header-top'> <div class='container dFlx'> <ul class='play-link'> <li><a itemprop='url' href='https://www.facebook.com/Grinderscape.org'><i class='fab fa-facebook-square'></i></a></li><li><a itemprop='url' href='https://www.youtube.com/user/dokenfilm/feed'><i class='fab fa-youtube'></i></a></li><li><a itemprop='url' href='https://discord.gg/b46xx5u'><i class='fab fa-discord'></i></a></li></ul> <div class='logo'> <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo.png' alt='GrinderScape'></a> </div><div class='mobile-logo'> <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo-mobile.png' alt='GrinderScape'></a> </div><ul class='login'> <li id='n-Log-in'><a href='/Special:UserLogin' data-toggle='modal' data-target='#myModal-user'>Wiki Login</a></li></ul> </div></div><div class='header-bottm'> <div class='container'> <div class='mobile-menu'> <span></span> <span></span> <span></span> </div><ul class='main-nav'> <li><a itemprop='url' href='https://www.grinderscape.org'>HOME</a></li><li><a itemprop='url' href='http://forum.grinderscape.org/'>FORUM</a></li><li><a itemprop='url' href='https://www.grinderscape.org/store'>STORE</a></li><li><a itemprop='url' href='https://www.grinderscape.org/download'>DOWNLOAD</a></li><li><a href='javascript:void(0);' data-toggle='modal' data-target='#myModal-vote'>VOTE</a></li><li><a itemprop='url' href='https://www.grinderscape.org/highscores'>HIGHSCORES</a></li><li class='acitve'><a itemprop='url' href='http://wiki.grinderscape.org/'>WIKI</a></li><li><a itemprop='url' href='https://www.grinderscape.org/contact'>CONTACT</a></li></ul> </div></div></div></header>").insertBefore("div#main-wrapper");
−
    display: none;
+
−
}
+
  
−
div#mw-head {
 
−
    position: initial;
 
−
}
 
  
−
div#p-personal {
+
// Organize the elements
−
    position: initial;
+
−
    text-align: right;
+
−
    padding-bottom: 0;
+
−
}
+
  
−
#p-personal ul {
+
// if(window.matchMedia("(max-width: 1024px)").matches){
−
     padding: 0 20px;;
+
//     // The viewport is less than 1024 pixels wide
−
     display: inline-block;
+
//    console.log("This is a mobile device.");
−
}
+
//    $("div#mw-navigation").appendTo(".main-nav");
 +
// } else{
 +
//     // The viewport is at least 1024 pixels wide
 +
//    console.log("This is a tablet or desktop.");
 +
//    $("div#mw-navigation").insertBefore(".login");  
 +
// }
  
−
#p-personal ul li {
+
$("div#content").wrap("<section class='main-content-cstm'></section>");
−
    float: initial;
+
$("div#mw-navigation").insertBefore(".main-content-cstm");
−
    margin: 0;
+
$("div#content").wrap("<div id='content-sidebar-wrap'></div>");
−
    display: inline-block;
+
$("div#mw-panel").insertAfter("div#content");
−
    padding: 0 !important;
+
$("div#content").wrap("<div id='content-wrap'></div>");
−
    background: none;
+
−
}
+
  
−
#p-personal ul li a {
+
$("<div id='navigation'></div>").prependTo("div#content");
−
    /* margin: 0 10px; */
+
$("div#left-navigation").appendTo("div#navigation");
−
    margin: 10px;
+
$("div#right-navigation").appendTo("div#navigation");
−
    padding: 0;
+
−
    display: block;
+
−
}
+
  
−
div#mw-head div.vectorMenu h3 {
+
$("<div id='pageInfo'></div>").insertBefore("div#content");
−
    display: none;
+
$("div#content").wrap("<div id='content-navigation-wrap'></div>");
−
}
+
$("ul#footer-info").insertAfter("div#content");
  
−
div#siteNotice, .welcomeText, pageText {
+
// Insert the footer
−
    padding: 30px 30px 0;
+
−
    text-align:center;
+
−
}
+
  
−
#noticeTitle, #welcome_title {
+
$("<footer> <div class='footer-top dFlx'> <div class='cw-30'> <h5>ABOUT</h5> <p>GrinderScape has been a dedicated server since 2008, with helpful staff and dedicated members. If you need help in how to start, you can see the Wiki. If you wish to get involved with the community as a whole, join our Forums, for the latest threads and game suggestions.</p></div><div class='cw-70 dFlx'> <div class='cw-33'> <h5>GENERAL</h5> <ul> <li><a itemprop='url' href='https://www.grinderscape.org/download'>Play Now</a></li><li><a itemprop='url' href='https://www.grinderscape.org/contact' target='_blank'>Contact Us</a></li><li><a itemprop='url' href='https://www.grinderscape.org/tos' target='_blank'>Terms of Services</a></li><li><a itemprop='url' href='https://www.grinderscape.org/user/manage' target='_blank'>Account Management</a></li><li><a itemprop='url' href='https://www.grinderscape.org/faq' target='_blank'>Frequently Asked Questions</a></li></ul> </div><div class='cw-33'> <h5>GUIDES</h5> <ul> <li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/topic/132-in-game-drops-guide-mystery-boxes/' target='_blank'>NPC Drops Guide</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Skill_guides/Slayer' target='_blank'>Slayer Guide</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/topic/132-in-game-drops-guide-mystery-boxes/' target='_blank'>Drops Guide</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Monster_hunting_guides' target='_blank'>Monster Hunting Guides</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/General_guides/Commands' target='_blank'>In-Game Commands </a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Skill_guides' target='_blank'>Skilling Guides</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/General_guides' target='_blank'>General Guides</a></li></ul> </div><div class='cw-33'> <h5>FORUM THREADS</h5> <ul> <li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/2-news-announcements/' target='_blank'>News &amp; Announcements</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/39-report-in-game-bugs/' target='_blank'>Report In-Game Bugs</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/11-submit-appeal/' target='_blank'>Submit In-Game Appeal</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/59-recover-a-lost-account/' target='_blank'>Recover a Lost Account</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/10-submit-player-report/' target='_blank'>Submit Player Report</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/5-rules/' target='_blank'>In-Game Rules</a></li></ul> </div></div></div><div class='footer-btm dFlx'> <div class='footer-logo'> <a itemprop='url' href='https://www.grinderscape.org'><img src='https://www.grinderscape.org/images/footer-logo-trans.png' alt='GrinderScape'></a> </div><p>GrinderScape is not affiliated with Jagex or Runescape in any way.</p></div></footer>").insertAfter(".main-content-cstm");
−
    margin-bottom: 10px;
+
−
    font-size: 18px;
+
−
    padding: 0 0 10px 30px;
+
−
    color: #592c0d;
+
−
    margin-bottom: 30px;
+
−
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
+
−
    overflow: initial;
+
−
}
+
  
−
div#localNotice {
+
// Mobile Navigation Click Function
−
     margin-bottom: 0;
+
$(".mobile-menu").click(function () {
−
}
+
     $(this).toggleClass('open');
 +
    $(".main-nav").toggleClass("side-open");
 +
});
  
−
div#localNotice>p {
+
// Set up the page footer info
−
    margin: 0;
+
−
}
+
  
−
div#pageInfo {
+
if ($("li#footer-info-credits").length > 0) {
−
     margin: 0 0 30px 0;
+
     $("li#footer-info-credits").html($("li#footer-info-credits").html().replace(/\[/g, "<span style='position: absolute; right: 0;'>").replace(/\]/g, "</span>").replace(/\{/g, "<p id='contentFooter' style='position: relative;'>").replace(/\}/g, "</p>"));
−
     padding: 30px;
+
     $("p#contentFooter").insertBefore("li#footer-info-credits");
 +
    $("li#footer-info-credits").remove();
 
}
 
}
  
−
h1#firstHeading {
+
// Set up the page title and breadcrumb
−
    background: url(https://i.imgur.com/qpqwLFJ.png) no-repeat;
+
−
    padding: 0 0 0 30px;
+
−
    line-height: 20px;
+
−
    margin: 0;
+
−
    border-bottom: none;
+
−
    font-size: 13px;
+
−
    color: #592c0d;
+
−
}
+
  
−
span.subpages {
+
var title = $("h1#firstHeading").html().split('/');
−
    position: relative;
+
$("h1#firstHeading").html(title[title.length - 1]);
−
    border-top: 2px solid #161b20;
+
$("h1#firstHeading").appendTo("div#pageInfo");
−
    padding-top: 10px;
+
−
    margin-top: 10px;
+
−
}
+
  
−
div#content-sidebar-wrap {
+
$("span.subpages").appendTo("div#pageInfo");
−
    display: table;
+
$("span.subpages").html($("span.subpages").children());
−
    width: 100%;
+
$("<span>" + title[title.length - 1] + "</span>").appendTo("span.subpages");
−
}
+
$("<span>&nbsp;&nbsp;/&nbsp;&nbsp;</span>").insertAfter("span.subpages > a");
  
−
div#mw-panel {
+
// Set up the page title
−
    position: initial;
+
−
    width: 220px;
+
−
    display: table-cell;
+
−
    vertical-align: top;
+
−
    box-sizing: border-box;
+
−
    border-left: 1px solid rgba(0,0,0,0.1);
+
−
}
+
  
−
div#p-logo {
+
document.title = title[title.length - 1] + " - GrinderScape Wiki";
−
    display: none;
+
−
}
+
  
−
div#p-search {
+
// Hide mw-panel on HP
−
    margin: 0 auto;
+
if (window.location.href == 'https://wiki.grinderscape.org/Main_page/New' || window.location.href == 'https://wiki.grinderscape.org/Main_page') {
−
    float: initial;
+
     $('#mw-panel').remove();
−
     padding: 30px;
+
−
    width:45%;
+
 
}
 
}
  
−
div#p-search div#searchTitle {
+
// Remove href from selected tabs
−
    background: url(https://i.imgur.com/X1fC0qz.png) no-repeat;
+
−
}
+
  
−
span.subpages:before {
+
$.each($("div.vectorTabs li.selected"), function () {
−
     content: "";
+
     $(this).find("a").removeAttr("href");
−
    position: absolute;
+
});
−
    height: 2px;
+
−
    width: 20px;
+
−
    background-color: #afafaf;
+
−
    top: -2px;
+
−
    left: 0;
+
−
}
+
  
−
form#searchform {
+
// Remove title from links
−
    padding: 0;
+
−
    margin: 0;
+
−
}
+
  
−
div#simpleSearch {
+
$("a").removeAttr("title");
−
    margin: 0;
+
−
    padding: 0;
+
−
    width: 100%;
+
−
    height: initial;
+
−
    border: 0;
+
−
    background: none;
+
−
}
+
  
−
div#simpleSearch #searchInput,
+
// Set up the search box
−
input#database_input {
+
−
    padding: 10px;
+
−
    line-height: 20px;
+
−
    font-family: Open Sans, sans-serif;
+
−
    background-color: transparent;
+
−
    border: 1px solid #161b20;
+
−
    outline: none;
+
−
}
+
  
−
div#simpleSearch #searchButton, div#simpleSearch #mw-searchButton {
+
$("div#p-search").insertBefore(".main-content-cstm");
−
    text-indent: initial;
+
$("div#p-search").wrap("<section class='main-top-cstm'></section>")
−
    width: 4.65em;
+
$("input#searchInput").val("Search...").removeAttr("placeholder").attr("onfocus", "if (this.value == 'Search...') {this.value = '';}").attr("onblur", "if (this.value == '') {this.value = 'Search...';}");
−
}
+
  
−
div#mw-panel div.portal {
+
// Set up the announcement
−
    margin: 0;
+
−
    padding: 15px 30px;
+
−
    margin-bottom: 30px;
+
−
    background-image:none;
+
−
}
+
  
−
div#mw-panel div.portal h3 {
+
$("div#siteNotice").insertBefore("div#p-search");
−
    cursor: initial;
+
$("<div id='noticeTitle'>Welcome to the GrinderScape Wiki!</div>").prependTo("div#siteNotice");
−
    display: block !important;
+
−
}
+
  
−
div#mw-panel div.portal h3#p-In_the_wiki-label {
 
−
    background: url(https://i.imgur.com/7DeMxyz.png) no-repeat;
 
−
}
 
  
−
div#mw-panel div.portal h3#p-Popular_pages-label {
+
// Show/Hide Plugin
−
    background: url(https://i.imgur.com/qtaf1a3.png) no-repeat;
+
$('.p_hide').hide(); // Hides any element with p_hide class
−
}
+
$('.p_toggle').on('click', function(){
 +
    var $this = $(this);
 +
    var toggleChild = $this.find('.p_toggle_content');
 +
    var toggleIcon = $this.find('.p_toggle_icon')
  
−
div#mw-panel div.portal h3#p-Categories-label {
+
    console.log(toggleIcon);
−
    background: url(https://i.imgur.com/Lnp5kiv.png) no-repeat;
+
−
}
+
  
−
div#mw-panel div#p-Management {
+
     toggleChild.slideToggle("fast");
−
     display: none;
+
    toggleIcon.toggleClass("fa-plus fa-minus");
−
}
+
  
−
div#mw-panel div.portal h3#p-Management-label {
+
    // if (toggleIcon == '.fa-plus'){
−
     background: url(https://i.imgur.com/vcNXF6N.png) no-repeat;
+
    //    toggleIcon.toggleClass("fa-plus", "fa-minus");
−
}
+
    // } else {
 +
     //     toggleIcon.toggleClass("fa-minus", "fa-plus");
 +
    // }
 +
});
  
−
div#mw-panel div.portal div.body {
 
−
    margin: 0 !important;
 
−
}
 
  
−
div#mw-panel div.portal div.body ul li {
+
// Set up the edit box
−
    line-height: 20px;
+
−
    display: flex;
+
−
    padding: 10px 0;
+
−
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
−
}
+
  
−
div#mw-panel div.portal div.body ul li:last-child {
+
function wrapText(elementID, openTag, closeTag) {
−
     border-bottom: none;
+
    var textArea = $("#" + elementID);
 +
    var len = textArea.val().length;
 +
     var start = textArea[0].selectionStart;
 +
    var end = textArea[0].selectionEnd;
 +
    var selectedText = textArea.val().substring(start, end);
 +
    var replacement = openTag + selectedText + closeTag;
 +
    textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
 
}
 
}
  
−
div#content-wrap {
+
$("input#wpWatchthis").prop("checked", false);
−
    box-sizing: border-box;
+
−
}
+
  
−
div#content-navigation-wrap {
+
$("<div class='customButton' id='CB-Nowiki' style='background: url(https://i.imgur.com/Fx2AsCt.png);' title='Ignore wiki formatting'></div>").appendTo("div#toolbar");
−
     margin-bottom: 30px;
+
$("#CB-Nowiki").click(function () {
−
    overflow: hidden;
+
     wrapText("wpTextbox1", "<nowiki>", "</nowiki>");
−
}
+
});
  
−
div#navigation {
+
$("<div class='customButton' id='CB-Heading2' style='background: url(https://i.imgur.com/8uajyYO.png);' title='Level 2 heading'></div>").prependTo("div#toolbar");
−
    display: flex;
+
$("#CB-Heading2").click(function () {
−
    height: 42px;
+
     wrapText("wpTextbox1", "<h2>", "</h2>");
−
    position: relative;
+
});
−
     margin-bottom: 60px;
+
−
}
+
  
−
div#navigation:before {
+
$("<div class='customButton' id='CB-Heading1' style='background: url(https://i.imgur.com/jKOOZnF.png);' title='Level 1 heading'></div>").prependTo("div#toolbar");
−
    content: "";
+
$("#CB-Heading1").click(function () {
−
    position: absolute;
+
     wrapText("wpTextbox1", "<h1>", "</h1>");
−
     bottom: 0;
+
});
−
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
+
−
    width: 100%;
+
−
}
+
  
−
div#left-navigation {
+
$("<div class='customButton' id='CB-Italic' style='background: url(https://i.imgur.com/zdPfv0X.png);' title='Italic text'></div>").prependTo("div#toolbar");
−
     margin: 0;
+
$("#CB-Italic").click(function () {
−
    position: absolute;
+
     wrapText("wpTextbox1", "<i>", "</i>");
−
}
+
});
  
−
div#right-navigation {
+
$("<div class='customButton' id='CB-Bold' style='background: url(https://i.imgur.com/lyqhAM9.png);' title='Bold text'></div>").prependTo("div#toolbar");
−
    position: absolute;
+
$("#CB-Bold").click(function () {
−
    right: 0;
+
     wrapText("wpTextbox1", "<b>", "</b>");
−
     margin: 0;
+
});
−
}
+
  
−
div.vectorTabs {
+
// Remove auto correct from text boxes
−
    background: none;
+
−
    padding: 0;
+
−
    height: initial;
+
−
}
+
  
−
div.vectorTabs ul {
+
$("textarea#wpTextbox1, input#searchInput, input#database_input").attr("spellcheck", "false");
−
    background: none;
+
−
}
+
  
−
div.vectorTabs ul li {
 
−
    background: none !important;
 
−
    font-size: 0;
 
−
}
 
  
−
div.vectorTabs ul li.selected a {
 
−
    cursor: initial;
 
−
    border-bottom: 2px solid #5C3219;
 
−
}
 
  
−
div.vectorTabs span {
 
−
    background: none;
 
−
}
 
  
−
div.vectorTabs ul li a {
+
// Table Highlight
−
     line-height: 20px;
+
$('.highlight tr').mouseover(function () {
−
    padding: 10px;
+
     $(this).addClass('highlight-hover'); //Add Hover Class to toggle css
−
    font-size: 13px;
+
})
−
     height: initial;
+
$('.highlight tr').mouseout(function () {
−
    border-bottom: 2px solid transparent;
+
     $(this).removeClass('highlight-hover'); //remove the class when not on hover of .highlight tr
−
}
+
})
  
−
div.vectorTabs ul li a:hover {
 
−
    border-bottom: 2px solid rgba(0, 0, 0, 0.2);
 
−
}
 
  
−
h3#p-cactions-label {
 
−
    padding: 0;
 
−
    margin: 0 !important;
 
−
}
 
  
−
h3#p-cactions-label span {
 
−
    display: none;
 
−
}
 
  
−
div.vectorMenu h3 a {
+
// ***************************** Indices *****************************
−
    position: initial;
+
−
    display: block;
+
−
    width: 46px;
+
−
    height: 40px;
+
−
    background: url(https://i.imgur.com/l1cW7qY.png) no-repeat center !important;
+
−
    background-position: initial;
+
−
    outline: none;
+
−
}
+
  
−
div.vectorMenu h3 a:hover {
+
$.each($("div.timestamp"), function () {
−
    background: #transparent !important;
+
     var str = $(this).html();
−
}
+
     var year = str.substr(0, 4);
−
 
+
     var month = str.substr(4, 2);
−
div.vectorMenu div.menu {
+
     if (month == 01) {
−
    top: 40px;
+
        month = " January "
−
    left: initial;
+
     } else if (month == 02) {
−
    right: 0;
+
        month = " February "
−
    border: none;
+
     } else if (month == 03) {
−
    background: #c7b07c;
+
        month = " March "
−
}
+
     } else if (month == 04) {
−
 
+
        month = " April "
−
div.vectorMenu div.menu li {
+
     } else if (month == 05) {
−
    line-height: 20px;
+
        month = " May "
−
}
+
     } else if (month == 06) {
−
 
+
        month = " June "
−
div.vectorMenu li:first-child a {
+
     } else if (month == 07) {
−
    border-top: 1px solid #151A1E;
+
        month = " July "
−
}
+
     } else if (month == 08) {
−
 
+
        month = " August "
−
div.vectorMenu li a {
+
     } else if (month == 09) {
−
    padding: 10px 15px;
+
        month = " September "
−
    font-size: 12px;
+
     } else if (month == 10) {
−
    border-bottom: 1px solid #151A1E;
+
        month = " October "
−
}
+
     } else if (month == 11) {
−
 
+
        month = " November "
−
div.vectorMenu li a:hover {
+
     } else if (month == 12) {
−
    background: rgba(255, 255, 255, 0.1);
+
         month = " December "
−
}
+
−
 
+
−
div#content {
+
−
    margin: 0;
+
−
    padding: 30px;
+
−
    border: none;
+
−
    background: none;
+
−
}
+
−
 
+
−
#contentSub,
+
−
#contentSub2 {
+
−
    margin: 30px 0;
+
−
}
+
−
 
+
−
ul#footer-info {
+
−
    margin: 0 30px;
+
−
    border-top: 2px solid rgba(0, 0, 0, 0.2);
+
−
}
+
−
 
+
−
div#footer {
+
−
    margin: 0;
+
−
    padding: 0;
+
−
    min-width: auto;
+
−
}
+
−
 
+
−
div#customFooter {
+
−
    margin: 0;
+
−
    background: #252525;
+
−
    margin-top: 30px;
+
−
    padding: 30px;
+
−
    text-align: center;
+
−
}
+
−
 
+
−
div#customFooter div a {
+
−
    width: 20px;
+
−
    height: 20px;
+
−
    display: inline-block;
+
−
    margin: 0 5px !important;
+
−
}
+
−
 
+
−
ul#footer-places,
+
−
ul#footer-icons,
+
−
li#ca-unwatch,
+
−
li#ca-watch,
+
−
div#jump-to-nav,
+
−
span#wpSummaryLabel,
+
−
input#wpSummary,
+
−
div.editCheckboxes,
+
−
div#editpage-copywarn {
+
−
    display: none;
+
−
}
+
−
 
+
−
/*div#siteNotice,
+
−
div#pageInfo,
+
−
div#content-navigation-wrap,
+
−
div#p-search,
+
−
div#mw-panel div.portal {
+
−
    background: #bca674 !important;
+
−
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
+
−
} */
+
−
 
+
−
div#searchTitle,
+
−
div#mw-panel div.portal h3 {
+
−
    position: relative;
+
−
    font-size: 13px;
+
−
    padding: 0 0 10px 30px;
+
−
    color: #592c0d;
+
−
    margin-bottom: 30px;
+
−
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
+
−
    overflow: initial;
+
−
}
+
−
 
+
−
body,
+
−
.mw-body p,
+
−
p,
+
−
a:hover,
+
−
div#mw-panel div.portal div.body ul li a,
+
−
span.subpages a,
+
−
div#simpleSearch #searchInput,
+
−
div.vectorTabs ul li a,
+
−
table,
+
−
.mw-body-content,
+
−
.mw-body pre,
+
−
textarea#wpTextbox1,
+
−
#contentSub,
+
−
#contentSub2,
+
−
input#database_input,
+
−
div#mw-panel div.portal div.body ul li a:visited,
+
−
a:visited,
+
−
.mw-body a.external,
+
−
.mw-body a.external:visited {
+
−
     color: #272525;
+
−
}
+
−
 
+
−
a:hover, a:focus, .mw-body a.external:hover {
+
−
    text-decoration: none;
+
−
    color: #5c3219;
+
−
}
+
−
div.portal h3:before,
+
−
div#searchTitle:before {
+
−
    content: "";
+
−
    position: absolute;
+
−
    height: 2px;
+
−
    width: 20px;
+
−
    background-color: #5c3219;
+
−
    bottom: -2px;
+
−
    left: 0;
+
−
}
+
−
 
+
−
div.editButtons input[type="submit"],
+
−
div#simpleSearch #searchButton,
+
−
div.editButtons span a,
+
−
div#customFooter div a,
+
−
button#database_button {
+
−
    color: #afafaf;
+
−
    border: 1px solid #5c3219;
+
−
    background-color: #5c3219;
+
−
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.15));
+
−
    padding: 10px;
+
−
    margin: 0;
+
−
    font-family: Open Sans, sans-serif;
+
−
    font-size: 12px;
+
−
    line-height: 20px;
+
−
    cursor: pointer;
+
−
    outline: none;
+
−
}
+
−
 
+
−
div.editButtons span a:hover, div.editButtons input[type="submit"]:hover {
+
−
    background-color: #bca674;
+
−
    color: #593018;
+
−
}
+
−
 
+
−
a#mw-editform-cancel:hover {
+
−
    background-color: #bca674;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
/* New Site Design */
+
−
 
+
−
/* Base Classes */
+
−
 
+
−
div,
+
−
table,
+
−
tr,
+
−
th,
+
−
td,
+
−
figure,
+
−
th,
+
−
video,
+
−
audio,
+
−
h1,
+
−
h2,
+
−
h3,
+
−
h4,
+
−
h5,
+
−
h6,
+
−
aside,
+
−
canvas,
+
−
section,
+
−
header,
+
−
footer,
+
−
nav,
+
−
span,
+
−
p,
+
−
small,
+
−
big,
+
−
a,
+
−
b,
+
−
strong,
+
−
img,
+
−
hr,
+
−
pre,
+
−
button,
+
−
input,
+
−
textarea,
+
−
optgroup,
+
−
ul,
+
−
li,
+
−
ol,
+
−
select,
+
−
option,
+
−
blockquote,
+
−
nav {
+
−
    margin: 0;
+
−
    padding: 0;
+
−
    outline: none;
+
−
    border: none;
+
−
    text-decoration: none;
+
−
    list-style-type: none
+
−
}
+
−
 
+
−
ul {
+
−
    margin-bottom: 0
+
−
}
+
−
 
+
−
.dFlx {
+
−
    display: -webkit-box;
+
−
    display: -moz-box;
+
−
    display: -ms-flexbox;
+
−
    display: -webkit-flex;
+
−
    display: flex
+
−
}
+
−
 
+
−
.u_w_100 {
+
−
    width:100%;
+
−
}
+
−
 
+
−
/* Header */
+
−
 
+
−
.container {
+
−
    max-width: 1600px;
+
−
    margin: auto
+
−
}
+
−
 
+
−
header {
+
−
    position: relative;
+
−
    width: 100%
+
−
}
+
−
 
+
−
.header-top {
+
−
    padding: 14px 0;
+
−
    box-sizing: border-box;
+
−
    position: relative;
+
−
    width: 100%;
+
−
    background: #110901
+
−
}
+
−
 
+
−
.header-top .container {
+
−
    justify-content: space-between
+
−
}
+
−
 
+
−
.header-top .logo {
+
−
    position: absolute;
+
−
    top: 0;
+
−
    right: 0;
+
−
    left: 0;
+
−
    margin: auto;
+
−
    max-width: 380px;
+
−
    width: 380px;
+
−
    z-index: 99
+
−
}
+
−
 
+
−
.header-top .login {
+
−
    display: -webkit-box;
+
−
    display: -moz-box;
+
−
    display: -webkit-flex;
+
−
    display: -ms-flexbox;
+
−
    display: flex
+
−
}
+
−
 
+
−
.header-top .login li {
+
−
    margin-right: 10px;
+
−
    display:inline-flex;
+
−
}
+
−
 
+
−
.header-top .login li:last-child {
+
−
    margin-right: 0
+
−
}
+
−
 
+
−
.header-top .login li:last-child a:hover {
+
−
    text-decoration: underline
+
−
}
+
−
 
+
−
.play-link {
+
−
    display: -webkit-box;
+
−
    display: -moz-box;
+
−
    display: -webkit-flex;
+
−
    display: -ms-flexbox;
+
−
    display: flex
+
−
}
+
−
 
+
−
.play-link li {
+
−
    margin-right: 15px;
+
−
    display: inline-flex;
+
−
}
+
−
 
+
−
.play-link li a {
+
−
    color: #fff;
+
−
    text-shadow: 0 3px 15px rgba(0, 0, 0, .75);
+
−
     font-size: 22px
+
−
}
+
−
 
+
−
.play-link li a:hover {
+
−
    color: #ff8936;
+
−
    text-shadow: 0 3px 15px rgba(0, 0, 0, .75)
+
−
}
+
−
 
+
−
.login a {
+
−
    color: #90b41a;
+
−
     text-transform: uppercase;
+
−
    font-size: 15px;
+
−
    padding: 2px;
+
−
}
+
−
 
+
−
.header-bottm {
+
−
    padding: 30px 0;
+
−
    box-sizing: border-box;
+
−
    width: 100%;
+
−
    background: #060402;
+
−
    background: linear-gradient(90deg, rgba(6, 4, 2, 0.6026785714285714) 0%, rgba(38, 26, 6, 0.45) 10%, rgba(38, 26, 6, 0.45) 90%, rgba(6, 4, 2, 0.6) 100%)
+
−
}
+
−
 
+
−
.header-bottm .main-nav {
+
−
    display: -webkit-box;
+
−
     display: -moz-box;
+
−
    display: -webkit-flex;
+
−
    display: -ms-flexbox;
+
−
    display: flex;
+
−
    flex-flow: row
+
−
}
+
−
 
+
−
.header-bottm .main-nav li {
+
−
    margin-right: 5.75%;
+
−
    position: relative;
+
−
    display:inline-flex;
+
−
}
+
−
 
+
−
.header-bottm .main-nav li:last-child {
+
−
    margin-right: 0
+
−
}
+
−
 
+
−
.header-bottm .main-nav li:nth-child(4) {
+
−
    margin-right: 32.41%
+
−
}
+
−
 
+
−
.header-bottm ul li a {
+
−
     text-transform: uppercase;
+
−
    color: #fe9826;
+
−
    font-size: 17px;
+
−
    display: block;
+
−
    transition: .2s all ease-in-out;
+
−
    text-shadow: 0 1px 0 rgba(0, 0, 0, .3)
+
−
}
+
−
 
+
−
.header-bottm ul li.acitve a {
+
−
    color: #90b41a;
+
−
    text-shadow: 0 2px 28px #ffaa0a
+
−
}
+
−
 
+
−
.header-bottm ul li a:hover {
+
−
    color: #90b41a;
+
−
    text-shadow: 0 2px 28px #ffaa0a
+
−
}
+
−
 
+
−
.header-bottm ul li::after {
+
−
    position: absolute;
+
−
    content: '';
+
−
    background: url(https://www.grinderscape.org/images/menu-after-icon.png) no-repeat;
+
−
    width: 16px;
+
−
    height: 16px;
+
−
    right: -50px;
+
−
    top: 5px
+
−
}
+
−
 
+
−
.header-bottm .main-nav li:nth-child(4)::after {
+
−
    position: absolute;
+
−
     content: '';
+
−
    background: 0 0;
+
−
    width: 0;
+
−
    height: 0;
+
−
    margin: 0;
+
−
    right: 0
+
−
}
+
−
 
+
−
.header-bottm ul li:last-child::after {
+
−
    position: absolute;
+
−
    content: '';
+
−
    background: 0 0;
+
−
    width: 0;
+
−
    height: 0;
+
−
    margin: 0;
+
−
    right: 0
+
−
}
+
−
 
+
−
.mobile-logo {
+
−
    display: none
+
−
}
+
−
 
+
−
/* Body */
+
−
 
+
−
#main-wrapper {
+
−
    overflow: hidden
+
−
}
+
−
 
+
−
#main-wrapper .container {
+
−
    position: relative;
+
−
    padding: 0 20px;
+
−
    box-sizing: border-box
+
−
}
+
−
 
+
−
#main-wrapper .container::before {
+
−
    position: absolute;
+
−
    content: '';
+
−
    background: url(https://www.grinderscape.org/images/left-sidebar.png);
+
−
    background-repeat: repeat-y;
+
−
    width: 110px;
+
−
    height: 100%;
+
−
    left: -60px;
+
−
    z-index: 99;
+
−
    top: 0;
+
−
    background-size: 100%
+
−
}
+
−
 
+
−
#main-wrapper .container::after {
+
−
    position: absolute;
+
−
     content: '';
+
−
    background: url(https://www.grinderscape.org/images/right-sidebar.png);
+
−
    background-repeat: repeat-y;
+
−
    width: 110px;
+
−
    height: 100%;
+
−
    right: -60px;
+
−
    z-index: 99;
+
−
    top: 0;
+
−
    background-size: 100%
+
−
}
+
−
 
+
−
.main-top-cstm {
+
−
    background: url(https://www.grinderscape.org/images/middle-cover-bg.png) repeat-y;
+
−
    background-size: 100%;
+
−
    background-color: #9f895a;
+
−
    padding: 0 70px;
+
−
}
+
−
 
+
−
.main-content-cstm {
+
−
    box-sizing: border-box;
+
−
     padding: 42px 40px;
+
−
    padding-bottom: 30px;
+
−
    box-sizing: border-box;
+
−
    background: #ab915a;
+
−
    background: linear-gradient(180deg, rgba(171, 145, 90, 0.28335084033613445) 0%, rgba(171, 145, 90, 0) 95%)
+
−
}
+
−
 
+
−
#content-sidebar-wrap {
+
−
    display: -webkit-box;
+
−
    display: -moz-box;
+
−
    display: -webkit-flex;
+
−
    display: -ms-flexbox;
+
−
    display: flex;
+
−
    justify-content: space-between;
+
−
    position: relative;
+
−
    background: url(https://www.grinderscape.org/images/middle-cover-bg.png) repeat-y;
+
−
    background-size: 100%;
+
−
    padding: 65px 35px;
+
−
    padding-bottom: 5px;
+
−
    box-sizing: border-box
+
−
}
+
−
 
+
−
#content-sidebar-wrap::before {
+
−
    content: '';
+
−
     position: absolute;
+
−
    background: url(https://www.grinderscape.org/images/middle-cover-top-bg.png) repeat-x;
+
−
    height: 7px;
+
−
    bottom: -6px;
+
−
    width: 100%;
+
−
    left: 0;
+
−
    top: -4px
+
−
}
+
−
 
+
−
#content-sidebar-wrap::after {
+
−
    content: '';
+
−
    position: absolute;
+
−
    background: url(https://www.grinderscape.org/images/middle-cover-foot-bg.png) repeat-x;
+
−
    height: 7px;
+
−
    width: 100%;
+
−
    left: 0;
+
−
    bottom: -6px
+
−
}
+
−
 
+
−
#content-sidebar-wrap::before {
+
−
    box-sizing: border-box
+
−
}
+
−
 
+
−
/* Footer */
+
−
 
+
−
footer {
+
−
     position: relative;
+
−
    padding: 25px 25px 30px;
+
−
    box-sizing: border-box;
+
−
    background: #282013;
+
−
    background: linear-gradient(180deg, rgba(40, 32, 19, 0.8267506831834296) 0%, rgba(39, 31, 16, 0.6754901789817489) 7%, rgba(36, 27, 9, 1) 25%, rgba(30, 21, 4, 1) 50%, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 1) 100%);
+
−
    background: url(https://grinderscape.org/images/total-futr.png) no-repeat;
+
−
    background-position: 100% 50%;
+
−
    background-size: cover
+
−
}
+
−
 
+
−
footer::after {}
+
−
 
+
−
.footer-top {
+
−
    border-bottom: 1px solid #140e01;
+
−
    position: relative;
+
−
    z-index: 9;
+
−
    justify-content: space-between;
+
−
    padding-bottom: 40px;
+
−
    padding-top: 30px;
+
−
    max-width: 82%;
+
−
    margin: auto
+
−
}
+
−
 
+
−
.footer-top .cw-30 {
+
−
    width: 29%
+
−
}
+
−
 
+
−
.footer-top .cw-70 {
+
−
    width: 65%
+
−
}
+
−
 
+
−
.footer-top .cw-70 .cw-33 {
+
−
    width: 31%;
+
−
    margin-right: 4%
+
−
}
+
−
 
+
−
.footer-top .cw-70 .cw-33:last-child {
+
−
    margin-right: 0
+
−
}
+
−
 
+
−
.footer-top li {
+
−
    display:flex;
+
−
}
+
−
 
+
−
.footer-top li a,
+
−
.footer-top p {
+
−
    color: #f6e6c2;
+
−
    font-family: pt sans caption, sans-serif;
+
−
    font-weight: 400;
+
−
    font-size: 15px;
+
−
}
+
−
 
+
−
.footer-top li a:hover {
+
−
    color: #fe9826
+
−
}
+
−
 
+
−
.footer-top p {
+
−
    line-height: 1.7
+
−
}
+
−
 
+
−
.footer-top li a {
+
−
    line-height: 1.9
+
−
}
+
−
 
+
−
.footer-top h5 {
+
−
    font-family: pt sans caption, sans-serif;
+
−
    font-weight: 700;
+
−
    color: #fff;
+
−
    font-size: 20px;
+
−
    position: relative;
+
−
    margin-bottom: 26px
+
−
}
+
−
 
+
−
.footer-top h5::before {
+
−
    content: '';
+
−
    position: absolute;
+
−
    height: 3px;
+
−
    background: #fff;
+
−
    width: 30px;
+
−
    top: -14px
+
−
}
+
−
 
+
−
.footer-btm {
+
−
    width: 100%;
+
−
    box-sizing: border-box;
+
−
    flex-flow: column;
+
−
    justify-content: center;
+
−
    position: relative;
+
−
    z-index: 9;
+
−
    padding: 50px 0 0
+
−
}
+
−
 
+
−
.footer-btm .footer-logo {
+
−
    width: 63px;
+
−
    margin: auto;
+
−
    margin-bottom: 40px
+
−
}
+
−
 
+
−
.footer-btm p {
+
−
    text-align: center;
+
−
    color: #fff
+
−
}
+
−
 
+
−
/* END MAIN */
+
−
 
+
−
 
+
−
 
+
−
/* FONT AWESOME */
+
−
 
+
−
/*!
+
−
* Font Awesome Free 5.14.0 by @fontawesome - https://fontawesome.com
+
−
* License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+
−
*/
+
−
.fa,
+
−
.fab,
+
−
.fad,
+
−
.fal,
+
−
.far,
+
−
.fas {
+
−
    -moz-osx-font-smoothing: grayscale;
+
−
    -webkit-font-smoothing: antialiased;
+
−
    display: inline-block;
+
−
    font-style: normal;
+
−
    font-variant: normal;
+
−
    text-rendering: auto;
+
−
    line-height: 1
+
−
}
+
−
 
+
−
.fa-discord:before {
+
−
    content: "\f392"
+
−
}
+
−
 
+
−
.fa-facebook:before {
+
−
     content: "\f09a"
+
−
}
+
−
 
+
−
.fa-facebook-f:before {
+
−
    content: "\f39e"
+
−
}
+
−
 
+
−
.fa-facebook-messenger:before {
+
−
     content: "\f39f"
+
−
}
+
−
 
+
−
.fa-facebook-square:before {
+
−
    content: "\f082"
+
−
}
+
−
 
+
−
.fa-youtube:before {
+
−
     content: "\f167"
+
−
}
+
−
 
+
−
.fa-youtube-square:before {
+
−
    content: "\f431"
+
−
}
+
−
 
+
−
@font-face {
+
−
    font-family: "Font Awesome 5 Brands";
+
−
    font-style: normal;
+
−
    font-weight: 400;
+
−
    font-display: block;
+
−
    src: url(../resources/fonts/fa-brands-400.eot);
+
−
    src: url(../resources/fonts/fa-brands-400.eot?#iefix) format("embedded-opentype"), url(../resources/fonts/fa-brands-400.woff2) format("woff2"), url(../resources/fonts/fa-brands-400.woff) format("woff")
+
−
}
+
−
 
+
−
.fab {
+
−
    font-family: "Font Awesome 5 Brands"
+
−
}
+
−
 
+
−
@font-face {
+
−
     font-family: "Font Awesome 5 Free";
+
−
    font-style: normal;
+
−
    font-weight: 400;
+
−
    font-display: block;
+
−
    src: url(../resources/fonts/fa-regular-400.eot);
+
−
    src: url(../resources/fonts/fa-regular-400.eot?#iefix) format("embedded-opentype"), url(../resources/fonts/fa-regular-400.woff2) format("woff2"), url(../resources/fonts/fa-regular-400.woff) format("woff")
+
−
}
+
−
 
+
−
.fab,
+
−
.far {
+
−
    font-weight: 400
+
−
}
+
−
 
+
−
@font-face {
+
−
    font-family: "Font Awesome 5 Free";
+
−
    font-style: normal;
+
−
    font-weight: 900;
+
−
    font-display: block;
+
−
    src: url(../resources/fonts/fa-solid-900.eot);
+
−
    src: url(../resources/fonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), url(../resources/fonts/fa-solid-900.woff2) format("woff2"), url(../resources/fonts/fa-solid-900.woff) format("woff")
+
−
}
+
−
 
+
−
.fa,
+
−
.far,
+
−
.fas {
+
−
    font-family: "Font Awesome 5 Free"
+
−
}
+
−
 
+
−
.fa,
+
−
.fas {
+
−
     font-weight: 900
+
−
}
+
−
 
+
−
 
+
−
 
+
−
/* MOBILE */
+
−
@media(max-width:1680px) {
+
−
    body {
+
−
         font-size: 16px
+
 
     }
 
     }
−
 
+
    var day = str.substr(6, 2);
−
     .container {
+
     $(this).html("Last modified on " + day + month + year + ".");
−
         max-width: 1370px
+
    if (str == "") {
 +
         $(this).html("This page is under construction.");
 
     }
 
     }
 +
});
 +
$.each($("div.link > a"), function () {
 +
    var link = $(this).html().split("/");
 +
    $(this).html(link[link.length - 1].replace(/\_/g, " "));
 +
});
  
−
    .header-top .logo, .header-top .logo img {
 
−
        max-width: 330px;
 
−
        width: 330px
 
−
    }
 
  
−
    .header-top {
 
−
        padding: 11px 0 9px
 
−
    }
 
  
−
    .header-bottm {
 
−
        padding: 24px 0
 
−
    }
 
  
−
    .header-bottm ul li a {
 
−
        font-size: 16px
 
−
    }
 
  
−
    .header-bottm .main-nav li {
 
−
        margin-right: 5.44%;
 
−
        position: relative
 
−
    }
 
−
}
 
  
−
@media(max-width:1440px) {
 
−
    body {
 
−
        font-size: 14px
 
−
    }
 
  
−
    .container {
 
−
        max-width: 1200px
 
−
    }
 
  
−
    .header-bottm ul li::after {
 
−
        right: -35px;
 
−
    }
 
  
−
    .header-top .logo, .header-top .logo img {
+
// ***************************** Databases *****************************
−
        max-width: 310px;
+
−
        width: 310px
+
−
    }
+
  
−
     .header-top {
+
function commaSeparateNumber(val) {
−
         padding: 9px 0;  
+
     while (/(\d+)(\d{3})/.test(val.toString())) {
−
     }
+
         val = val.toString().replace(/(\d+)(\d{3})/, '$1' + '.' + '$2');
 +
     };
 +
    return val;
 +
};
  
−
    .header-bottm .main-nav li {
+
$("button#database_button").click(function () {
−
        margin-right: 4.9%
+
    searchDatabase();
−
    }
+
});
  
−
    .header-bottm ul li a {
 
−
        font-size: 15px
 
−
    }
 
  
−
    .header-bottm {
 
−
        padding: 20px 0
 
−
    }
 
−
}
 
  
−
@media(max-width:1200px) {
 
−
    .container {
 
−
        max-width: 96%
 
−
    }
 
  
−
    .header-top {
 
−
        padding: 7px 0;
 
−
    }
 
  
−
    .header-top .logo, .header-top .logo img {
 
−
        max-width: 285px;
 
−
        width: 285px
 
−
    }
 
  
−
    .header-bottm ul li a {
 
−
        font-size: 14px
 
−
    }
 
  
−
    .login a {
 
−
        font-size: 14px
 
−
    }
 
  
−
    .header-bottm {
+
// ***************************** Close *****************************
−
        padding: 14px 0
+
−
    }
+
  
−
    .header-bottm .main-nav li {
 
−
        margin-right: 4.8%
 
−
    }
 
−
}
 
  
−
@media(max-width:1080px) {
 
−
    .header-bottm .main-nav li {
 
−
        margin-right: 4.5%
 
−
    }
 
−
}
 
  
−
@media(max-width:1024px) {
 
  
−
   
 
−
    .mobile-menu {
 
−
        width: 40px;
 
−
        height: 38px;
 
−
        position: relative;
 
−
        float: right;
 
−
        -webkit-transform: rotate(0deg);
 
−
        -moz-transform: rotate(0deg);
 
−
        -o-transform: rotate(0deg);
 
−
        transform: rotate(0deg);
 
−
        -webkit-transition: .5s ease-in-out;
 
−
        -moz-transition: .5s ease-in-out;
 
−
        -o-transition: .5s ease-in-out;
 
−
        transition: .5s ease-in-out;
 
−
        cursor: pointer;
 
−
        overflow: hidden
 
−
    }
 
  
−
    .mobile-menu span {
 
−
        display: block;
 
−
        position: absolute;
 
−
        height: 5px;
 
−
        width: 100%;
 
−
        background: #fff;
 
−
        border-radius: 9px;
 
−
        opacity: 1;
 
−
        left: 0;
 
−
        -webkit-transform: rotate(0deg);
 
−
        -moz-transform: rotate(0deg);
 
−
        -o-transform: rotate(0deg);
 
−
        transform: rotate(0deg);
 
−
        -webkit-transition: .25s ease-in-out;
 
−
        -moz-transition: .25s ease-in-out;
 
−
        -o-transition: .25s ease-in-out;
 
−
        transition: .25s ease-in-out
 
−
    }
 
  
−
    .mobile-menu span:nth-child(1) {
 
−
        top: 0
 
−
    }
 
  
−
    .mobile-menu span:nth-child(2) {
 
−
        top: 11px
 
−
    }
 
  
−
    .mobile-menu span:nth-child(3) {
 
−
        top: 22px
 
−
    }
 
  
−
    .mobile-menu.open span:nth-child(1) {
 
−
        top: 18px;
 
−
        -webkit-transform: rotate(135deg);
 
−
        -moz-transform: rotate(135deg);
 
−
        -o-transform: rotate(135deg);
 
−
        transform: rotate(135deg)
 
−
    }
 
  
−
    .mobile-menu.open span:nth-child(2) {
+
// Remove the loader
−
        opacity: 0;
+
−
        left: -60px
+
−
    }
+
−
 
+
−
    .mobile-menu.open span:nth-child(3) {
+
−
        top: 18px;
+
−
        -webkit-transform: rotate(-135deg);
+
−
        -moz-transform: rotate(-135deg);
+
−
        -o-transform: rotate(-135deg);
+
−
        transform: rotate(-135deg)
+
−
    }
+
−
 
+
−
    ul.main-menu {
+
−
        display: none
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav {
+
−
        flex-flow: column
+
−
    }
+
−
 
+
−
    .header-bottm .container {
+
−
        position: relative
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav {
+
−
        opacity: 0
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav {
+
−
        position: absolute;
+
−
        z-index: 999;
+
−
        width: 100%;
+
−
        top: 42px;
+
−
        left: -100%;
+
−
        -webkit-transition: all .4s ease-in-out;
+
−
        -o-transition: all .4s ease-in-out;
+
−
        transition: all .4s ease-in-out;
+
−
        -moz-transition: all .4s ease-in-out;
+
−
        -ms-transition: all .4s ease-in-out
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav.side-open {
+
−
        left: 0;
+
−
        display: block;
+
−
        opacity: 1;
+
−
        height: 100vh;
+
−
        background: #5a2f02;
+
−
        z-index: 999;
+
−
        margin-top: 1em;
+
−
    }
+
−
 
+
−
    .header-bottm .container .mobile-menu {
+
−
        position: absolute;
+
−
        right: 0
+
−
    }
+
−
 
+
−
    .header-bottm ul li::after {
+
−
        content: '';
+
−
        background: 0 0;
+
−
        width: 0;
+
−
        height: 0;
+
−
        right: 0
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav li {
+
−
        margin-right: 0;
+
−
        display:block;
+
−
    }
+
−
 
+
−
    .header-bottm .main-nav li:nth-child(4) {
+
−
        margin-right: 0
+
−
    }
+
−
 
+
−
    .header-bottm ul li a {
+
−
        padding: 1em;
+
−
        display: block;
+
−
        text-align: center;
+
−
        background-color: #5a2f02;
+
−
        border-bottom: 1px solid #222;
+
−
        font-size: 1.5em;
+
−
    }
+
−
 
+
−
    .header-bottm {
+
−
        padding: 10px 0;
+
−
        min-height: 50px
+
−
    }
+
−
 
+
−
    .middle-bx-middle .img-wrp {
+
−
        padding-bottom: 30px;
+
−
        max-width: 70%;
+
−
        margin: auto
+
−
    }
+
−
 
+
−
    .container {
+
−
        max-width: 96%
+
−
    }
+
−
 
+
−
   
+
−
}
+
−
 
+
−
@media(max-width:768px) {
+
−
    .mobile-menu span {
+
−
        height: 3px
+
−
    }
+
−
 
+
−
    .mobile-menu span:nth-child(2) {
+
−
        top: 10px
+
−
    }
+
−
 
+
−
    .mobile-menu span:nth-child(3) {
+
−
        top: 21px
+
−
    }
+
−
 
+
−
    .mobile-menu.open span:nth-child(1) {
+
−
        top: 16px
+
−
    }
+
−
 
+
−
    .mobile-menu.open span:nth-child(3) {
+
−
        top: 16px
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:680px) {
+
−
    .header-top .logo, .header-top .logo img {
+
−
        max-width: 240px;
+
−
        width: 240px
+
−
    }
+
−
    .header-top {
+
−
        padding: 7px 0 1px
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:480px) {
+
−
    .header-top .logo {
+
−
        display: none
+
−
    }
+
−
 
+
−
    .header-top .mobile-logo, .header-top .mobile-logo img {
+
−
        display: block;
+
−
        position: absolute;
+
−
        top: 0;
+
−
        right: 0;
+
−
        left: 0;
+
−
        margin: auto;
+
−
        z-index: 99;
+
−
        max-width: 180px;
+
−
        width: 180px
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:414px) {
+
−
    .header-top .mobile-logo, .header-top .mobile-logo img {
+
−
        max-width: 160px;
+
−
        width: 160px
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:380px) {
+
−
    .header-top .mobile-logo, .header-top .mobile-logo img {
+
−
        max-width: 152px;
+
−
        width: 152px
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:375px) {
+
−
    .header-top .container {
+
−
        justify-content: space-between;
+
−
        max-width: 98%
+
−
    }
+
−
}
+
−
 
+
−
@media(max-width:320px) {
+
−
    .header-top .mobile-logo, .header-top .mobile-logo img {
+
−
        max-width: 120px;
+
−
        width: 120px
+
−
    }
+
−
}
+
−
/* END MOBILE */
+
−
 
+
−
/* END NEW DESIGN CSS */
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
div#mw-page-base {
+
−
    background: #151515 url(https://www.grinderscape.org/assets/images/background.png);
+
−
    position: fixed;
+
−
    height: 100%;
+
−
    width: 100%;
+
−
    z-index: 9999;
+
−
}
+
−
 
+
−
div#mw-head-base {
+
−
    position: fixed;
+
−
    left: 50%;
+
−
    top: 50%;
+
−
    z-index: 9999;
+
−
    margin: -75px 0 0 -75px;
+
−
    border: 16px solid rgba(0, 0, 0, 0.1);
+
−
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.7), inset 0 0 5px rgba(0, 0, 0, 0.7);
+
−
    border-radius: 50%;
+
−
    border-top: 16px solid #627924;
+
−
    width: 120px;
+
−
    height: 120px;
+
−
    -webkit-animation: spin 2s linear infinite;
+
−
    animation: spin 2s linear infinite;
+
−
}
+
−
 
+
−
@-webkit-keyframes spin {
+
−
    0% {
+
−
        -webkit-transform: rotate(0deg);
+
−
    }
+
−
 
+
−
    100% {
+
−
        -webkit-transform: rotate(360deg);
+
−
    }
+
−
}
+
−
 
+
−
@keyframes spin {
+
−
    0% {
+
−
        transform: rotate(0deg);
+
−
    }
+
−
 
+
−
    100% {
+
−
        transform: rotate(360deg);
+
−
    }
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/* Specific Pages */
+
−
 
+
−
form#editform {
+
−
    border: 1px solid rgba(0, 0, 0, 0.3);
+
−
}
+
−
 
+
−
div#toolbar {
+
−
    padding: 10px 5px;
+
−
    background: #5c3219;
+
−
    border-bottom: 1px solid #161b20;
+
−
    line-height: 0;
+
−
}
+
−
 
+
−
div#toolbar>div {
+
−
    width: 20px;
+
−
    height: 20px;
+
−
    display: inline-block;
+
−
    vertical-align: middle;
+
−
    cursor: pointer;
+
−
    margin: 0 5px;
+
−
}
+
−
 
+
−
div#mw-editbutton-bold,
+
−
div#mw-editbutton-italic,
+
−
div#mw-editbutton-headline,
+
−
div#mw-editbutton-nowiki {
+
−
    display: none !important;
+
−
}
+
−
 
+
−
div#mw-editbutton-link {
+
−
    background: url(https://i.imgur.com/Wrs4VMn.png);
+
−
}
+
−
 
+
−
div#mw-editbutton-extlink {
+
−
    background: url(https://i.imgur.com/HKLvTBX.png);
+
−
}
+
−
 
+
−
div#mw-editbutton-hr {
+
−
    background: url(https://i.imgur.com/J9is2iW.png);
+
−
}
+
−
 
+
−
textarea#wpTextbox1 {
+
−
    resize: vertical;
+
−
    outline: none;
+
−
    background: rgba(0, 0, 0, 0.1);
+
−
    font-family: monospace;
+
−
    line-height: 16px;
+
−
    font-size: 12px;
+
−
    border: none;
+
−
    padding: 10px;
+
−
}
+
−
 
+
−
.editOptions {
+
−
    border: none;
+
−
    padding: 10px 5px;
+
−
    margin: 0;
+
−
    border-top: 1px solid rgba(0, 0, 0, 0.1);
+
−
    background: rgba(0, 0, 0, 0.2);
+
−
}
+
−
 
+
−
.editButtons {
+
−
    display: flex;
+
−
}
+
−
 
+
−
span.cancelLink {
+
−
    margin: 0;
+
−
    display: flex;
+
−
}
+
−
 
+
−
div.editButtons input[type="submit"],
+
−
div.editButtons span a {
+
−
    margin: 0 5px;
+
−
}
+
−
 
+
−
.mw-editTools,
+
−
.templatesUsed,
+
−
.hiddencats,
+
−
.limitreport,
+
−
span.editHelp,
+
−
span.mw-editButtons-pipe-separator {
+
−
    display: none;
+
−
}
+
−
 
+
−
ul#index {
+
−
    margin-left: 0;
+
−
}
+
−
 
+
−
ul#index li {
+
−
    display: flex;
+
−
}
+
−
 
+
−
ul#index li:not(:last-child) {
+
−
    padding-bottom: 10px;
+
−
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
−
    margin-bottom: 10px;
+
−
}
+
−
 
+
−
div.img {
+
−
    width: 40px;
+
−
    height: 40px;
+
−
    margin-right: 10px;
+
−
    display: flex;
+
−
    justify-content: center;
+
−
    align-items: center;
+
−
}
+
−
 
+
−
#index li div.img img {
+
−
    max-height: 40px;
+
−
    max-width: 40px;
+
−
}
+
−
 
+
−
/* New #index */
+
−
 
+
−
 
+
−
 
+
−
#index {
+
−
    margin-left: 0;
+
−
}
+
−
 
+
−
#index .homepage-list {
+
−
    display: flex;
+
−
    padding: 10px;
+
−
}
+
−
 
+
−
#index .homepage-list:not(:last-child) {
+
−
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
−
}
+
−
 
+
−
#index .img img {
+
−
    max-height: 40px;
+
−
    max-width: 40px;
+
−
}
+
−
 
+
−
.homepage-list:hover {
+
−
    background-color: rgba(0,0,0,0.1);
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/* General */
+
−
 
+
−
body,
+
−
div#mw-panel div.portal div.body ul li a,
+
−
div#simpleSearch #searchButton,
+
−
div#simpleSearch #searchInput,
+
−
div#siteNotice,
+
−
.mw-body p,
+
−
table,
+
−
.mw-body-content,
+
−
#contentSub,
+
−
#contentSub2,
+
−
#p-personal ul li,
+
−
nav ul li,
+
−
input#database_input {
+
−
    font-size: 12px;
+
−
    line-height: 20px;
+
−
}
+
−
 
+
−
div#mw-panel div.portal div.body ul li a:hover,
+
−
span.subpages a:hover,
+
−
div.vectorTabs ul li.selected a,
+
−
div.vectorTabs ul li a:hover,
+
−
th,
+
−
span.cancelLink a:hover {
+
−
    color: #593018 !important;
+
−
}
+
−
 
+
−
.mw-body h1,
+
−
.mw-body h2,
+
−
.mw-body h3,
+
−
.mw-body h4,
+
−
.mw-body h5,
+
−
.mw-body h6 {
+
−
    font-family: Open Sans, sans-serif !important;
+
−
    color: #afafaf;
+
−
    line-height: 20px;
+
−
    font-weight: normal !important;
+
−
    margin: 30px 0 !important;
+
−
    font-size: 13px;
+
−
}
+
−
 
+
−
.mw-body img {
+
−
    max-width: 100%;
+
−
}
+
−
 
+
−
.mw-body p,
+
−
p {
+
−
    margin: 30px 0;
+
−
    line-height: 20px;
+
−
}
+
−
 
+
−
.mw-body h1 {
+
−
    border-bottom: 1px solid #161b20;
+
−
    padding-bottom: 10px;
+
−
}
+
−
 
+
−
.mw-body h2 {
+
−
    border-bottom: none;
+
−
}
+
−
 
+
−
span.mw-editsection {
+
−
    display: none;
+
−
}
+
−
 
+
−
table {
+
−
    margin: 30px 0 !important;
+
−
    background: rgba(0, 0, 0, 0.2) !important;
+
−
    border-collapse: collapse;
+
−
}
+
−
 
+
−
td,
+
−
th {
+
−
    padding: 10px !important;
+
−
    border: 1px solid #161b20 !important;
+
−
}
+
−
 
+
−
th {
+
−
    background: #1f272f !important;
+
−
    font-weight: normal;
+
−
    text-align: left !important;
+
−
}
+
−
 
+
−
.mw-body pre {
+
−
    background-color: rgba(0, 0, 0, 0.1);
+
−
    line-height: 16px;
+
−
    border: 1px solid rgba(0, 0, 0, 0.1);
+
−
    padding: 10px;
+
−
    margin: 30px 0;
+
−
}
+
−
 
+
−
hr {
+
−
    background-color: #161b20;
+
−
    margin: 30px 0;
+
−
}
+
−
 
+
−
.mw-body .external {
+
−
    padding: 0;
+
−
    background: none;
+
−
}
+
−
 
+
−
.mw-body ul {
+
−
    margin: 30px 0px 30px 10px;
+
−
    list-style-position: inside;
+
−
    list-style-image: none;
+
−
}
+
−
 
+
−
.mw-body ul li {
+
−
    margin: 0;
+
−
}
+
−
 
+
−
.mw-body ul li ul {
+
−
    margin: 10px 0 10px 30px;
+
−
}
+
−
 
+
−
div#customFooter {
+
−
    background: #5C3219 !important;
+
−
    color: #bca674 !important;
+
−
}
+
−
 
+
−
div#mw-head a {
+
−
    color: #bca674 !important;
+
−
}
+
−
 
+
−
div#customFooter p {
+
−
    color: #bca674 !important;
+
−
}
+
−
 
+
−
div#customFooter a {
+
−
    color: #fff !important;
+
−
}
+
−
 
+
−
fieldset {
+
−
    border: 1px solid rgba(0, 0, 0, 0.2) !important;
+
−
}
+
−
 
+
−
.mw-changeslist-legend {
+
−
    border: 1px solid #97855d !important;
+
−
}
+
−
 
+
−
input[type="submit"],
+
−
input[type="checkbox"],
+
−
select {
+
−
    background: #5c3219;
+
−
    border-color: #5c3219;
+
−
}
+
−
 
+
−
::-webkit-input-placeholder {
+
−
    color: #717171;
+
−
}
+
−
 
+
−
:-moz-placeholder {
+
−
    color: #717171;
+
−
}
+
−
 
+
−
::-moz-placeholder {
+
−
    color: #717171;
+
−
}
+
−
 
+
−
:-ms-input-placeholder {
+
−
    color: #717171;
+
−
}
+
−
 
+
−
 
+
−
/* 28-12-2016 */
+
−
/* nav ul li {
+
−
    display: inline-block !important;
+
−
    padding: 10px 0 !important;
+
−
}
+
−
 
+
−
nav ul li a:hover {
+
−
    color: #fff !important;
+
−
} */
+
−
 
+
−
#mw-watchlist-resetbutton>input {
+
−
    color: #afafaf !important;
+
−
}
+
−
 
+
−
#mw-watchlist-options input {
+
−
    color: #afafaf !important;
+
−
}
+
−
 
+
−
.namespaceselector {
+
−
    color: #afafaf !important;
+
−
}
+
−
 
+
−
.mw-submit {
+
−
    color: #afafaf !important;
+
−
}
+
−
 
+
−
.namespaceselector {
+
−
    margin-left: 5px !important;
+
−
}
+
−
 
+
−
.mw-month-selector {
+
−
    color: #fdfdfd !important;
+
−
}
+
−
 
+
−
#index li {
+
−
    list-style: none !important;
+
−
}
+
−
 
+
−
.sicon1 {
+
−
    background: url(https://i.imgur.com/DeOQfOs.png) no-repeat center, linear-gradient(transparent, rgba(0, 0, 0, 0.15)), #3a589e !important;
+
−
 
+
−
}
+
−
 
+
−
#customFooter>div>a:nth-child(1) {
+
−
    background: url(https://i.imgur.com/DeOQfOs.png) no-repeat center !important;
+
−
    background-color: #3a589e !important;
+
−
    color: #fff !important;
+
−
}
+
−
 
+
−
#customFooter>div>a:nth-child(2) {
+
−
    background: url("https://i.imgur.com/GZzo3yV.png") no-repeat center !important;
+
−
    background-color: #3a89c4 !important;
+
−
    color: #fff !important;
+
−
}
+
−
 
+
−
#customFooter>div>a:nth-child(3) {
+
−
    background: url("https://i.imgur.com/wF3Xf61.png") no-repeat center !important;
+
−
    background-color: #c8312b !important;
+
−
    color: #fff !important;
+
−
}
+
−
 
+
−
.mw-headline {
+
−
    color: #272525 !important;
+
−
}
+
−
 
+
−
#mw-history-search>input {
+
−
    color: #999 !important;
+
−
}
+
−
 
+
−
.historysubmit.mw-history-compareselectedversions-button {
+
−
    color: #fdfdfd !important;
+
−
}
+
−
 
+
−
#toc,
+
−
.toc,
+
−
.mw-warning,
+
−
.toccolours {
+
−
    background: rgba(254, 254, 254, 0.2) none repeat scroll 0 0 !important;
+
−
    border: medium none !important;
+
−
}
+
−
 
+
−
.diff-currentversion-title {
+
−
    color: #222 !important;
+
−
}
+
−
 
+
−
#toctitle>h2 {
+
−
    color: #222;
+
−
}
+
−
 
+
−
td.diff-context {
+
−
    background: rgba(254, 254, 254, 0.3) !important;
+
−
 
+
−
}
+
−
 
+
−
td.diff-addedline .diffchange {
+
−
    background: rgba(237, 237, 237, 0.5) !important;
+
−
}
+
−
 
+
−
#pagehistory li.selected {
+
−
    background-color: rgba(254, 254, 254, 0.5) !important;
+
−
    border: 1px dashed #272525 !important;
+
−
    padding: 5px !important;
+
−
}
+
−
 
+
−
#pagehistory li {
+
−
    border: 1px solid #222 !important;
+
−
    padding: 5px !important;
+
−
}
+
−
 
+
−
.results-info {
+
−
    color: #222 !important;
+
−
}
+
−
 
+
−
.mw-ui-input {
+
−
    background: rgba(254, 254, 254, 0.3) none repeat scroll 0 0 !important;
+
−
    border: medium none !important;
+
−
    padding: 6px !important;
+
−
}
+
−
 
+
−
#mw-searchoptions {
+
−
    background: rgba(254, 254, 254, 0.3) none repeat scroll 0 0 !important;
+
−
}
+
−
 
+
−
#mw-searchoptions h4 {
+
−
    color: #222 !important;
+
−
}
+
−
 
+
−
.ipsDataItem,
+
−
.ipsDataList.ipsDataList_zebra>.ipsDataItem {
+
−
    border: none !important;
+
−
}
+
−
 
+
−
.wikitable th {
+
−
    color: #fff !important;
+
−
}
+
−
 
+
−
.ipsPad_half {
+
−
    text-align: center !important;
+
−
}
+
−
 
+
−
#mw-history-search>input {
+
−
    background: rgba(254, 254, 254, 0.2) none repeat scroll 0 0 !important;
+
−
    color: #272525 !important;
+
−
}
+
−
 
+
−
.mw-search-profile-tabs {
+
−
    background-color: rgba(254, 254, 254, 0.2) !important;
+
−
    border: none !important;
+
−
}
+
−
 
+
−
.highlight-hover {
+
−
    background-color: #b39f71;
+
−
}
+
−
 
+
−
.highlight {
+
−
    font-weight: normal;
+
−
}
+
−
 
+
−
.bgLight {
+
−
    background-color: rgba(247,219,166,.2);
+
−
}
+
−
 
+
−
/*HOMEPAGE*/
+
−
 
+
−
.gs-flex {
+
−
    display:flex;
+
−
    flex-flow:row wrap;
+
−
    margin-bottom: 20px;
+
−
}
+
−
 
+
−
.tile-half:not(:last-child) {
+
−
    margin-right: 9px;
+
−
}
+
−
 
+
−
.tile-half {
+
−
    flex: 1;
+
−
}
+
−
 
+
−
.tile-top {
+
−
    display: flex;
+
−
    align-items: center;
+
−
    background-color: #5C6168;
+
−
    overflow: hidden;
+
−
    padding: 0;
+
−
    height: 13vw;
+
−
    max-height: 12em;
+
−
    transition: 0.4s ease-out;
+
−
}
+
−
 
+
−
.tile-bottom {
+
−
    background-color: rgba(247,219,166,.2);
+
−
    padding: 12px 10px;
+
−
    border-bottom-left-radius: 5px;
+
−
    border-bottom-right-radius: 5px;
+
−
    align-self: end;
+
−
    min-height: 5vw;
+
−
    border: 1px solid #bda062;
+
−
}
+
−
 
+
−
.tile-date {
+
−
    margin: 0 !important;
+
−
    font-size: 0.8em !important;
+
−
    color: #999 !important;
+
−
    line-height: 14px !important;
+
−
 
+
−
}
+
−
 
+
−
.tile-title {
+
−
    margin-bottom: 5px;
+
−
    font-size: 1.4em;
+
−
    color: #272525;
+
−
}
+
−
 
+
−
.tile-info {
+
−
    line-height: 1.4em;
+
−
    color: #272525;
+
−
}
+
−
 
+
−
.click-to-view {
+
−
    font-size: 0.85em;
+
−
    color: #e01818;
+
−
}
+
−
 
+
−
.tile-half:hover>.tile-bottom {
+
−
    background-color: #e8dcbe;
+
−
}
+
−
 
+
−
.mainpage-left {
+
−
    flex: 2;
+
−
    display: flex;
+
−
    flex-flow: column wrap;
+
−
    margin-right: 0.9rem;
+
−
}
+
−
 
+
−
.mainpage-right {
+
−
    flex: 1;
+
−
    display: flex;
+
−
    flex-flow: column wrap;
+
−
}
+
−
 
+
−
.mainpage-social {
+
−
    margin-bottom: 20px;
+
−
}
+
−
 
+
−
.mainpage-social .social-tile {
+
−
    display: flex;
+
−
    align-items: center;
+
−
    background: #7289da;
+
−
    padding: 1em 1.75em;
+
−
}
+
−
 
+
−
.mainpage-social .fa-social-icon {
+
−
    color: #fff;
+
−
    font-size: 40px;
+
−
    margin-right: 15px;
+
−
}
+
−
 
+
−
.mainpage-social .server-name {
+
−
    color: #ffffff;
+
−
    font-weight: bold;
+
−
    font-size: 1.25em;
+
−
    margin: 0.5em 0 -0.15em;
+
−
}
+
−
 
+
−
.mainpage-social .server-tagline {
+
−
    color: rgba(255,255,255,0.9);
+
−
    margin: 0.5em 0;
+
−
}
+
−
 
+
−
.mainpage-social .social-tile-bottom {
+
−
    background: #697ec4;
+
−
    border: none;
+
−
    padding: 1em 1.75em;
+
−
}
+
−
 
+
−
.mainpage-social .social-tile-bottom p {
+
−
    color: #ffffff;
+
−
    font-weight: bold;
+
−
    font-size: 0.9em;
+
−
    text-align: center;
+
−
    text-transform: uppercase;
+
−
    letter-spacing: 0.03em;
+
−
    margin: 0;
+
−
}
+
−
 
+
−
/* Social Specific Styles */
+
−
 
+
−
.mainpage-social .discord-tile {
+
−
    background: #7289da;
+
−
}
+
−
 
+
−
.mainpage-social .discord-tile-bottom {
+
−
    background: #697ec4;
+
−
}
+
−
 
+
−
.mainpage-social .youtube-tile {
+
−
    background: #FF0000;
+
−
}
+
−
 
+
−
.mainpage-social .youtube-tile-bottom {
+
−
    background: #282828;
+
−
}
+
−
 
+
−
.mainpage-social .facebook-tile {
+
−
    background: #4267B2;
+
−
}
+
−
 
+
−
.mainpage-social .facebook-tile-bottom {
+
−
    background: #282828;
+
−
}
+
−
 
+
−
 
+
−
.hp_categories {
+
−
    margin-bottom: 20px;
+
−
    padding: 20px;
+
−
    border-radius: 3px;
+
−
    border: 1px solid #bda062;
+
−
}
+
−
 
+
−
/* 28-12-2016 */
+
−
 
+
−
 
+
−
 
+
−
 
+
−
/* 28-12-2016 responsive layout */
+
−
@media screen and (max-width:991px) {
+
−
    #content-sidebar-wrap>div {
+
−
        width: 100% !important;
+
−
        display: block !important;
+
−
        padding: 0 !important;
+
−
    }
+
−
 
+
−
    div#content-sidebar-wrap {
+
−
        display: block !important;
+
−
    }
+
−
 
+
−
    .main-categories .tile-half {
+
−
        margin-right: 9px;
+
−
        margin-bottom: 20px;
+
−
        flex: 30%;
+
−
    }
+
−
 
+
−
    .main-categories .tile-top {
+
−
        margin: 10% 5% 20%;
+
−
    }
+
−
 
+
−
    .tile-top {
+
−
        height: 20vw;
+
−
        max-height: 20em;
+
−
    }
+
−
}
+
−
 
+
−
@media screen and (max-width:767px) {
+
−
    #content-sidebar-wrap {
+
−
        display: block !important;
+
−
    }
+
−
 
+
−
    div#mw-panel {
+
−
        padding: 0 !important;
+
−
        width: 100% !important;
+
−
        display: block !important;
+
−
    }
+
−
 
+
−
    .mw-contributions-form {
+
−
        overflow: auto;
+
−
        width: 100% !important;
+
−
    }
+
−
 
+
−
    #mw-history-search {
+
−
        line-height: 30px !important;
+
−
    }
+
−
 
+
−
    .ipsDataItem,
+
−
    .ipsDataList.ipsDataList_zebra>.ipsDataItem {
+
−
        border-top: none !important;
+
−
        border-bottom: none !important;
+
−
    }
+
−
}
+
−
 
+
−
@media screen and (max-width:450px) {
+
−
    div#right-navigation {
+
−
        margin-top: 40px;
+
−
        position: static;
+
−
        display: block !important;
+
−
    }
+
−
}
+
  
−
/* 28-12-2016 responsive layout */
+
setTimeout(function () {
 +
    $("div#mw-head-base").fadeOut(500);
 +
    $("div#mw-page-base").fadeOut(500);
 +
}, 600);

Latest revision as of 21:01, 17 September 2021

// ***************************** Structure *****************************

/* Load fontawesome and bootstrap css dependencies */
mw.loader.load('https://use.fontawesome.com/releases/v5.8.1/css/all.css', 'text/css');
mw.loader.load('https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css', 'text/css');


// Remove unnecessary elements

$("div#p-tb").remove();
$("img").removeAttr("height");

// Wrap the content

$("div#content, div#mw-navigation").wrapAll("<div id='main-wrapper'><div class='container'></div></div>");

// Insert the header

$("<header> <div class='entire-header'> <div class='header-top'> <div class='container dFlx'> <ul class='play-link'> <li><a itemprop='url' href='https://www.facebook.com/Grinderscape.org'><i class='fab fa-facebook-square'></i></a></li><li><a itemprop='url' href='https://www.youtube.com/user/dokenfilm/feed'><i class='fab fa-youtube'></i></a></li><li><a itemprop='url' href='https://discord.gg/b46xx5u'><i class='fab fa-discord'></i></a></li></ul> <div class='logo'> <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo.png' alt='GrinderScape'></a> </div><div class='mobile-logo'> <a itemprop='url' href='https://www.grinderscape.org/home'><img src='https://www.grinderscape.org/images/grinderscape-logo-mobile.png' alt='GrinderScape'></a> </div><ul class='login'> <li id='n-Log-in'><a href='/Special:UserLogin' data-toggle='modal' data-target='#myModal-user'>Wiki Login</a></li></ul> </div></div><div class='header-bottm'> <div class='container'> <div class='mobile-menu'> <span></span> <span></span> <span></span> </div><ul class='main-nav'> <li><a itemprop='url' href='https://www.grinderscape.org'>HOME</a></li><li><a itemprop='url' href='http://forum.grinderscape.org/'>FORUM</a></li><li><a itemprop='url' href='https://www.grinderscape.org/store'>STORE</a></li><li><a itemprop='url' href='https://www.grinderscape.org/download'>DOWNLOAD</a></li><li><a href='javascript:void(0);' data-toggle='modal' data-target='#myModal-vote'>VOTE</a></li><li><a itemprop='url' href='https://www.grinderscape.org/highscores'>HIGHSCORES</a></li><li class='acitve'><a itemprop='url' href='http://wiki.grinderscape.org/'>WIKI</a></li><li><a itemprop='url' href='https://www.grinderscape.org/contact'>CONTACT</a></li></ul> </div></div></div></header>").insertBefore("div#main-wrapper");


// Organize the elements

// if(window.matchMedia("(max-width: 1024px)").matches){
//     // The viewport is less than 1024 pixels wide
//     console.log("This is a mobile device.");
//     $("div#mw-navigation").appendTo(".main-nav");
// } else{
//     // The viewport is at least 1024 pixels wide
//     console.log("This is a tablet or desktop.");
//     $("div#mw-navigation").insertBefore(".login"); 
// }

$("div#content").wrap("<section class='main-content-cstm'></section>");
$("div#mw-navigation").insertBefore(".main-content-cstm");
$("div#content").wrap("<div id='content-sidebar-wrap'></div>");
$("div#mw-panel").insertAfter("div#content");
$("div#content").wrap("<div id='content-wrap'></div>");

$("<div id='navigation'></div>").prependTo("div#content");
$("div#left-navigation").appendTo("div#navigation");
$("div#right-navigation").appendTo("div#navigation");

$("<div id='pageInfo'></div>").insertBefore("div#content");
$("div#content").wrap("<div id='content-navigation-wrap'></div>");
$("ul#footer-info").insertAfter("div#content");

// Insert the footer

$("<footer> <div class='footer-top dFlx'> <div class='cw-30'> <h5>ABOUT</h5> <p>GrinderScape has been a dedicated server since 2008, with helpful staff and dedicated members. If you need help in how to start, you can see the Wiki. If you wish to get involved with the community as a whole, join our Forums, for the latest threads and game suggestions.</p></div><div class='cw-70 dFlx'> <div class='cw-33'> <h5>GENERAL</h5> <ul> <li><a itemprop='url' href='https://www.grinderscape.org/download'>Play Now</a></li><li><a itemprop='url' href='https://www.grinderscape.org/contact' target='_blank'>Contact Us</a></li><li><a itemprop='url' href='https://www.grinderscape.org/tos' target='_blank'>Terms of Services</a></li><li><a itemprop='url' href='https://www.grinderscape.org/user/manage' target='_blank'>Account Management</a></li><li><a itemprop='url' href='https://www.grinderscape.org/faq' target='_blank'>Frequently Asked Questions</a></li></ul> </div><div class='cw-33'> <h5>GUIDES</h5> <ul> <li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/topic/132-in-game-drops-guide-mystery-boxes/' target='_blank'>NPC Drops Guide</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Skill_guides/Slayer' target='_blank'>Slayer Guide</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/topic/132-in-game-drops-guide-mystery-boxes/' target='_blank'>Drops Guide</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Monster_hunting_guides' target='_blank'>Monster Hunting Guides</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/General_guides/Commands' target='_blank'>In-Game Commands </a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/Skill_guides' target='_blank'>Skilling Guides</a></li><li><a itemprop='url' href='https://wiki.grinderscape.org/Main_page/Guides/General_guides' target='_blank'>General Guides</a></li></ul> </div><div class='cw-33'> <h5>FORUM THREADS</h5> <ul> <li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/2-news-announcements/' target='_blank'>News &amp; Announcements</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/39-report-in-game-bugs/' target='_blank'>Report In-Game Bugs</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/11-submit-appeal/' target='_blank'>Submit In-Game Appeal</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/59-recover-a-lost-account/' target='_blank'>Recover a Lost Account</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/10-submit-player-report/' target='_blank'>Submit Player Report</a></li><li><a itemprop='url' href='https://forum.grinderscape.org/index.php?/forum/5-rules/' target='_blank'>In-Game Rules</a></li></ul> </div></div></div><div class='footer-btm dFlx'> <div class='footer-logo'> <a itemprop='url' href='https://www.grinderscape.org'><img src='https://www.grinderscape.org/images/footer-logo-trans.png' alt='GrinderScape'></a> </div><p>GrinderScape is not affiliated with Jagex or Runescape in any way.</p></div></footer>").insertAfter(".main-content-cstm");

// Mobile Navigation Click Function
$(".mobile-menu").click(function () {
    $(this).toggleClass('open');
    $(".main-nav").toggleClass("side-open");
});

// Set up the page footer info

if ($("li#footer-info-credits").length > 0) {
    $("li#footer-info-credits").html($("li#footer-info-credits").html().replace(/\[/g, "<span style='position: absolute; right: 0;'>").replace(/\]/g, "</span>").replace(/\{/g, "<p id='contentFooter' style='position: relative;'>").replace(/\}/g, "</p>"));
    $("p#contentFooter").insertBefore("li#footer-info-credits");
    $("li#footer-info-credits").remove();
}

// Set up the page title and breadcrumb

var title = $("h1#firstHeading").html().split('/');
$("h1#firstHeading").html(title[title.length - 1]);
$("h1#firstHeading").appendTo("div#pageInfo");

$("span.subpages").appendTo("div#pageInfo");
$("span.subpages").html($("span.subpages").children());
$("<span>" + title[title.length - 1] + "</span>").appendTo("span.subpages");
$("<span>&nbsp;&nbsp;/&nbsp;&nbsp;</span>").insertAfter("span.subpages > a");

// Set up the page title

document.title = title[title.length - 1] + " - GrinderScape Wiki";

// Hide mw-panel on HP
if (window.location.href == 'https://wiki.grinderscape.org/Main_page/New' || window.location.href == 'https://wiki.grinderscape.org/Main_page') {
    $('#mw-panel').remove();
}

// Remove href from selected tabs

$.each($("div.vectorTabs li.selected"), function () {
    $(this).find("a").removeAttr("href");
});

// Remove title from links

$("a").removeAttr("title");

// Set up the search box

$("div#p-search").insertBefore(".main-content-cstm");
$("div#p-search").wrap("<section class='main-top-cstm'></section>")
$("input#searchInput").val("Search...").removeAttr("placeholder").attr("onfocus", "if (this.value == 'Search...') {this.value = '';}").attr("onblur", "if (this.value == '') {this.value = 'Search...';}");

// Set up the announcement

$("div#siteNotice").insertBefore("div#p-search");
$("<div id='noticeTitle'>Welcome to the GrinderScape Wiki!</div>").prependTo("div#siteNotice");


// Show/Hide Plugin
$('.p_hide').hide(); // Hides any element with p_hide class
$('.p_toggle').on('click', function(){
    var $this = $(this);
    var toggleChild = $this.find('.p_toggle_content');
    var toggleIcon = $this.find('.p_toggle_icon')

    console.log(toggleIcon);

    toggleChild.slideToggle("fast");
    toggleIcon.toggleClass("fa-plus fa-minus");

    // if (toggleIcon == '.fa-plus'){
    //     toggleIcon.toggleClass("fa-plus", "fa-minus");
    // } else {
    //     toggleIcon.toggleClass("fa-minus", "fa-plus");
    // }
});


// Set up the edit box

function wrapText(elementID, openTag, closeTag) {
    var textArea = $("#" + elementID);
    var len = textArea.val().length;
    var start = textArea[0].selectionStart;
    var end = textArea[0].selectionEnd;
    var selectedText = textArea.val().substring(start, end);
    var replacement = openTag + selectedText + closeTag;
    textArea.val(textArea.val().substring(0, start) + replacement + textArea.val().substring(end, len));
}

$("input#wpWatchthis").prop("checked", false);

$("<div class='customButton' id='CB-Nowiki' style='background: url(https://i.imgur.com/Fx2AsCt.png);' title='Ignore wiki formatting'></div>").appendTo("div#toolbar");
$("#CB-Nowiki").click(function () {
    wrapText("wpTextbox1", "<nowiki>", "</nowiki>");
});

$("<div class='customButton' id='CB-Heading2' style='background: url(https://i.imgur.com/8uajyYO.png);' title='Level 2 heading'></div>").prependTo("div#toolbar");
$("#CB-Heading2").click(function () {
    wrapText("wpTextbox1", "<h2>", "</h2>");
});

$("<div class='customButton' id='CB-Heading1' style='background: url(https://i.imgur.com/jKOOZnF.png);' title='Level 1 heading'></div>").prependTo("div#toolbar");
$("#CB-Heading1").click(function () {
    wrapText("wpTextbox1", "<h1>", "</h1>");
});

$("<div class='customButton' id='CB-Italic' style='background: url(https://i.imgur.com/zdPfv0X.png);' title='Italic text'></div>").prependTo("div#toolbar");
$("#CB-Italic").click(function () {
    wrapText("wpTextbox1", "<i>", "</i>");
});

$("<div class='customButton' id='CB-Bold' style='background: url(https://i.imgur.com/lyqhAM9.png);' title='Bold text'></div>").prependTo("div#toolbar");
$("#CB-Bold").click(function () {
    wrapText("wpTextbox1", "<b>", "</b>");
});

// Remove auto correct from text boxes

$("textarea#wpTextbox1, input#searchInput, input#database_input").attr("spellcheck", "false");




// Table Highlight
$('.highlight tr').mouseover(function () {
    $(this).addClass('highlight-hover'); //Add Hover Class to toggle css
})
$('.highlight tr').mouseout(function () {
    $(this).removeClass('highlight-hover'); //remove the class when not on hover of .highlight tr
})




// ***************************** Indices *****************************

$.each($("div.timestamp"), function () {
    var str = $(this).html();
    var year = str.substr(0, 4);
    var month = str.substr(4, 2);
    if (month == 01) {
        month = " January "
    } else if (month == 02) {
        month = " February "
    } else if (month == 03) {
        month = " March "
    } else if (month == 04) {
        month = " April "
    } else if (month == 05) {
        month = " May "
    } else if (month == 06) {
        month = " June "
    } else if (month == 07) {
        month = " July "
    } else if (month == 08) {
        month = " August "
    } else if (month == 09) {
        month = " September "
    } else if (month == 10) {
        month = " October "
    } else if (month == 11) {
        month = " November "
    } else if (month == 12) {
        month = " December "
    }
    var day = str.substr(6, 2);
    $(this).html("Last modified on " + day + month + year + ".");
    if (str == "") {
        $(this).html("This page is under construction.");
    }
});
$.each($("div.link > a"), function () {
    var link = $(this).html().split("/");
    $(this).html(link[link.length - 1].replace(/\_/g, " "));
});









// ***************************** Databases *****************************

function commaSeparateNumber(val) {
    while (/(\d+)(\d{3})/.test(val.toString())) {
        val = val.toString().replace(/(\d+)(\d{3})/, '$1' + '.' + '$2');
    };
    return val;
};

$("button#database_button").click(function () {
    searchDatabase();
});








// ***************************** Close *****************************










// Remove the loader

setTimeout(function () {
    $("div#mw-head-base").fadeOut(500);
    $("div#mw-page-base").fadeOut(500);
}, 600);
Retrieved from "https://wiki.grinderscape.org/index.php?title=MediaWiki:Common.js&oldid=12360"