Difference between revisions of "MediaWiki:Vector.css"

From Ukie
Jump to: navigation, search
(Created page with "CSS placed here will be applied to all skins: @font-face { font-family: 'FoundersGrotesk'; src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.e...")
 
Line 90: Line 90:
 
}
 
}
 
.vectorTabs{
 
.vectorTabs{
     height:1.9em;
+
     height:1.9em !important;
     background:none;
+
     background:none !important;
     position:relative;
+
     position:relative !important;
 
}
 
}
 
.vectorTabs:before{
 
.vectorTabs:before{
     content:" ";
+
     content:" " !important;
     position:absolute;
+
     position:absolute !important;
     top:0;
+
     top:0 !important;
     left:0;
+
     left:0 !important;
     height:2em;
+
     height:2em !important;
     width:1px;
+
     width:1px !important;
     background:#a7d7f9;
+
     background:#a7d7f9 !important;
 
}
 
}
 
.vectorTabs li{
 
.vectorTabs li{
     background:#f5f5f5;
+
     background:#f5f5f5 !important;
     border-top:1px solid #a7d7f9;
+
     border-top:1px solid #a7d7f9 !important;
     border-right:1px solid #a7d7f9;
+
     border-right:1px solid #a7d7f9 !important;
 
}
 
}
 
.vectorTabs li.selected{
 
.vectorTabs li.selected{
     background:white;
+
     background:white !important;
 
}
 
}
 
.vectorTabs span{
 
.vectorTabs span{
     background:none;
+
     background:none !important;
     border-bottom:1px solid #a7d7f9;
+
     border-bottom:1px solid #a7d7f9 !important;
 
}
 
}
 
.vectorTabs li.selected span{
 
.vectorTabs li.selected span{
     border-bottom-color:#ffffff;
+
     border-bottom-color:#ffffff !important;
 
}
 
}
 
.vectorTabs span a{
 
.vectorTabs span a{
     padding-top:0.5em;
+
     padding-top:0.5em !important;
 
}
 
}
 
.vectorTabs #ca-unwatch.icon a, .vectorTabs #ca-watch.icon a{
 
.vectorTabs #ca-unwatch.icon a, .vectorTabs #ca-watch.icon a{
     padding-top:2.1em;
+
     padding-top:2.1em !important;
 
}
 
}
 
#mw-head .vectorMenu h3{
 
#mw-head .vectorMenu h3{
     height:2em;
+
     height:2em !important;
     background:none;
+
     background:none !important;
 
}
 
}
 
.vectorMenu h3 span{
 
.vectorMenu h3 span{
     padding-top:0.5em;
+
     padding-top:0.5em !important;
 
}
 
}
 
.vectorMenu h3 span:after{
 
.vectorMenu h3 span:after{
     top:0.5em;
+
     top:0.5em !important;
 
}
 
}
 
.vectorMenu .menu{
 
.vectorMenu .menu{
     top:2em;
+
     top:2em !important;
 
}
 
}
 
#p-search form{
 
#p-search form{
     margin-top:-2px;
+
     margin-top:-2px !important;
 
}
 
}
 
#simpleSearch input[type="search"]{
 
#simpleSearch input[type="search"]{
     padding-bottom: 10px;
+
     padding-bottom: 10px !important;
     padding-bottom: 1rem;
+
     padding-bottom: 1rem !important;
     padding-left: 15px;
+
     padding-left: 15px !important;
     padding-left: 1.5rem;
+
     padding-left: 1.5rem !important;
     padding-right: 15px;
+
     padding-right: 15px !important;
     padding-right: 1.5rem;
+
     padding-right: 1.5rem !important;
     padding-top: 10px;
+
     padding-top: 10px !important;
     padding-top: 1rem;
+
     padding-top: 1rem !important;
     width: 100%;
+
     width: 100% !important;
     max-width: 100%;
+
     max-width: 100% !important;
     border: 1px solid #c6cfd9;
+
     border: 1px solid #c6cfd9 !important;
     border-radius: 4px;
+
     border-radius: 4px !important;
     box-sizing: border-box;
+
     box-sizing: border-box !important;
     outline: none;
+
     outline: none !important;
     background:#ffffff;
+
     background:#ffffff !important;
     border-bottom-left-radius:0;
+
     border-bottom-left-radius:0 !important;
     border-bottom-right-radius:0;
+
     border-bottom-right-radius:0 !important;
 
}
 
}
 
#searchButton, #mw-searchButton{
 
#searchButton, #mw-searchButton{
     min-width:36px;
+
     min-width:36px !important;
 
}
 
}
 
.mw-backlink{
 
.mw-backlink{
Line 171: Line 171:
 
}
 
}
 
#mw-panel .portal h3{
 
#mw-panel .portal h3{
     font-size: 1.17em;
+
     font-size: 1.17em !important;
     font-weight: bold;
+
     font-weight: bold !important;
     margin-left:0.5em;
+
     margin-left:0.5em !important;
     color:#222147;
+
     color:#222147 !important;
 
}
 
}
 
#mw-panel .portal .body{
 
#mw-panel .portal .body{
     background:none;
+
     background:none !important;
 
}
 
}
 
#mw-panel .portal .body li{
 
#mw-panel .portal .body li{
     font-size:1em;
+
     font-size:1em !important;
 
}
 
}
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button{
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button{
     background-color: #ffffff;
+
     background-color: #ffffff !important;
     display: inline-block;
+
     display: inline-block !important;
     padding: 1.2rem 4rem 1.3rem;
+
     padding: 1.2rem 4rem 1.3rem !important;
     border-width: 1px;
+
     border-width: 1px !important;
     border-style: solid;
+
     border-style: solid !important;
     border-color: #222147;
+
     border-color: #222147 !important;
     border-radius: .5rem;
+
     border-radius: .5rem !important;
     color: #fff;
+
     color: #fff !important;
     cursor: pointer;
+
     cursor: pointer !important;
     text-decoration: none;
+
     text-decoration: none !important;
     transition-property: background-color,border-color;
+
     transition-property: background-color,border-color !important;
     transition-duration: .5s;
+
     transition-duration: .5s !important;
     outline: none;
+
     outline: none !important;
     font-weight:normal;
+
     font-weight:normal !important;
     color:#222147;
+
     color:#222147 !important;
 
}
 
}
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button{
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button{
     background:#222147;
+
     background:#222147 !important;
     color:#ffffff;
+
     color:#ffffff !important;
 
}
 
}
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
 
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
     background-color: #80a2fc;
+
     background-color: #80a2fc !important;
     border-color: #80a2fc;
+
     border-color: #80a2fc !important;
     color:#ffffff;
+
     color:#ffffff !important;
 
}
 
}

Revision as of 09:56, 16 September 2019

/* CSS placed here will be applied to all skins */
@font-face {
    font-family: 'FoundersGrotesk';
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.eot');
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'FoundersGrotesk';
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.eot');
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'FoundersGrotesk';
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.eot');
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'FoundersGrotesk';
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.eot');
    src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'radikalblack';
    src:  url('/w/resources/assets/RadikalBlack/radikal-black.eot');
    src:  url('/w/resources/assets/RadikalBlack/radikal-black.eot?#iefix') format('embedded-opentype'),
          url('/w/resources/assets/RadikalBlack/radikal-black.woff2') format('woff2'),
          url('/w/resources/assets/RadikalBlack/radikal-black.woff') format('woff'),
          url('/w/resources/assets/RadikalBlack/radikal-black.ttf') format('truetype');
}
html{
    font-size:62.5%;
}
body{
    background-color:#eeeeee;
    color:#222147;
    font-family: "FoundersGrotesk";
    font-size: 1.8em;
    line-height: 2.7rem;
}
#mw-page-base{
    background:#eeeeee;
}
.mw-wiki-logo{
    background:url("https://main5.ukie-website-dev.etchplay.com/media/Logos/ukie-logo.png") 0 0 no-repeat transparent;
    background-size:106px 45px;
    height:90px !important;
}
#p-logo{
    height:90px;
}
.mw-body h1, .mw-body-content h1{
    font-size:4rem;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: -1px;
    margin: 0.67em 0;
    font-family:"FoundersGrotesk";
}
.mw-body .firstHeading{
    margin-top:0;
}
.mw-body h2, .mw-body-content h2{
    font-family: "radikalblack",sans-serif;
    font-weight: 900;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.69px;
    text-transform:uppercase;
}
#left-navigation, #right-navigation{
    margin-top:3em;
}
.vectorTabs{
    height:1.9em !important;
    background:none !important;
    position:relative !important;
}
.vectorTabs:before{
    content:" " !important;
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    height:2em !important;
    width:1px !important;
    background:#a7d7f9 !important;
}
.vectorTabs li{
    background:#f5f5f5 !important;
    border-top:1px solid #a7d7f9 !important;
    border-right:1px solid #a7d7f9 !important;
}
.vectorTabs li.selected{
    background:white !important;
}
.vectorTabs span{
    background:none !important;
    border-bottom:1px solid #a7d7f9 !important;
}
.vectorTabs li.selected span{
    border-bottom-color:#ffffff !important;
}
.vectorTabs span a{
    padding-top:0.5em !important;
}
.vectorTabs #ca-unwatch.icon a, .vectorTabs #ca-watch.icon a{
    padding-top:2.1em !important;
}
#mw-head .vectorMenu h3{
    height:2em !important;
    background:none !important;
}
.vectorMenu h3 span{
    padding-top:0.5em !important;
}
.vectorMenu h3 span:after{
    top:0.5em !important;
}
.vectorMenu .menu{
    top:2em !important;
}
#p-search form{
    margin-top:-2px !important;
}
#simpleSearch input[type="search"]{
    padding-bottom: 10px !important;
    padding-bottom: 1rem !important;
    padding-left: 15px !important;
    padding-left: 1.5rem !important;
    padding-right: 15px !important;
    padding-right: 1.5rem !important;
    padding-top: 10px !important;
    padding-top: 1rem !important;
    width: 100% !important;
    max-width: 100% !important;
    border: 1px solid #c6cfd9 !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
    outline: none !important;
    background:#ffffff !important;
    border-bottom-left-radius:0 !important;
    border-bottom-right-radius:0 !important;
}
#searchButton, #mw-searchButton{
    min-width:36px !important;
}
.mw-backlink{
    position:absolute;
    margin-left:11em;
    margin-top:1em;
}
.mw-body-content{
    font-size:1em;
}
#mw-panel .portal h3{
    font-size: 1.17em !important;
    font-weight: bold !important;
    margin-left:0.5em !important;
    color:#222147 !important;
}
#mw-panel .portal .body{
    background:none !important;
}
#mw-panel .portal .body li{
    font-size:1em !important;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button{
    background-color: #ffffff !important;
    display: inline-block !important;
    padding: 1.2rem 4rem 1.3rem !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: #222147 !important;
    border-radius: .5rem !important;
    color: #fff !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition-property: background-color,border-color !important;
    transition-duration: .5s !important;
    outline: none !important;
    font-weight:normal !important;
    color:#222147 !important;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button{
    background:#222147 !important;
    color:#ffffff !important;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
    background-color: #80a2fc !important;
    border-color: #80a2fc !important;
    color:#ffffff !important;
}