MediaWiki:Common.css

From Welcome to My Home Wiki
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */

body {
  background-color: #67803F;
  background-image: url("/images/8/8d/Bushes.webp");
  background-repeat: repeat;
  background-size: cover;
}

.mw-body {
    background-color: #FFF7F0;
}

#p-logo {
  position: absolute;
  top: 1rem;
}

.mw-wiki-logo {
    background-size: contain;
}

#mw-panel {
	margin-top: 50px;
    z-index: 1;
}

#mw-head-base {
    display:none;
}

#mw-page-base {
    background: #67803F;
    height: 85px;
}

#mw-head {
    height: 80px;
    top: 0;
    width:100%;
}

#mw-head {
    margin-top: 35px;
}

#right-navigation {
	margin-top: 1.5rem;
}

a,
a:visited,
.mw-parser-output a.external,
.mw-parser-output a.external:visited,
.mw-parser-output a.extiw,
.mw-parser-output a.extiw:visited {
    color: #8A5141;
}

a.new,
a.new:visited {
    color: #8A5141;
}

#p-search {
	position: absolute;
	top: 5px;
    right: 325px;
	height: 30px;
	line-height: 27px;
	vertical-align: middle;
	margin: 0 2px 0 2px;
	padding: 0;
}

#p-navigation::before {
  display: block;
  content: "";
  background-image: url("/images/thumb/0/0e/QuestHeader.PNG/800px-QuestHeader.PNG?20240128130223");
  background-repeat: no-repeat;
  background-size: 100%;
  width: 100%;
  height: 20px;
  margin-left: 3px;
  margin-bottom: 6px;
}

#p-navigation .vector-menu-content {
  background-color: #8A5141;
  color: #FEECDD !important;
  padding: 5px;
}

#p-navigation a {
  color: #FEECDD !important;
}

#p-tb::before {
  display: block;
  content: "";
  background-image: url("/images/thumb/0/0e/QuestHeader.PNG/800px-QuestHeader.PNG?20240128130223");
  background-repeat: no-repeat;
  background-size: 100%;
  width: 100%;
  height: 20px;
  margin-left: 3px;
}

#p-tb  .vector-menu-content {
  background-color: #8A5141;
  color: #FEECDD !important;
  padding: 5px;
}

#p-tb a {
  color: #FEECDD !important;
} 

.vector-menu-portal .vector-menu-heading {
    color: #FEECDD;
    background-color: #8A5141;
}

#mw-panel .portal {
  padding: 32px 10px 32px 10px;
  margin: 0;
}

#left-navigation,
#right-navigation {
    margin-top: 19px;
}

#left-navigation,
#right-navigation,
.vector-menu-tabs {
    height: 30px;
    box-sizing: border-box;
    display: flex;
    flex-flow: row wrap;
}

#left-navigation {
    margin-left: 200px;
}

#right-navigation {
    margin-right: 0.75em;
}

.vector-menu-tabs li {
    background: none;
}

.vector-menu-tabs li:not(:first-child),
#p-cactions {
    padding-left: 5px;
}

.vector-menu-tabs,
.vector-menu-tabs .selected,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown .vector-menu-heading,
.vector-menu-tabs-legacy li {
    background: none;
}

.vector-menu-tabs li a,
.vector-menu-tabs li.new a,
.vector-menu-tabs li.new a:visited,
.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited,
#mw-head .vector-menu-dropdown .vector-menu-heading {
    background: transparent;
    color: #FEECDD;
    border: none;
    padding:6px 8px;
    height: 30px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited {
	background: #8A5141;
	color: #FEECDD;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	border: 1px solid #FFD06F;
	border-bottom: none;
}

#mw-head .vector-menu-dropdown .vector-menu-heading {
    padding-right: 0.5em;
}

#p-cactions .vector-menu-content span {
    padding: 0;
}

.vector-menu-tabs .mw-watchlink.icon a {
    padding: 28px 0 0 0;
    color: transparent;
}

#mw-head #ca-watch.icon a,
#mw-head #ca-watch.icon a:hover,
#mw-head #ca-watch.icon a:focus {
    background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAZCAYAAADe1WXtAAAABmJLR0QA/wDKAEWpqdp6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QsBDQAresRe4AAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAABq0lEQVRIx+3Vu2tUURTF4W+ckGgkggQlgkVMEay0jA8wCD4gNoKgYCEWIv4Dgr3Y2JnCwlrBpLJQEKbwVQmCDywkRBAVEYQ0Go0aWDYnehlnSIQrNm7YcLlrnx9n373OPY0k6o5V/kL8U2gDa+uG7sQ1DNUJPYxDBV4LdD32YKaAG3VAt2MQV7BrJZ9gJdAJvEarDGvHcgt6Ks/DWNem92M/pkr7T3EELzuw5vC2Ct2IaWzFAr5XihdwH4u4idO4XNE3YFPRTmBREkn6k5xLMpfkTpIDSbaV3JKkUep6kgxUcneSh0leJTm5VLcElaSZZCLJkyStJKMVrT0bSfYleVE2MVbVOy0YTTKV5HGS8Q56M8mZJLNJJpMMtdd028lAAd9I0temjSR5k+R8kt5O67tZ6gvW4B2+tp39D+X9PL79iU+Hi+lbGMBZ3MJRfMa9YrXVy/m0GmPFVu9xCeO4i4sYKX49hs2YXQm0gb3owyQ+4Tge4SAu4GPln/AbtNOQBpM8TzLfZbpL7lhMcrXi4Z/Zrf3beIbrHYYxg1N4gF40y2n71er/i6/2+AHyp4jy6N4f1wAAAABJRU5ErkJggg==) no-repeat center center;
}

#mw-head #ca-unwatch.icon a,
#mw-head #ca-unwatch.icon a:hover,
#mw-head #ca-unwatch.icon a:focus {
    background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAZCAYAAADe1WXtAAAABmJLR0QA/wDKAEWpqdp6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QsBDQARvMiHUgAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAABW0lEQVRIx+3VsUoeQRSG4WdXI5JGISAGLBRtVDBFUAhaCXaKpjFVUCxsvAQbscktpAm5DCWthcSQJoWIhSDYJARsFESja3N+MiyrrrDBJh8MnLPDvDtnzrezWbE3o2nl/oGeFJqjp2noKvbxqmnoC6w0BR3AcMRv66ypA11AR8QvMdYE9H0St5XySrUn8RR6S/PdGEUWeYF32K1gHeMbZPFFjeA7OmNhWSn0Jka6+xw/0Y+LVvm/sJMAs9JI4W14lowsXrKNy/RMf2MWm7jCdU2rFTgPyy23KkgbdYkNzMXOr0tlpmodwQEm8emh7n/B6wDfpQxfMYEfdS11Gk3L7gFf4OwxPp1EVwladsV4WK42dLHCRicRFzH3PI6pFjTHTCwsosw1DOED/sTzHEt1oYPoi/gIb/Ax3LGO+bAgTFcx2u8o/zC6ulrRjK24Vz9H3hHV/LXG/x9f47oF4j9I7hdXhi4AAAAASUVORK5CYII=) no-repeat center center;
}

.vector-menu-tabs #ca-watch.icon a::before,
.vector-menu-tabs #ca-unwatch.icon a::before {
    display:none;
}

.res-img img {
	max-width:100%;
	height:auto;
}

@media screen and (max-width:720px) {

    #p-logo,
    #p-logo a {
        height: 6rem;
        width: 10rem;
    }

    #p-logo {
        position: absolute;
        top: 2rem;
        left: 1rem;
        margin-left: 0;
        z-index: 1;
    }

    #left-navigation,
    #right-navigation {
        margin-top: calc(6rem + 10px);
        margin-bottom: 0;
        border-radius: 20px;
        background-color: #8A5141;
    }

    #right-navigation {
        margin-right: 10px;
    }

    #left-navigation {
        margin-left: 5px;
    }

    #right-navigation #p-search {
        margin-right: 0
    }

    #p-search {
        position: absolute;
        right: 10px;
        top: 5px;
    }

    .vector-search-box-inner {
	    width: 40vw;
    }

    .mw-body {
        border-left: none;
        border-right: none;
        margin-top: 0;
        margin-bottom: 5px;
        padding-top: 5em;
    }

    .mw-footer {
        border-left: none;
        border-right: none;
    }

    #mw-page-base {
        height: calc(6rem + 35px);
    }

    #mw-head {
        top: 0;
        width:100%;
    }

    #mw-panel {
        position: unset;
        width: 100%;
        margin: 0;
        padding: 0;
        top: 0
    }

    #mw-navigation #mw-panel .portal {
        text-align: center;
		margin: 0 auto 10px;
		width: 50%;
    }

    .vector-menu-dropdown .vector-menu-content {
        right: 0;
        left: unset;
    }
    
    .vector-menu-tabs .mw-watchlink.icon a {
        height:100%;
        padding:0;
    }
    
    .vector-menu-tabs .selected a,
	.vector-menu-tabs .selected a:visited {
		background: none;
		color: #FEECDD;
		border: none;
	}

    table.wikitable,
    table.responsive-table {
        display: block;
        overflow-x: scroll;
    }
    
}

table {
    color: #000000;
display: table;
white-space: initial;
overflow-x: auto;
    border-collapse: collapse;
}

table tbody td {
vertical-align: middle;
padding: 5px;
}

table tbody th {
	background-color: #FFD06F;
}

table tbody td,
table tbody th {
    border: 1px solid #000000;
}


table tbody tr:nth-child(2n) {
    background-color: #FFF8F2;
}

table tbody tr:nth-child(odd) {
    background-color: #FEECDD;
}

.farmtablebox {
    overflow: auto;
    margin-bottom: 15px;
}


.farmboxes {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.farmbox {
    width:300px;
    margin:7px;
}

.farmbox h2 {
	border:0px solid #aaaaa;
	border-top-left-radius:25px;
	border-top-right-radius:25px;
	background-color:#FFD06F;
	padding:0.5em 0.3em 0.3em 0.3em;
	margin:0;font-size: 150%;
	text-indent:0.0em;
	font-family:Century;
}

.farmbox-stuff {
	border:1px solid #aaaaaa; 
	border-top:0px solid #ffffff; 
	border-bottom-left-radius:25px;
	border-bottom-right-radius:25px;  
	background-color:#ffffff; 
	margin-bottom:0.8em; 
	padding:0.2em 0.8em 0.1em 0.8em;
}

.farmbox div table{
    width: 100%;
    margin-bottom: 25px;
}

.farmbox-title {
    border:0;
    margin:0;
    font-family: inherit;
    font-size: 1.75em;
    line-height: 1.5;
}

.farmbox-caption {
    display:block;
    padding: 5px 10px;
    hyphens: auto;
    color: gray;
    font-size: 1em;
    font-style: italic;
    word-wrap: break-word;
}

.farmbox-row {
    padding: 5px 10px;
    border-color: #a2a9b1;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    overflow: hidden;
    width: 100%;
    font-size: .85em;
}

.farmbox-row h3 {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    flex-basis: 90px;
    hyphens: auto;
    overflow: hidden;
    word-wrap: break-word;
}

.farmbox-row-data {
    padding-left:10px;
    flex-grow: 1;
    flex-basis: 200px;
    word-wrap: break-word;
    hyphens: auto;
    word-break: break-word;
}

.starbox {
    width:150px;
    margin:7px;
}

.starbox h2 {
	border:0px solid #aaaaa;
	border-top-left-radius:25px;
	border-top-right-radius:25px;
	background-color:#FFD06F;
	padding:0.5em 0.3em 0.3em 0.3em;
	margin:0;font-size: 150%;
	text-indent:0.0em;
	font-family:Century;
}

.starbox div table{
    width: 100%;
    margin-bottom: 25px;
}

.starbox-title {
    border:0;
    margin:0;
    font-family: inherit;
    font-size: 1.75em;
    line-height: 1.5;
}

.starbox-caption {
    display:block;
    padding: 5px 10px;
    hyphens: auto;
    color: gray;
    font-size: 1em;
    font-style: italic;
    word-wrap: break-word;
}

.starbox-row {
    padding: 5px 10px;
    border-color: #a2a9b1;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    overflow: hidden;
    width: 100%;
    font-size: .85em;
}

.starbox-row h3 {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    flex-basis: 90px;
    hyphens: auto;
    overflow: hidden;
    word-wrap: break-word;
}

.starbox-row-data {
    padding-left:10px;
    flex-grow: 1;
    flex-basis: 200px;
    word-wrap: break-word;
    hyphens: auto;
    word-break: break-word;
}

.homebox {
    width:417px;
    margin:7px;
}

.homebox h4 {
	border:0px solid #aaaaa;
	border-top-left-radius:25px;
	border-top-right-radius:25px;
	background-color:#67803F;
	color: #FFF8F2;
	padding:0.5em 0.3em 0.3em 0.3em;
	margin:0;font-size: 150%;
	text-indent:0.0em;
	font-family:Century;
	text-align: center;
}

.homebox div table{
    width: 100%;
    margin-bottom: 25px;
}

.homebox-title {
    border:0;
    margin:0;
    font-family: inherit;
    font-size: 1.75em;
    line-height: 1.5;
}

.homebox-caption {
    display:block;
    padding: 5px 10px;
    hyphens: auto;
    color: gray;
    font-size: 1em;
    font-style: italic;
    word-wrap: break-word;
}

.homebox-row {
    padding: 5px 10px;
    border-color: #a2a9b1;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    overflow: hidden;
    width: 100%;
    font-size: .85em;
}

.homebox-row h3 {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    flex-basis: 90px;
    hyphens: auto;
    overflow: hidden;
    word-wrap: break-word;
}

.homebox-row-data {
    padding-left:10px;
    flex-grow: 1;
    flex-basis: 200px;
    word-wrap: break-word;
    hyphens: auto;
    word-break: break-word;
}

.linkbox {
    width:350px;
    margin:7px;
}
.linkbox h4 {
	border:0px solid #aaaaa;
	border-top-left-radius:25px;
	border-top-right-radius:25px;
	background-color:#67803F;
	color: #FFF8F2;
	padding:0.5em 0.3em 0.3em 0.3em;
	margin:0;font-size: 150%;
	text-indent:0.0em;
	font-family:Century;
	text-align: center;
}

.linkbox div table{
    width: 100%;
    margin-bottom: 25px;
}

.linkbox-title {
    border:0;
    margin:0;
    font-family: inherit;
    font-size: 1.75em;
    line-height: 1.5;
}

.linkbox-caption {
    display:block;
    padding: 5px 10px;
    hyphens: auto;
    color: gray;
    font-size: 1em;
    font-style: italic;
    word-wrap: break-word;
}

.linkbox-row {
    padding: 5px 10px;
    border-color: #a2a9b1;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    overflow: hidden;
    width: 100%;
    font-size: .85em;
}

.linkbox-row h3 {
    font-size: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    flex-basis: 90px;
    hyphens: auto;
    overflow: hidden;
    word-wrap: break-word;
}

.linkbox-row-data {
    padding-left:10px;
    flex-grow: 1;
    flex-basis: 200px;
    word-wrap: break-word;
    hyphens: auto;
    word-break: break-word;
}