MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
Totengeist (talk | contribs) (Add Font Awesome social media icon styling) |
Totengeist (talk | contribs) m (Fix non-FontAwesome logos on Main_Page) |
||
(13 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
.social { | .social a, .social a:visited { | ||
font-size: | font-size: 2.3em !important; | ||
color: #000 !important; | |||
background-image: none !important; | |||
background-position: initial !important; | |||
background-repeat: no-repeat !important; | |||
padding-right: inherit !important; | |||
} | |||
.social a img{ | |||
border-bottom: 6px solid white; | |||
} | |||
kbd { | |||
display: inline-block; | |||
margin: 0 .1em; | |||
padding: .1em .6em; | |||
color: #232629; | |||
text-shadow: 0 1px 0 #ffffff; | |||
background-color: #e3e6e8; | |||
border: 1px solid #9fa6ad; | |||
border-radius: 3px; | |||
box-shadow: 0 1px 1px #0c0d0e26, inset 0 1px 0 0 #ffffff; | |||
overflow-wrap: break-word; | |||
} | |||
.main-container { | |||
display:grid; | |||
grid-template-areas: 'content content content content content news' 'guides guides guides guides guides news' 'social social social social social news' | |||
} | |||
.main-news { | |||
grid-area: news; | |||
border: 1px solid black; | |||
padding: 0.5em; | |||
min-width: 25em; | |||
} | |||
.main-content { | |||
grid-area: content; | |||
padding: 0.5em; | |||
} | |||
#main-guides { | |||
grid-area: guides; | |||
display: flex; | |||
border: 1px solid #1b4f72; | |||
margin-right: 0.5em; | |||
} | |||
#main-guides .column { | |||
flex-grow: 1; | |||
padding: 0.5em; | |||
border: 1px solid #1b4f72; | |||
} | |||
#main-guides .header { | |||
font-weight: bold; | |||
background-color: #1b4f72; | |||
color: #fff; | |||
padding: 0 0.5em; | |||
margin: -0.5em -0.5em 0; | |||
} | |||
#main-guides .header a { | |||
color: #fff; | |||
} | } | ||
.social | .main-social { | ||
color: # | grid-area: social; | ||
padding: 0.5em; | |||
} | |||
/* Infobox template style */ | |||
.infobox { | |||
border: 1px solid #a2a9b1; | |||
border-spacing: 3px; | |||
background-color: #f8f9fa; | |||
color: black; | |||
/* @noflip */ | |||
margin: 0.5em 0 0.5em 1em; | |||
padding: 0.2em; | |||
/* @noflip */ | |||
float: right; | |||
/* @noflip */ | |||
clear: right; | |||
font-size: 88%; | |||
line-height: 1.5em; | |||
width: 22em; | |||
} | |||
.infobox-header, | |||
.infobox-label, | |||
.infobox-above, | |||
.infobox-full-data, | |||
.infobox-data, | |||
.infobox-below, | |||
.infobox-subheader, | |||
.infobox-image, | |||
.infobox-navbar, | |||
/* Remove element selector when every .infobox thing is using the standard module/templates */ | |||
.infobox th, | |||
.infobox td { | |||
vertical-align: top; | |||
} | |||
.infobox-label, | |||
.infobox-data, | |||
/* Remove element selector when every .infobox thing is using the standard module/templates */ | |||
.infobox th, | |||
.infobox td { | |||
/* @noflip */ | |||
text-align: left; | |||
} | |||
/* Remove .infobox when element selectors above are removed */ | |||
.infobox .infobox-above, | |||
.infobox .infobox-title, | |||
/* Remove element selector when every .infobox thing is using the standard module/templates */ | |||
.infobox caption { | |||
font-size: 125%; | |||
font-weight: bold; | |||
text-align: center; | |||
} | |||
.infobox-title, | |||
/* Remove element selector when every .infobox thing is using the standard module/templates */ | |||
.infobox caption { | |||
padding: 0.2em; | |||
} | |||
/* Remove .infobox when element selectors above are removed */ | |||
.infobox .infobox-header, | |||
.infobox .infobox-subheader, | |||
.infobox .infobox-image, | |||
.infobox .infobox-full-data, | |||
.infobox .infobox-below { | |||
text-align: center; | |||
} | |||
/* Remove .infobox when element selectors above are removed */ | |||
.infobox .infobox-navbar { | |||
/* @noflip */ | |||
text-align: right; | |||
} | } |
Latest revision as of 11:44, 15 February 2023
/* CSS placed here will be applied to all skins */ .social a, .social a:visited { font-size: 2.3em !important; color: #000 !important; background-image: none !important; background-position: initial !important; background-repeat: no-repeat !important; padding-right: inherit !important; } .social a img{ border-bottom: 6px solid white; } kbd { display: inline-block; margin: 0 .1em; padding: .1em .6em; color: #232629; text-shadow: 0 1px 0 #ffffff; background-color: #e3e6e8; border: 1px solid #9fa6ad; border-radius: 3px; box-shadow: 0 1px 1px #0c0d0e26, inset 0 1px 0 0 #ffffff; overflow-wrap: break-word; } .main-container { display:grid; grid-template-areas: 'content content content content content news' 'guides guides guides guides guides news' 'social social social social social news' } .main-news { grid-area: news; border: 1px solid black; padding: 0.5em; min-width: 25em; } .main-content { grid-area: content; padding: 0.5em; } #main-guides { grid-area: guides; display: flex; border: 1px solid #1b4f72; margin-right: 0.5em; } #main-guides .column { flex-grow: 1; padding: 0.5em; border: 1px solid #1b4f72; } #main-guides .header { font-weight: bold; background-color: #1b4f72; color: #fff; padding: 0 0.5em; margin: -0.5em -0.5em 0; } #main-guides .header a { color: #fff; } .main-social { grid-area: social; padding: 0.5em; } /* Infobox template style */ .infobox { border: 1px solid #a2a9b1; border-spacing: 3px; background-color: #f8f9fa; color: black; /* @noflip */ margin: 0.5em 0 0.5em 1em; padding: 0.2em; /* @noflip */ float: right; /* @noflip */ clear: right; font-size: 88%; line-height: 1.5em; width: 22em; } .infobox-header, .infobox-label, .infobox-above, .infobox-full-data, .infobox-data, .infobox-below, .infobox-subheader, .infobox-image, .infobox-navbar, /* Remove element selector when every .infobox thing is using the standard module/templates */ .infobox th, .infobox td { vertical-align: top; } .infobox-label, .infobox-data, /* Remove element selector when every .infobox thing is using the standard module/templates */ .infobox th, .infobox td { /* @noflip */ text-align: left; } /* Remove .infobox when element selectors above are removed */ .infobox .infobox-above, .infobox .infobox-title, /* Remove element selector when every .infobox thing is using the standard module/templates */ .infobox caption { font-size: 125%; font-weight: bold; text-align: center; } .infobox-title, /* Remove element selector when every .infobox thing is using the standard module/templates */ .infobox caption { padding: 0.2em; } /* Remove .infobox when element selectors above are removed */ .infobox .infobox-header, .infobox .infobox-subheader, .infobox .infobox-image, .infobox .infobox-full-data, .infobox .infobox-below { text-align: center; } /* Remove .infobox when element selectors above are removed */ .infobox .infobox-navbar { /* @noflip */ text-align: right; }