Difference between revisions of "MediaWiki:Vector.css"

From Ukie
Jump to: navigation, search
 
(2 intermediate revisions by the same user not shown)
Line 2: Line 2:
 
@font-face {
 
@font-face {
 
     font-family: 'FoundersGrotesk';
 
     font-family: 'FoundersGrotesk';
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.eot');
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.eot');
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff2') format('woff2'),
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff') format('woff');
+
         url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Bold.woff') format('woff');
 
     font-weight: 700;
 
     font-weight: 700;
 
     font-style: normal;
 
     font-style: normal;
Line 11: Line 11:
 
@font-face {
 
@font-face {
 
     font-family: 'FoundersGrotesk';
 
     font-family: 'FoundersGrotesk';
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.eot');
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.eot');
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff2') format('woff2'),
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff') format('woff');
+
         url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Semibold.woff') format('woff');
 
     font-weight: 600;
 
     font-weight: 600;
 
     font-style: normal;
 
     font-style: normal;
Line 20: Line 20:
 
@font-face {
 
@font-face {
 
     font-family: 'FoundersGrotesk';
 
     font-family: 'FoundersGrotesk';
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.eot');
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.eot');
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff2') format('woff2'),
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff') format('woff');
+
         url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Medium.woff') format('woff');
 
     font-weight: 500;
 
     font-weight: 500;
 
     font-style: normal;
 
     font-style: normal;
Line 29: Line 29:
 
@font-face {
 
@font-face {
 
     font-family: 'FoundersGrotesk';
 
     font-family: 'FoundersGrotesk';
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.eot');
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.eot');
     src: url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff2') format('woff2'),
+
     src: url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff2') format('woff2'),
         url('/w/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff') format('woff');
+
         url('/resources/assets/FoundersGrotesk/FoundersGroteskWeb-Regular.woff') format('woff');
 
     font-weight: normal;
 
     font-weight: normal;
 
     font-style: normal;
 
     font-style: normal;
Line 38: Line 38:
 
@font-face {
 
@font-face {
 
     font-family: 'radikalblack';
 
     font-family: 'radikalblack';
     src:  url('/w/resources/assets/RadikalBlack/radikal-black.eot');
+
     src:  url('/resources/assets/RadikalBlack/radikal-black.eot');
     src:  url('/w/resources/assets/RadikalBlack/radikal-black.eot?#iefix') format('embedded-opentype'),
+
     src:  url('/resources/assets/RadikalBlack/radikal-black.eot?#iefix') format('embedded-opentype'),
           url('/w/resources/assets/RadikalBlack/radikal-black.woff2') format('woff2'),
+
           url('/resources/assets/RadikalBlack/radikal-black.woff2') format('woff2'),
           url('/w/resources/assets/RadikalBlack/radikal-black.woff') format('woff'),
+
           url('/resources/assets/RadikalBlack/radikal-black.woff') format('woff'),
           url('/w/resources/assets/RadikalBlack/radikal-black.ttf') format('truetype');
+
           url('/resources/assets/RadikalBlack/radikal-black.ttf') format('truetype');
 
}
 
}
 
html{
 
html{
Line 58: Line 58:
 
}
 
}
 
.mw-wiki-logo{
 
.mw-wiki-logo{
     background:url("https://main5.ukie-website-dev.etchplay.com/media/Logos/ukie-logo.png") 0 0 no-repeat transparent;
+
     background:url("/resources/assets/ukiepedia-logo-navy.svg") 0 0 no-repeat transparent;
     background-size:106px 45px;
+
     background-size:360px 180px;
 
     height:90px !important;
 
     height:90px !important;
 
}
 
}
Line 174: Line 174:
 
     margin-left:11em;
 
     margin-left:11em;
 
     margin-top:1em;
 
     margin-top:1em;
 +
    top:0;
 +
    left:0;
 
}
 
}
 
.mw-body-content{
 
.mw-body-content{

Latest revision as of 12:52, 16 September 2019

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

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

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

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

@font-face {
    font-family: 'radikalblack';
    src:  url('/resources/assets/RadikalBlack/radikal-black.eot');
    src:  url('/resources/assets/RadikalBlack/radikal-black.eot?#iefix') format('embedded-opentype'),
          url('/resources/assets/RadikalBlack/radikal-black.woff2') format('woff2'),
          url('/resources/assets/RadikalBlack/radikal-black.woff') format('woff'),
          url('/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("/resources/assets/ukiepedia-logo-navy.svg") 0 0 no-repeat transparent;
    background-size:360px 180px;
    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:-1px !important;
}
#simpleSearch{
    margin-top:0;
    border:0;
    width:auto;
    padding:0;
    height:auto;
    background:none;
}
#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;
    top:0;
    left:0;
}
.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;
}