Welcome to the RuneGlory Wiki, where we do our best to make your life easier!

You can use the search menu on the right side of the wiki (or at the bottom if you are on mobile) to search for the page you are looking for. The most popular pages can be found on the right side of the wiki aswell (or again at the bottom if you are on mobile).

Difference between revisions of "MediaWiki:Common.css"

From RuneGlory
Jump to: navigation, search
Line 203: Line 203:
 
}
 
}
  
       div#simpleSearch #searchInput {
+
       div#simpleSearch #searchInput, input#database_input {
 
     padding: 10px;
 
     padding: 10px;
 
     line-height: 20px;
 
     line-height: 20px;
Line 345: Line 345:
 
     width: 46px;
 
     width: 46px;
 
     height: 40px;
 
     height: 40px;
     background: url(https://i.imgur.com/OHMk1zM.png) no-repeat center!important;
+
     background: url(https://i.imgur.com/tPw4LTS.png) no-repeat center!important;
 
     background-position: initial;
 
     background-position: initial;
 
     outline: none;
 
     outline: none;
Line 436: Line 436:
 
}
 
}
  
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 {
+
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 {
 
     color: #717171!important;
 
     color: #717171!important;
 
}
 
}
Line 450: Line 450:
 
}
 
}
  
div.editButtons input[type="submit"], div#simpleSearch #searchButton, div.editButtons span a, div#customFooter div a {
+
div.editButtons input[type="submit"], div#simpleSearch #searchButton, div.editButtons span a, div#customFooter div a, button#database_button {
 
     border-radius: 3px;
 
     border-radius: 3px;
 
     color: #afafaf;
 
     color: #afafaf;
Line 644: Line 644:
 
     max-height: 40px;
 
     max-height: 40px;
 
     max-width: 40px;
 
     max-width: 40px;
 +
}
 +
 +
button#database_button {
 +
    border-top-left-radius: 0;
 +
    border-bottom-left-radius: 0;
 +
    border-left: 0;
 
}
 
}
  
Line 675: Line 681:
 
/* General */
 
/* 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 {
+
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;
 
     font-size: 12px;
 
     line-height: 20px;
 
     line-height: 20px;

Revision as of 22:39, 22 April 2016

@import url(https://fonts.googleapis.com/css?family=Open+Sans:600,600italic,700);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:700);

body {
    background: url(https://www.grinderscape.org/assets/images/background.png);
    font-family: Open Sans, sans-serif;
    line-height: 20px;
}

a {
    color: #afafaf!important;
    text-decoration: none!important;
    transition: 200ms;
}

a.new {
    color: #b24040!important;
}




















 nav ul {
    list-style-type: none;
    list-style-image: none;
    text-align: center;
    margin: auto;
}

  nav ul li {
    margin: 0;
    display: inline-flex;
}

   nav ul li a {
    margin: 10px;
    padding: 0;
}

header {
    min-width: 800px;
}

 div#logo {
    padding: 30px 0;
    margin: auto;
    text-align: center;
}

div#wrap {
    min-width: 800px;
    max-width: 1200px;
    margin: 60px auto;
    padding: 30px 30px 0 30px;
    box-sizing: border-box;
}

 div#mw-navigation {
    display: none;
}

  div#mw-head {
    position: initial;
}

   div#p-personal {
    position: initial;
    text-align: right;
    padding-bottom: 0;
}

    #p-personal ul {
    padding: 0;
    display: inline-block;
}

     #p-personal ul li {
    float: initial;
    margin: 0;
    display: inline-block;
    padding: 0!important;
    background: none;
}

      #p-personal ul li a {
    margin: 10px;
    padding: 0;
    display: block;
}

   div#mw-head div.vectorMenu h3 {
    display: none;
}

 div#siteNotice {
    margin-bottom: 30px;
    padding: 30px;
    text-align: left;
}

  div#noticeTitle {
    margin-bottom: 10px!important;
    background: url(https://i.imgur.com/C0gNESS.png) no-repeat;
}

  div#localNotice {
    margin-bottom: 0;
}

   div#localNotice > p {
    margin: 0;
}

 div#pageInfo {
    margin: 0 0 30px 0;
    padding: 30px;
}

  h1#firstHeading {
    background: url(https://i.imgur.com/C9QfUdA.png) no-repeat;
    padding: 0 0 0 30px;
    line-height: 20px;
    margin: 0;
    border-bottom: none;
    font-size: 13px;
    color: #afafaf;
}

  span.subpages {
    position: relative;
    border-top: 2px solid #161b20;
    padding-top: 10px;
    margin-top: 10px;
}

 div#content-sidebar-wrap {
    display: table;
    width: 100%;
}

  div#mw-panel {
    position: initial;
    width: 350px;
    display: table-cell;
    padding: 0 0 0 30px;
    vertical-align: top;
    box-sizing: border-box;
}

   div#p-logo {
    display: none;
}

   div#p-search {
    margin: 0;
    float: initial;
    margin-bottom: 30px;
    padding: 30px;
}

    div#p-search div#searchTitle {
    background: url(https://i.imgur.com/qMgB3iO.png) no-repeat;
}

      span.subpages:before {
    content: "";
    position: absolute;
    height: 2px;
    width: 20px;
    background-color: #afafaf;
    top: -2px;
    left: 0;
}

    form#searchform {
    padding: 0;
    margin: 0;
}

     div#simpleSearch {
    margin: 0;
    padding: 0;
    width: 100%;
    height: initial;
    border: 0;
    background: none;
}

      div#simpleSearch #searchInput, input#database_input {
    padding: 10px;
    line-height: 20px;
    font-family: Open Sans,sans-serif;
    background-color: #222b32;
    border: 1px solid #161b20;
}

      div#simpleSearch #searchButton {
    position: initial;
    width: 100%;
    margin-top: 10px!important;
    text-indent: initial;
}

   div#mw-panel div.portal {
    margin: 0;
    padding: 30px;
    margin-bottom: 30px;
}

    div#mw-panel div.portal h3 {
    cursor: initial;
    display: block!important;
}

     div#mw-panel div.portal h3#p-In_the_wiki-label {
    background: url(https://i.imgur.com/2EYG4SU.png) no-repeat;
}

     div#mw-panel div.portal h3#p-Categories-label {
    background: url(https://i.imgur.com/Lnp5kiv.png) no-repeat;
}

     div#mw-panel div#p-Management{
    display: none;
}

      div#mw-panel div.portal h3#p-Management-label {
    background: url(https://i.imgur.com/Cckn7vZ.png) no-repeat;
}

    div#mw-panel div.portal div.body {
    margin: 0!important;
}

     div#mw-panel div.portal div.body ul li {
    line-height: 20px;
    display: flex;
    padding: 10px 0;
    border-bottom: 1px solid #161b20;
}

     div#mw-panel div.portal div.body ul li:last-child {
    border-bottom: none;
}

  div#content-wrap {
    box-sizing: border-box;
}

   div#content-navigation-wrap {
    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 #161b20;
    width: 100%;
}

     div#left-navigation {
    margin: 0;
    position: absolute;
}

     div#right-navigation {
    position: absolute;
    right: 0;
    margin: 0;
}

      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 {
    cursor: initial;
    border-bottom: 2px solid #afafaf;
}

         div.vectorTabs span {
    background: none;
}

          div.vectorTabs ul li a {
    line-height: 20px;
    padding: 10px;
    font-size: 13px;
    height: initial;
    border-bottom: 2px solid transparent;
}

           div.vectorTabs ul li a:hover {
    border-bottom: 2px solid #AFAFAF;
}

      h3#p-cactions-label {
    padding: 0;
    margin: 0!important;
}

       h3#p-cactions-label span {
    display: none;
}

       div.vectorMenu h3 a {
    position: initial;
    display: block;
    width: 46px;
    height: 40px;
    background: url(https://i.imgur.com/tPw4LTS.png) no-repeat center!important;
    background-position: initial;
    outline: none;
}

        div.vectorMenu h3 a:hover {
    background: url(https://i.imgur.com/tPw4LTS.png) no-repeat center, linear-gradient(rgba(31,42,53,0.5),rgba(31,42,53,0.5)),url(https://www.grinderscape.org/assets/images/background.png)!important;
}

      div.vectorMenu div.menu {
    top: 40px;
    left: initial;
    right: 0;
    border: none;
    background: linear-gradient(rgba(43,55,64,0.5),rgba(43,55,64,0.5)),url(https://www.grinderscape.org/assets/images/background.png);
}

       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: linear-gradient(rgba(31,42,53,0.5),rgba(31,42,53,0.5)),url(https://www.grinderscape.org/assets/images/background.png);
}

    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 #161b20;
}

div#footer {
    margin: 0;
    padding: 0;
    min-width: 800px;
}

 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, div#customFooter, nav {
    background: linear-gradient(rgba(43, 55, 64, 0.5),rgba(43, 55, 64, 0.5)),url(https://www.grinderscape.org/assets/images/background.png)!important;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

div#noticeTitle, div#searchTitle, div#mw-panel div.portal h3 {
    position: relative;
    font-size: 13px;
    padding: 0 0 10px 30px;
    color: #afafaf;
    margin-bottom: 30px;
    border-bottom: 2px solid #161b20;
    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 {
    color: #717171!important;
}

div.portal h3:before, div#searchTitle:before, div#noticeTitle:before {
    content: "";
    position: absolute;
    height: 2px;
    width: 20px;
    background-color: #afafaf;
    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 #0e284c;
    background-color: #345583;
    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#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 #151A1E;
}

 div#toolbar {
    padding: 10px 5px;
    background: #1f272f;
    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: #222b32;
    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 #161b20;
    background: #1f272f;
}

  .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 #161B20;
    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;
}

button#database_button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
}




























/* 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: #afafaf!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 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: #222b32!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: #222b32;
    line-height: 16px;
    border: 1px solid #161b20;
    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;
}