Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
James Hare (talk | contribs) (Roboto --> Source Sans Pro) |
James Hare (talk | contribs) (Banner image) |
||
Line 59: | Line 59: | ||
#p-logo a { |
#p-logo a { |
||
background-image: url(//upload.wikimedia.org/wikipedia/commons/thumb/d/de/Wikimedia_US_eagle_thing.svg/135px-Wikimedia_US_eagle_thing.svg.png) !important; |
background-image: url(//upload.wikimedia.org/wikipedia/commons/thumb/d/de/Wikimedia_US_eagle_thing.svg/135px-Wikimedia_US_eagle_thing.svg.png) !important; |
||
+ | } |
||
+ | |||
+ | /* Copied from Wikivoyage for scalable-width images */ |
||
+ | |||
+ | @media screen and (max-width:749px) { |
||
+ | .banner-image { |
||
+ | position: relative; |
||
+ | overflow: hidden; |
||
+ | max-width: 1125px; |
||
+ | width: 100%; |
||
+ | height: auto; |
||
+ | margin-bottom: .6em; |
||
+ | text-align: center; |
||
+ | padding-left: 0 !important; |
||
+ | } |
||
+ | .banner-image img { |
||
+ | width: 100%; |
||
+ | height: auto; |
||
+ | width: auto\9; |
||
+ | margin:0 auto; |
||
+ | } |
||
+ | } |
||
+ | |||
+ | @media screen and (min-width:750px) { |
||
+ | .banner-image { |
||
+ | float: right; |
||
+ | position: relative; |
||
+ | overflow: hidden; |
||
+ | max-width: 1125px; |
||
+ | height: auto; |
||
+ | margin-bottom: .6em; |
||
+ | } |
||
+ | .banner-image img { |
||
+ | float: right; |
||
+ | width: 100%; |
||
+ | height: auto; |
||
+ | width: auto\9; |
||
+ | } |
||
+ | .banner-image-left { |
||
+ | float: left !important; |
||
+ | } |
||
+ | .banner-image-left img { |
||
+ | float: left !important; |
||
+ | } |
||
+ | .banner-image-none { |
||
+ | float: none !important; |
||
+ | } |
||
+ | .banner-image-none img { |
||
+ | float: none !important; |
||
+ | } |
||
+ | .banner-image-center { |
||
+ | padding-left: none !important; |
||
+ | float: none !important; |
||
+ | margin-left: auto !important; |
||
+ | margin-right: auto !important; |
||
+ | } |
||
+ | .banner-image-center img { |
||
+ | float: none !important; |
||
+ | } |
||
} |
} |
Revision as of 13:28, 20 May 2015
/* CSS placed here will be applied to all skins */
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700);
/* Typography */
/* Makes site-wide what has been implemented on a page-by-page basis */
.firstHeading {
font-weight:600;
border-bottom: none;
margin-bottom:10px;
padding-top:10px !important;
padding-left:0;
font-size: 2.4em !important;
width:100%;
margin:auto;
border-collapse:collapse;
vertical-align:top;
line-height:100%;
}
body {
font-family:'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
@media screen and (min-width:750px) {
div#bodyContent {
font-size:1.05em; padding:0;
}
p {
margin-bottom:1em;
}
}
/* Main Page Banner */
.banner-image {
position: relative;
overflow: hidden;
max-width: 65em;
width: 100%;
height: auto;
margin-bottom: .6em;
text-align: center;
padding-left: 0 !important;
}
.banner-image img {
width: 100%;
height: auto;
width: auto\9;
margin:0 auto;
}
.page-2015_Main_Page #firstHeading, .page-2015_Main_Page #yearline {
display: none;
}
/* This is totally the right way to change the site logo. */
#p-logo a {
background-image: url(//upload.wikimedia.org/wikipedia/commons/thumb/d/de/Wikimedia_US_eagle_thing.svg/135px-Wikimedia_US_eagle_thing.svg.png) !important;
}
/* Copied from Wikivoyage for scalable-width images */
@media screen and (max-width:749px) {
.banner-image {
position: relative;
overflow: hidden;
max-width: 1125px;
width: 100%;
height: auto;
margin-bottom: .6em;
text-align: center;
padding-left: 0 !important;
}
.banner-image img {
width: 100%;
height: auto;
width: auto\9;
margin:0 auto;
}
}
@media screen and (min-width:750px) {
.banner-image {
float: right;
position: relative;
overflow: hidden;
max-width: 1125px;
height: auto;
margin-bottom: .6em;
}
.banner-image img {
float: right;
width: 100%;
height: auto;
width: auto\9;
}
.banner-image-left {
float: left !important;
}
.banner-image-left img {
float: left !important;
}
.banner-image-none {
float: none !important;
}
.banner-image-none img {
float: none !important;
}
.banner-image-center {
padding-left: none !important;
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
}
.banner-image-center img {
float: none !important;
}
}