Difference between revisions of "MediaWiki:Vector.css"

From Animal Crossing Mods Wiki
(changing search appearance and sidebar headers)
(chaning vector tab margins)
Line 3: Line 3:
/* Main body adjustments */
/* Main body adjustments */
.mw-wiki-logo {
.mw-wiki-logo {
    background-image: url(/images/logos/acmods.png?9a2e7);
     background-size: 150px;
     background-size: 150px;
}
}
Line 31: Line 30:
     background-image: none;
     background-image: none;
border-radius: 5em;
border-radius: 5em;
margin: -4px 1px 0 -9px;
margin: -4px 1px 0 0;
line-height: 0.7em;
line-height: 0.7em;
}
}
#left-navigation {
#left-navigation {
     margin-left: 11.5em !important;
     margin-left: 11.5em !important;
}
}
.vector-menu-tabs, .vector-menu-tabs .selected, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3  {
.vector-menu-tabs, .vector-menu-tabs .selected, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3  {
     background: none;
     background: none;
}
}
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
     color: #F39802;
     color: #F39802;
}
}
.vector-menu-tabs li a, .vector-menu-dropdown h3 {
.vector-menu-tabs li a, .vector-menu-dropdown h3 {
     color: #53524D;
     color: #53524D;

Revision as of 04:44, 22 September 2021

/* All CSS here will be loaded for users of the Vector skin */

/* Main body adjustments */
.mw-wiki-logo {
    background-size: 150px;
}

body {
    background: url(https://acmods.org/images/7/7e/ACMods_Background.png);
    font-family: 'Open Sans',sans-serif !important;
    background-size: 350px;
}

#mw-page-base {
    background: transparent !important;
}

.mw-body {
	background-color: #ECE6CC;
    margin-top: -1px;
    border: none;
    border-right-width: 0;
    box-shadow: 0 0.22em 0.9em 0.1em #805216;
    border-radius: 2em;
}

/* Vector tabs */
.vector-menu-tabs li, .vector-menu-dropdown, .vector-menu-tabs li.selected {
    background: #F6F6DF;
    background-image: none;
	border-radius: 5em;
	margin: -4px 1px 0 0;
	line-height: 0.7em;
}
#left-navigation {
    margin-left: 11.5em !important;
}
.vector-menu-tabs, .vector-menu-tabs .selected, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3  {
    background: none;
}
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
    color: #F39802;
}
.vector-menu-tabs li a, .vector-menu-dropdown h3 {
    color: #53524D;
}

/* Sidebar changes */
.vector-menu-portal h3 {
    font-weight: normal;
    font-size: 1em;
    background-color: #805216;
    justify-content: center;
    display: flex;
    text-align: center;
    transition: color 0.3s,background-color 0.3s;
    box-sizing: inherit;
    color: #fff !important;
    margin: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10em;
    font-family: 'Varela Round',sans-serif;
    margin-top: 1em;
    box-shadow: rgb(89, 75, 62) 0px 3px 0px 0px;
    margin-bottom: 5px;
    border-bottom: none;
    background-image: none;
}
.vector-menu-portal .vector-menu-content ul {
    list-style: none none;
    margin: 0;
    padding-top: 0.3em;
    font-family: 'Varela Round',sans-serif;
}

/* Search appearance */
#searchInput {
    background-color: #fdfbe6;
    color: #7c7056;
    border-radius: 2em;
    font-family: 'Varela Round',sans-serif;
    border: none;
}

/* Text headers */
h1, h2 {
    border-bottom: 2px dashed #805216;
}

.mw-body h1, .mw-body-content h1, .mw-body-content h2 {
    margin-bottom: 0.25em;
    padding: 0;
    font-family: 'Varela Round',sans-serif;
    line-height: 1.3;
    color: #805216;
}

/* Categories */
.catlinks {
    background-color: #E7E0C3;
    border-radius: 5em;
}

/* Prefernces & button stylizing */
.mw-prefs-buttons {
    background-color: #ECE6CC;
}
.oo-ui-buttonElement-framed.oo-ui-labelElement > .oo-ui-buttonElement-button, button {
    padding: 0.35em 1em;
    border-radius: 5em;
    font-family: 'Varela Round', sans-serif !important;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
    color: #fff;
    background-color: #03B2AB;
    border-color: #03B2AB;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
    color: #fff;
    background-color: #216663;
    border-color: #216663;
    box-shadow: none;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
    background-color: #0D9B95;
    border-color: #0D9B95;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
    border-color: #03B2AB;
    box-shadow: inset 0 0 0 1px #03B2AB,inset 0 0 0 2px #fff;
    outline: 1px solid transparent;
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
    background-color: #f5f7e1;
    color: #f49800;
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
    background-color: #fff;
    color: #f49800;
    border-radius: 5em;
}
.oo-ui-tabSelectWidget-framed {
    background-color: #f5f7e1;
    font-family: 'Varela Round', sans-serif !important;
    border-radius: 5em;
}
.oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
    line-height: 1.42857143em;
    font-family: 'Varela Round', sans-serif !important;
}
.mw-prefs-tabs-wrapper.oo-ui-panelLayout-framed, .mw-prefs-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout {
    border-color: transparent;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
    color: #FF4548;
    background-color: #D4CA82;
    border-radius: 5em;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
    color: #FF4548;
    background-color: #FFFDED;
}