MediaWiki:Vector.css

From Dreamlight Valley 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.
/* All CSS here will be loaded for users of the Vector skin */

/* Body */
body {
    background: url("/resources/dreamlightvalley/background.jpg") no-repeat fixed top center / cover;
    font-family: Josefin Sans, sans-serif;
}

.vector-body {
  font-size: 16px;
}

.mw-body {
  border: 1px solid #2a2f8b;
  margin-right: 15px;
  background-color: #ccceffe8;
  min-height:500px;
  margin-bottom: 60px;
}

div#footer {
  background: rgba(0, 0, 0, 0.8) none repeat scroll 0% 0%;
  width: 100%;
  padding: 0px !important;
  margin-top: 20px !important;
  bottom: 0px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: #C2C8CF;
}

.mw-body h1, .mw-body h2 {
   font-family: 'Josefin Sans',sans-serif;
   font-weight: 500;
}

div#footer #footer-icons {
    margin-top: -18px;
}

div#mw-panel {
   border: 6px solid transparent;
   left: -12px;
   background-color: #ccceffe8;
   padding-bottom: 15px;
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   margin-top: 170px;
}

#p-logo {
   position: absolute;
   top: -170px;
}

#p-logo a {
   display:block;
}

div#footer ul {
  padding-left: 190px;
  padding-right: 15px;
}

.mw-footer li {
  color:#9fa5ff;
}

.mw-footer a {
  color:#c0c3f7;
}

.catlinks {
    border: 1px solid #8f93dd;
    background-color: #ffffff82;
    padding-left: 8px;
}

#toc, .toc {
  background-color: rgba(255,255,255,0.58);
}

div.thumbinner {
   border: 1px solid #8DCAF0;
   background-color: rgba(255,255,255,0.58);
}


/* Mediawiki page tabs */
#mw-page-base {
  background:none;
}

div.vector-menu-tabs div.menu {
  background-color: rgba(30, 17, 102, 0.67);
}

div.vector-menu-tabs div.menu a {
  color: #C6DBFF;
}

#p-personal a, #p-personal a.new, p-personal a:visited, #p-personal a.new:visited {
   color: #99BFFF;
}

#p-personal a.hover, p-personal a:focus {
   color: #C6DBFF;
   text-decoration:none;
}

div#mw-head div.vector-menu-tabs h3, div.vector-menu-tabs ul, div.vector-menu-tabs li.selected, div.vector-menu-tabs ul li, div.vector-menu-tabs, div.vector-menu-tabs span {
    background: none;
}

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

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

/* Account Creation Page */
.mw-createacct-benefits-list {
   padding: 10px 10px 10px 60px;
   border-radius: 12px;
   background-color: rgba(255,255,255,0.58);
   border: 1px solid #8DCAF0;
}

.mw-number-text.icon-edits, .mw-number-text.icon-pages, .mw-number-text.icon-contributors {
   filter: brightness(0.7);
}

.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
    color: #c0c3f7;
}

.vector-menu-tabs li a, .vector-menu-tabs .new a, .vector-menu-tabs .new a:visited {
    color: #9fa5ff;
}

.vector-menu-tabs .new a, .vector-menu-tabs .new a:visited {
    color: #9fa5ff !important;
}

/* Main Page */

body.page-Dreamlight_Valley_Wiki .mw-body .firstHeading {
    display: none;
}

td#main-logo img {
    max-width: 100%;
    height: auto;
}

div#mainbannerleft img, div#narrow-banner img {
   margin-bottom: 70px;
}

div#mainbannerright img {
   margin-bottom: 57px;
}

table#main-menu td {
   vertical-align: top;
}

div.mainmenu-section {
   float: left;
}

div.mainmenu-wrap {
   width: 100%;
}

div#mainmenu-single {
   width: 25%;
}

div#mainmenu-double {
   width: 50%;
}

td#mainpage_menu {
   background-color: transparent;
   border: none;
}

table#main-menu {
   width: 100%;
   margin:0;
}

/* Main Page Menu */

td#mainpage_menu img {
   margin-bottom: 6px;
}

/* Navbox */
#navbox {
   margin:auto;
   width:80%;
   border: 1px solid #2a2f8b;
   padding: 5px; 
   border-radius:11px;
   clear: both;
   margin-top: 15px;
   font-size:88%;
}

#navbox-subtable {
   width: 100%;
   margin-top: 1px;
   margin-bottom: 1px;
}

#navbox-collapse-head {
   background-color: #5c62b8;
   text-align: center;
   border-color: #2a2f8b;
   box-shadow: 0px 1px rgba(0,0,0,0.3);
   color: white;
   text-shadow: 0px 2px black;
   font-size:115%;
}

#navbox-collapse-head a {
   color: white;
}

#navbox-collapse-subhead {
   padding-left: 80px;
}

th#navbox-top {
   font-weight:normal;
}

th#navbox-header {
   font-size:115%;
}

th#navbox-label img {
   margin-top: -7px;
}

#label-width {
   width:175px;
}

th.furniture-disney {
   width: 150px;
}

th.furniture-general {
   width: 95px;
}

th.ingredient-navbox {
   width:125px;
}

/* Table Styling */
table.wikitable {
  background-color: transparent;
  border-collapse: separate;
  border: none;
}

table#overflow {
  display: block;
  overflow: auto;
}

table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
   border: 1px solid #8f93dd;
   padding: 0.2em;
   background-color: #ffffff82;
}

table.wikitable > tr > th, table.wikitable > * > tr > th {
   background-color: #5c62b8;
   text-align: center;
   border-color: #2a2f8b;
   box-shadow: 0px 1px rgba(0,0,0,0.3);
   color: white;
   text-shadow: 0px 2px black;
}

table.wikitable > tr > th a, table.wikitable > * > tr > th a {
   color:white;
}

/* Infobox */
table#infobox {
   float: right;
   min-width: 350px;
   max-width:375px;
   margin-top: 0;
   margin-left: 15px;
}

table#infobox th {
   font-size: 21px;
}

td#infobox-label {
   background-color: #5c62b8;
   border-color: #2a2f8b;
   box-shadow: 0px 1px rgba(0,0,0,0.3);
   color: white;
   text-shadow: 0px 2px black;  
   vertical-align: top;
   min-width: 99px;
}

td#infobox-detail p, table#infobox p {
   margin:0;
}

td#infobox-separator {
   text-align:center;
   background-color: #5c62b8;
   border-color: #2a2f8b;
   box-shadow: 0px 1px rgba(0,0,0,0.3);
   color: white;
   text-shadow: 0px 2px black;  
   vertical-align: top;
}

td#infobox-image {
   text-align: center;
   height: 175px;
}

td#infobox-image p {
   margin: 0.5em 0;
}

div#navbox-stars {
   font-size: 24px;
   margin-top: -7px;
   margin-bottom: -10px;
   text-align: center;
}

div#navbox-stars span {
   color: yellow;
   text-shadow: 0 0px 5px black;
}

#infobox-universe {
    text-align: right;
    background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(142,146,167,1) 25%, rgba(142,146,167,1) 100%, rgba(0,0,0,0) 100%);
    margin: 5px -3px 15px;
    float: right;
    color: white;
    padding: 3px 10px 1px 25px;
    font-size: 14px;
    min-width: 30%;
}

#infobox-universe img {
    margin-bottom: 3px;
}

div#infobox-universe a, div#infobox-universe a.visited, div#infobox-universe a.new, div#infobox-universe a.active  {
    color: white;
}

/* Recipe Table in Articles */
#recipe-table {
   border: 1px solid #2a2f8b;
   padding: 5px; 
   border-radius:11px;
}


/* Templates */

span#nametemplate img {
   margin-top: -7px;
}

span#name-space {
   display:inline-block;
   text-align:center; 
   width:20px;
}

td#time-table-left-text {
   text-align:left;
}

td#time-table-active {
   font-weight: bold;
}

td#time-table-inactive {
   color: #b1b1b1;
}

span#headericon img {
   margin-top: -7px;
   width:29px;
   height: auto;
}

span#headericon a.image {
   pointer-events: none;
   cursor: default;
}

/* Dialogue */

td#dialogue-text {
   font-style: italic;
}

/* Fish Pools */
span#pool-gold {
    font-weight: bold;
    color: #b18303;
}

span#pool-blue {
    font-weight: bold;
    color: #4444f3;
}

span#pool-white {
    font-weight: bold;
    color: white;
    text-shadow: 0 1px 5px black;
}

div#memorygallery {
   margin:auto;
   text-align:center;
}

#brokenmemory {
   margin-top: -169px;
}

div#memorywrap {
   display:inline-grid;
}

div#memorywrap:hover ~ #brokenmemory {
   display: none;
}

table#schedule_table td {
   white-space: nowrap;
}

.itemCount, .dutyVersion, .dutyIcon {
    text-align: center;
}

td#cell_eat {
   background-color: #a6e59f;
   text-align: center;
   font-size: 13px;
}

td#cell_sleep {
   background-color: #aaafff;
   text-align: center;
   font-size: 13px;
}

/* Alert Template */

table.alert {
    margin: auto;
    max-width: 700px;
    background-color: #ffffff7a;
    padding: 5px;
    border-radius: 30px;
    border: solid #2d308d7d;
    box-shadow: 0px 5px 3px #00000030;
}

table.alert img {
    margin: 15px;
}

/* Tag Template */
div.tag-box {
    background: #757cdc;
    display: inline-block;
    border-radius: 8px;
    padding: 3px 8px 0px 8px;
    font-size: 13px;
    color: white;
    font-weight: 500;
    margin: 1px;
}

div.tag-box a, div.tag-box a.visited, div.tag-box a.new {
    color: white;
}

div#tag-room {
    background: #354569;
}

div#tag-collection {
    background: white;
}

div#tag-collection a, div#tag-collection a.visited, div#tag-collection a.new {
    color: #354569;
}

div#ListThumb img {
    max-height:75px;
    width: auto;
}

/* Gallery */

ul.clothesgallery, ul.furnituregallery {
    text-align:center;
    margin: 10px 0;
}

/* Custom Gallery Template */
div#customgallery img {
   display:inline-block;
}

div#customgalleryimg {
   margin:auto; 
   height: 150px; 
   position: relative;
}

div.gallerycorner {
   position:absolute; 
   top: 0px; 
   left: 0px; 
   width: 47px !important; 
   height: 47px; 
   background: linear-gradient(to bottom right, #a1b3f3 50%, transparent 50%); 
   border-top-left-radius: 8px; 
   z-index: 1;
}

div.galleryicon {
   height: 22px;
   width: 22px;
   margin-top: 2px;
   text-align: left;
}

div#gallerypremium {
   background: url("/images/thumb/f/f8/Premium_Shop.png/22px-Premium_Shop.png");
}

div#galleryevent {
   background: url("/images/thumb/3/36/Menu_Icon_Events.png/22px-Menu_Icon_Events.png");
}

div.gallerycorner {
   margin:auto; 
   height: 150px; 
   position: relative;
}

li#customgallerybox {
   width: 155px;
   vertical-align: top;
   display: inline-block;
}

span#galleryhelper {
   display:inline-block;
   height: 100%;
   vertical-align:middle;
}



#narrow-banner {
    display:none;
}

/* Table Autonumbering */

table.autonumber > tbody {
  counter-reset: autonumbering;
}

table.autonumber > tbody > tr::before {
  counter-increment: autonumbering;
  content: counter(autonumbering);
}

table.autonumber > thead > tr::before {
  content: "#";
}

table.autonumber > thead > tr::before, table.autonumber > tbody > tr::before {
  display: table-cell;
  padding: 0.2em;
  border: 1px solid #AAA;
  vertical-align: middle;
  text-align: center;
}

/* Ads Styling */

div#siteNotice {
   font-size:0;
}

div.responsiveadtop_desktop {
   width: 100%;
   text-align: center;
   height: 100%;
   max-height:150px;
   margin: auto;
   background-color: rgb(255 255 255 / 32%);
   margin-top:-10px;
   margin-bottom: 10px;
}

div.responsiveadbottom {
   width: 100%; 
   text-align:center; 
   height: 100%; 
   margin: auto; 
   background-color: rgb(255 255 255 / 12%);
}

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

    #mainbannerright, #mainbannerleft {
        display: none;
    }

    #narrow-banner {
        display:block;
    }
}

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

    #narrow-banner {
        display:none;
    }
}

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

    #navbox {
        width:100%;
    }
}

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

    div#mw-panel {
        display:none;
    }

    .mw-body, #mw-data-after-content {
        margin-left: 15px;
    }
}
Retrieved from "https://dreamlightvalleywiki.com/index.php?title=MediaWiki:Vector.css&oldid=80345"