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
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 {
+
// Remove unnecessary elements
    color: #272525;
+
    text-decoration: none;
+
}
+
  
a.new {
+
$("div#p-tb").remove();
    color: #b24040;
+
}
+
  
/* nav ul {
+
// Wrap the content
    list-style-type: none;
+
    list-style-image: none;
+
    text-align: center;
+
    margin: auto;
+
}
+
  
nav ul li {
+
$("div#content, div#mw-navigation").wrapAll("<div id='main-wrapper'><div class='container'></div></div>");
    margin: 0;
+
    display: inline-flex;
+
} */
+
  
header {
+
// Insert the header
    min-width: auto;
+
}
+
  
div#logo {
+
$("<div style='padding:10px 0;text-align:center;background-color:#ECE6D8;color:#000;'>Wiki design is currently under construction. Wiki content is still available to browse.</div><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");
    padding: 30px 0;
+
    margin: auto;
+
    text-align: center;
+
}
+
  
div#main-wrapper {
 
}
 
  
div#mw-navigation {
+
// Organize the elements
    display: none;
+
}
+
  
div#mw-head {
+
// if(window.matchMedia("(max-width: 1024px)").matches){
     position: initial;
+
//    // 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#p-personal {
+
$("div#content").wrap("<section class='main-content-cstm'></section>");
    position: initial;
+
$("div#mw-navigation").insertBefore(".main-content-cstm");  
    text-align: right;
+
$("div#content").wrap("<div id='content-sidebar-wrap'></div>");
    padding-bottom: 0;
+
$("div#mw-panel").insertAfter("div#content");
}
+
$("div#content").wrap("<div id='content-wrap'></div>");
  
#p-personal ul {
+
$("<div id='navigation'></div>").prependTo("div#content");
    padding: 0 20px;;
+
$("div#left-navigation").appendTo("div#navigation");
    display: inline-block;
+
$("div#right-navigation").appendTo("div#navigation");
}
+
  
#p-personal ul li {
+
$("<div id='pageInfo'></div>").insertBefore("div#content");
    float: initial;
+
$("div#content").wrap("<div id='content-navigation-wrap'></div>");
    margin: 0;
+
$("ul#footer-info").insertAfter("div#content");
    display: inline-block;
+
    padding: 0 !important;
+
    background: none;
+
}
+
  
#p-personal ul li a {
+
// Insert the footer
    /* margin: 0 10px; */
+
    margin: 10px;
+
    padding: 0;
+
    display: block;
+
}
+
  
div#mw-head div.vectorMenu h3 {
+
$("<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");
    display: none;
+
}
+
  
div#siteNotice, .welcomeText, pageText {
+
// Mobile Navigation Click Function
     padding: 30px 30px 0;
+
$(".mobile-menu").click(function () {
     text-align:center;
+
     $(this).toggleClass('open');
}
+
     $(".main-nav").toggleClass("side-open");
 +
});
  
#noticeTitle, #welcome_title {
+
// Set up the page footer info
    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 {
+
if ($("li#footer-info-credits").length > 0) {
     margin-bottom: 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();
 
}
 
}
  
div#localNotice>p {
+
// Set up the page title and breadcrumb
    margin: 0;
+
}
+
  
div#pageInfo {
+
var title = $("h1#firstHeading").html().split('/');
    margin: 0 0 30px 0;
+
$("h1#firstHeading").html(title[title.length - 1]);
    padding: 30px;
+
$("h1#firstHeading").appendTo("div#pageInfo");
}
+
  
h1#firstHeading {
+
$("span.subpages").appendTo("div#pageInfo");
    background: url(https://i.imgur.com/qpqwLFJ.png) no-repeat;
+
$("span.subpages").html($("span.subpages").children());
    padding: 0 0 0 30px;
+
$("<span>" + title[title.length - 1] + "</span>").appendTo("span.subpages");
    line-height: 20px;
+
$("<span>&nbsp;&nbsp;/&nbsp;&nbsp;</span>").insertAfter("span.subpages > a");
    margin: 0;
+
    border-bottom: none;
+
    font-size: 13px;
+
    color: #592c0d;
+
}
+
  
span.subpages {
+
// Set up the page title
    position: relative;
+
    border-top: 2px solid #161b20;
+
    padding-top: 10px;
+
    margin-top: 10px;
+
}
+
  
div#content-sidebar-wrap {
+
document.title = title[title.length - 1] + " - GrinderScape Wiki";
    display: table;
+
    width: 100%;
+
}
+
  
div#mw-panel {
 
    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 {
 
    display: none;
 
}
 
  
div#p-search {
+
// Remove href from selected tabs
    margin: 0 auto;
+
    float: initial;
+
    padding: 30px;
+
    width:45%;
+
}
+
  
div#p-search div#searchTitle {
+
$.each($("div.vectorTabs li.selected"), function () {
     background: url(https://i.imgur.com/X1fC0qz.png) no-repeat;
+
     $(this).find("a").removeAttr("href");
}
+
});
  
span.subpages:before {
+
// Remove title from links
    content: "";
+
    position: absolute;
+
    height: 2px;
+
    width: 20px;
+
    background-color: #afafaf;
+
    top: -2px;
+
    left: 0;
+
}
+
  
form#searchform {
+
$("a").removeAttr("title");
    padding: 0;
+
    margin: 0;
+
}
+
  
div#simpleSearch {
+
// Set up the search box
    margin: 0;
+
    padding: 0;
+
    width: 100%;
+
    height: initial;
+
    border: 0;
+
    background: none;
+
}
+
  
div#simpleSearch #searchInput,
+
$("div#p-search").insertBefore(".main-content-cstm");
input#database_input {
+
$("div#p-search").wrap("<section class='main-top-cstm'></section>")
    padding: 10px;
+
$("input#searchInput").val("Search...").removeAttr("placeholder").attr("onfocus", "if (this.value == 'Search...') {this.value = '';}").attr("onblur", "if (this.value == '') {this.value = 'Search...';}");
    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 {
+
// Set up the announcement
    text-indent: initial;
+
    width: 4.65em;
+
}
+
  
div#mw-panel div.portal {
+
$("div#siteNotice").insertBefore("div#p-search");
    margin: 0;
+
$("<div id='noticeTitle'>Welcome to the GrinderScape Wiki!</div>").prependTo("div#siteNotice");
    padding: 15px 30px;
+
    margin-bottom: 30px;
+
    background-image:none;
+
}
+
  
div#mw-panel div.portal h3 {
 
    cursor: initial;
 
    display: block !important;
 
}
 
  
div#mw-panel div.portal h3#p-In_the_wiki-label {
+
// Set up the edit box
    background: url(https://i.imgur.com/7DeMxyz.png) no-repeat;
+
}
+
  
div#mw-panel div.portal h3#p-Popular_pages-label {
+
function wrapText(elementID, openTag, closeTag) {
     background: url(https://i.imgur.com/qtaf1a3.png) no-repeat;
+
    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#mw-panel div.portal h3#p-Categories-label {
+
$("input#wpWatchthis").prop("checked", false);
    background: url(https://i.imgur.com/Lnp5kiv.png) no-repeat;
+
}
+
  
div#mw-panel div#p-Management {
+
$("<div class='customButton' id='CB-Nowiki' style='background: url(https://i.imgur.com/Fx2AsCt.png);' title='Ignore wiki formatting'></div>").appendTo("div#toolbar");
     display: none;
+
$("#CB-Nowiki").click(function () {
}
+
     wrapText("wpTextbox1", "<nowiki>", "</nowiki>");
 +
});
  
div#mw-panel div.portal h3#p-Management-label {
+
$("<div class='customButton' id='CB-Heading2' style='background: url(https://i.imgur.com/8uajyYO.png);' title='Level 2 heading'></div>").prependTo("div#toolbar");
    background: url(https://i.imgur.com/vcNXF6N.png) no-repeat;
+
$("#CB-Heading2").click(function () {
}
+
    wrapText("wpTextbox1", "<h2>", "</h2>");
 +
});
  
div#mw-panel div.portal div.body {
+
$("<div class='customButton' id='CB-Heading1' style='background: url(https://i.imgur.com/jKOOZnF.png);' title='Level 1 heading'></div>").prependTo("div#toolbar");
     margin: 0 !important;
+
$("#CB-Heading1").click(function () {
}
+
     wrapText("wpTextbox1", "<h1>", "</h1>");
 +
});
  
div#mw-panel div.portal div.body ul li {
+
$("<div class='customButton' id='CB-Italic' style='background: url(https://i.imgur.com/zdPfv0X.png);' title='Italic text'></div>").prependTo("div#toolbar");
     line-height: 20px;
+
$("#CB-Italic").click(function () {
    display: flex;
+
     wrapText("wpTextbox1", "<i>", "</i>");
    padding: 10px 0;
+
});
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+
}
+
  
div#mw-panel div.portal div.body ul li:last-child {
+
$("<div class='customButton' id='CB-Bold' style='background: url(https://i.imgur.com/lyqhAM9.png);' title='Bold text'></div>").prependTo("div#toolbar");
     border-bottom: none;
+
$("#CB-Bold").click(function () {
}
+
     wrapText("wpTextbox1", "<b>", "</b>");
 +
});
  
div#content-wrap {
+
// Remove auto correct from text boxes
    box-sizing: border-box;
+
}
+
  
div#content-navigation-wrap {
+
$("textarea#wpTextbox1, input#searchInput, input#database_input").attr("spellcheck", "false");
    margin-bottom: 30px;
+
    overflow: hidden;
+
}
+
  
div#navigation {
 
    display: flex;
 
    height: 42px;
 
    position: relative;
 
    margin-bottom: 60px;
 
}
 
  
div#navigation:before {
 
    content: "";
 
    position: absolute;
 
    bottom: 0;
 
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
 
    width: 100%;
 
}
 
  
div#left-navigation {
 
    margin: 0;
 
    position: absolute;
 
}
 
  
div#right-navigation {
+
// Table Highlight
     position: absolute;
+
$('.highlight tr').mouseover(function () {
    right: 0;
+
     $(this).addClass('highlight-hover'); //Add Hover Class to toggle css
     margin: 0;
+
})
}
+
$('.highlight tr').mouseout(function () {
 +
     $(this).removeClass('highlight-hover'); //remove the class when not on hover of .highlight tr
 +
})
  
div.vectorTabs {
 
    background: none;
 
    padding: 0;
 
    height: initial;
 
}
 
  
div.vectorTabs ul {
 
    background: none;
 
}
 
  
div.vectorTabs ul li {
 
    background: none !important;
 
    font-size: 0;
 
}
 
  
div.vectorTabs ul li.selected a {
+
// ***************************** Indices *****************************
    cursor: initial;
+
    border-bottom: 2px solid #5C3219;
+
}
+
  
div.vectorTabs span {
+
$.each($("div.timestamp"), function () {
    background: none;
+
     var str = $(this).html();
}
+
     var year = str.substr(0, 4);
 
+
     var month = str.substr(4, 2);
div.vectorTabs ul li a {
+
     if (month == 01) {
    line-height: 20px;
+
        month = " January "
    padding: 10px;
+
     } else if (month == 02) {
    font-size: 13px;
+
        month = " February "
    height: initial;
+
     } else if (month == 03) {
    border-bottom: 2px solid transparent;
+
        month = " March "
}
+
     } else if (month == 04) {
 
+
        month = " April "
div.vectorTabs ul li a:hover {
+
     } else if (month == 05) {
    border-bottom: 2px solid rgba(0, 0, 0, 0.2);
+
        month = " May "
}
+
     } else if (month == 06) {
 
+
        month = " June "
h3#p-cactions-label {
+
     } else if (month == 07) {
    padding: 0;
+
        month = " July "
    margin: 0 !important;
+
     } else if (month == 08) {
}
+
        month = " August "
 
+
     } else if (month == 09) {
h3#p-cactions-label span {
+
        month = " September "
    display: none;
+
     } else if (month == 10) {
}
+
        month = " October "
 
+
     } else if (month == 11) {
div.vectorMenu h3 a {
+
        month = " November "
    position: initial;
+
     } else if (month == 12) {
    display: block;
+
         month = " December "
    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 {
+
    background: #transparent !important;
+
}
+
 
+
div.vectorMenu div.menu {
+
    top: 40px;
+
    left: initial;
+
    right: 0;
+
    border: none;
+
    background: #c7b07c;
+
}
+
 
+
div.vectorMenu div.menu li {
+
    line-height: 20px;
+
}
+
 
+
div.vectorMenu li:first-child a {
+
    border-top: 1px solid #151A1E;
+
}
+
 
+
div.vectorMenu li a {
+
    padding: 10px 15px;
+
    font-size: 12px;
+
    border-bottom: 1px solid #151A1E;
+
}
+
 
+
div.vectorMenu li a:hover {
+
    background: rgba(255, 255, 255, 0.1);
+
}
+
 
+
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 {
+
    border-radius: 3px;
+
    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
+
}
+
 
+
/* 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: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
+
 
     }
 
     }
 
+
     var day = str.substr(6, 2);
     .mobile-menu span {
+
    $(this).html("Last modified on " + day + month + year + ".");
        display: block;
+
    if (str == "") {
        position: absolute;
+
         $(this).html("This page is under construction.");
        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
+
 
     }
 
     }
 +
});
 +
$.each($("div.link > a"), function () {
 +
    var link = $(this).html().split("/");
 +
    $(this).html(link[link.length - 1].replace(/\_/g, " "));
 +
});
  
    .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) {
 
        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 {
+
// ***************************** Databases *****************************
        position: relative
+
    }
+
  
     .header-bottm .main-nav {
+
function commaSeparateNumber(val) {
         opacity: 0
+
     while (/(\d+)(\d{3})/.test(val.toString())) {
     }
+
         val = val.toString().replace(/(\d+)(\d{3})/, '$1' + '.' + '$2');
 +
     };
 +
    return val;
 +
};
  
    .header-bottm .main-nav {
+
$("button#database_button").click(function () {
        position: absolute;
+
    searchDatabase();
        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 {
+
// ***************************** Close *****************************
        padding-bottom: 30px;
+
        max-width: 70%;
+
        margin: auto
+
    }
+
  
    .container {
 
        max-width: 96%
 
    }
 
  
   
 
}
 
  
/* END MOBILE */
 
  
/* END NEW DESIGN CSS */
 
  
  
Line 1,202: Line 234:
  
  
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 {
+
// Remove the loader
    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;
+
}
+
 
+
ul#index li div.img img {
+
    max-height: 40px;
+
    max-width: 40px;
+
}
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
 
+
/* 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;
+
}
+
 
+
/*HOMEPAGE*/
+
.tile-half {
+
    flex: 1;
+
    margin-right: 9px;
+
}
+
 
+
.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: #ECE6D8;
+
    padding: 12px 10px;
+
    border-bottom-right-radius: 5px;
+
    border-bottom-left-radius: 5px;
+
    align-self: end;
+
    min-height: 5vw;
+
}
+
 
+
.tile-date {
+
    margin: 0 !important;
+
    font-size: 0.8em !important;
+
    color: #999 !important !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;
+
}
+
 
+
/* 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;
+
    }
+
}
+
 
+
@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);

Revision as of 04:52, 18 November 2020

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

// Remove unnecessary elements

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

// Wrap the content

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

// Insert the header

$("<div style='padding:10px 0;text-align:center;background-color:#ECE6D8;color:#000;'>Wiki design is currently under construction. Wiki content is still available to browse.</div><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";



// 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");


// 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);