Difference between revisions of "MediaWiki:Common.css"
From Twinsuniverse
J McKalling (Talk | contribs) m |
J McKalling (Talk | contribs) (fixed some pixel-perfect aligning in infobox cells) |
||
(230 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 */ | ||
+ | |||
+ | /* CATEGORY TREE */ | ||
+ | #mw-subcategories ul | ||
+ | { | ||
+ | list-style-type: none; | ||
+ | } | ||
+ | #mw-subcategories ul li | ||
+ | { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | /* LAST UPDATE */ | ||
+ | table.lastupdate | ||
+ | { | ||
+ | border-radius: 18px; -moz-border-radius: 18px; | ||
+ | background: lightblue; | ||
+ | margin: 12px auto; | ||
+ | width: 70%; | ||
+ | } | ||
+ | table.lastupdate td.lastupdate-left | ||
+ | { | ||
+ | padding: 10px; | ||
+ | width: 240px; | ||
+ | text-align: center; | ||
+ | } | ||
+ | table.lastupdate td.lastupdate-right | ||
+ | { | ||
+ | border: solid 10px lightblue; | ||
+ | border-radius: 18px; -moz-border-radius: 18px; | ||
+ | background: #ffffff; | ||
+ | padding: 12px; | ||
+ | } | ||
+ | |||
+ | /* MAIN-NAVIGATOR */ | ||
+ | table.mainnavigator | ||
+ | { | ||
+ | border-spacing: 10px; | ||
+ | margin: auto; | ||
+ | } | ||
/* INFOBOX */ | /* INFOBOX */ | ||
table.infobox | table.infobox | ||
{ | { | ||
− | border: solid | + | border: solid 2px; border-spacing: 4px; |
− | + | border-radius: 12px; -moz-border-radius: 12px; | |
− | + | padding: 0px; | |
− | + | min-width: 240px; | |
− | + | ||
− | + | ||
text-align: left; | text-align: left; | ||
− | |||
} | } | ||
table.infobox th | table.infobox th | ||
{ | { | ||
− | border: solid 2px | + | border: solid 2px; |
− | + | border-radius: 8px 0px 0px 8px; -moz-border-radius: 8px 0px 0px 8px; | |
− | + | ||
margin: 0px; | margin: 0px; | ||
− | + | padding: 2px 6px; | |
text-align: right; | text-align: right; | ||
vertical-align: bottom; | vertical-align: bottom; | ||
+ | line-height: 20px; | ||
white-space: nowrap; | white-space: nowrap; | ||
} | } | ||
table.infobox th.title | table.infobox th.title | ||
{ | { | ||
− | border: | + | border-radius: 8px; -moz-border-radius: 8px; |
− | + | background-position: 2px center; background-repeat: no-repeat; | |
− | background- | + | padding: 6px 36px; |
− | + | ||
− | + | ||
− | + | ||
text-align: center; | text-align: center; | ||
− | + | font-size: 130%; | |
− | font-size: | + | font-weight: bold; |
− | font- | + | |
} | } | ||
− | table.infobox th. | + | table.infobox th.subtitle |
{ | { | ||
− | border: | + | border-radius: 8px; -moz-border-radius: 8px; |
− | + | padding: 6px; | |
text-align: center; | text-align: center; | ||
font-size: 110%; | font-size: 110%; | ||
+ | font-weight: bold; | ||
} | } | ||
− | table.infobox td | + | table.infobox th.heading |
+ | { | ||
+ | border-width: 0px 0px 2px; | ||
+ | border-radius: 0px; -moz-border-radius: 0px; | ||
+ | text-align: left; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | table.infobox td, | ||
+ | table.infobox td.data | ||
{ | { | ||
− | |||
− | |||
− | |||
margin: 0px; | margin: 0px; | ||
+ | padding: 2px; | ||
+ | } | ||
+ | table.infobox td.data | ||
+ | { | ||
+ | border: solid 0px; border-bottom: solid 2px; | ||
+ | height: 24px; | ||
+ | line-height: 20px; | ||
+ | text-align: left; | ||
vertical-align: bottom; | vertical-align: bottom; | ||
} | } | ||
− | table.infobox td p, | + | table.infobox td.image |
− | table.infobox td sup | + | { |
+ | border: solid 0px; | ||
+ | text-align: center; | ||
+ | } | ||
+ | table.infobox td.data p, | ||
+ | table.infobox td.data sup | ||
{ | { | ||
− | |||
margin: 0px; | margin: 0px; | ||
+ | padding: 0px; | ||
} | } | ||
+ | |||
+ | /* INFOBOX SIDE */ | ||
+ | table.infobox.side | ||
+ | { | ||
+ | margin: 0px 0px 10px 10px; | ||
+ | float: right; clear: both; | ||
+ | } | ||
+ | |||
+ | /* INFOBOX DEFAULT THEME */ | ||
+ | table.infobox, | ||
+ | table.infobox th, | ||
+ | table.infobox td.data { border-color: #cccccc; } | ||
+ | table.infobox th { background-color: #ccccff; color: #000000; } | ||
+ | table.infobox, | ||
+ | table.infobox th.heading { background-color: #ffffff; } | ||
+ | |||
+ | /* INFOBOX THEME ICONS */ | ||
+ | table.infobox th.theme-icon-grey { background-image: url("/images/6/6e/Orb_grey30.png"); } | ||
+ | table.infobox th.theme-icon-green { background-image: url("/images/d/da/Orb_green30.png"); } | ||
+ | table.infobox th.theme-icon-red { background-image: url("/images/f/f8/Orb_red30.png"); } | ||
+ | table.infobox th.theme-icon-pink { background-image: url("/images/f/f8/Orb_pink30.png"); } | ||
+ | table.infobox th.theme-icon-yellow { background-image: url("/images/e/e4/Orb_yellow30.png"); } | ||
+ | table.infobox th.theme-icon-cyan { background-image: url("/images/6/6f/Orb_cyan30.png"); } | ||
+ | table.infobox th.theme-icon-blue { background-image: url("/images/7/7b/Orb_navy30.png"); } | ||
+ | table.infobox th.theme-icon-orange { background-image: url("/images/e/e4/Orb_yellow30.png"); } | ||
+ | table.infobox th.theme-icon-purple { background-image: url("/images/6/61/Orb_purple30.png"); } | ||
+ | table.infobox th.theme-icon-dblue { background-image: url("/images/7/7b/Orb_navy30.png"); } | ||
+ | table.infobox th.theme-icon-navy { background-image: url("/images/7/7b/Orb_navy30.png"); } | ||
+ | table.infobox th.theme-icon-sand { background-image: url("/images/e/e4/Orb_yellow30.png"); } | ||
+ | |||
+ | /* ARTICLE LINK */ | ||
+ | span.articlelink.planet a | ||
+ | { | ||
+ | background: transparent no-repeat; background-position: left center; | ||
+ | padding-left: 16px; | ||
+ | font-weight: bold; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | span.articlelink.island a | ||
+ | { | ||
+ | background: transparent; | ||
+ | font-weight: bold; | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | |||
+ | /* ARTICLE LINK THEMES */ | ||
+ | span.articlelink.island.twinsun a, | ||
+ | span.articlelink.planet.twinsun a { color: royalblue; } | ||
+ | span.articlelink.planet.twinsun a { background-image: url("/images/d/d3/Twinsun_icon.gif"); } | ||
+ | |||
+ | span.articlelink.island.moon a, | ||
+ | span.articlelink.planet.moon a { color: seagreen; } | ||
+ | span.articlelink.planet.moon a { background-image: url("/images/6/60/Moon_icon.gif"); padding-left: 17px; } | ||
+ | |||
+ | span.articlelink.island.zeelich a, | ||
+ | span.articlelink.planet.zeelich a { color: sienna; } | ||
+ | span.articlelink.planet.zeelich a { background-image: url("/images/1/16/Zeelich_icon.gif"); padding-left: 18px; } | ||
+ | |||
+ | span.articlelink.island.undergas a, | ||
+ | span.articlelink.planet.undergas a { color: darkred; } | ||
+ | span.articlelink.planet.undergas a { background-image: url("/images/1/16/Zeelich_icon.gif"); padding-left: 18px; } | ||
+ | |||
+ | /* QUOTE */ | ||
+ | table.quote | ||
+ | { | ||
+ | border: solid 0px; | ||
+ | max-width: 70%; | ||
+ | } | ||
+ | table.quote td.quote-open | ||
+ | { | ||
+ | border: solid #b2b7f2; border-width: 2px 0px 0px 2px; | ||
+ | border-top-left-radius: 10px; | ||
+ | background-color: #ebeff3; | ||
+ | color: #b2b7f2; | ||
+ | width: 20px; | ||
+ | text-align: left; | ||
+ | vertical-align: top; | ||
+ | font-family: 'Times New Roman', serif; | ||
+ | font-size: 36px; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | table.quote td.quote-close | ||
+ | { | ||
+ | border-top: solid 2px #b2b7f2; border-right: solid 2px #4c615d; | ||
+ | border-top-right-radius: 10px; | ||
+ | background-color: #ebeff3; | ||
+ | color: #b2b7f2; | ||
+ | padding-bottom: 0px; | ||
+ | width: 20px; | ||
+ | text-align: right; | ||
+ | vertical-align: bottom; | ||
+ | font-family: 'Times New Roman', serif; | ||
+ | font-size: 36px; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | table.quote td.quote-body | ||
+ | { | ||
+ | border-top: solid 2px #b2b7f2; | ||
+ | background-color: #ebeff3; | ||
+ | padding: 4px 0px 0px; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | table.quote td.quote-cite | ||
+ | { | ||
+ | border: solid 2px #4c615d; border-top-width: 0px; border-left-color: #b2b7f2; | ||
+ | border-radius: 0px 0px 10px 10px; | ||
+ | padding-top: 0px; | ||
+ | padding-bottom: 4px; | ||
+ | font-weight: bold; | ||
+ | font-style: italic; | ||
+ | } | ||
+ | |||
+ | /* MESSAGE BOX */ | ||
+ | table.mbox | ||
+ | { | ||
+ | border: solid 1px #000000; border-collapse: collapse; | ||
+ | color: #000000; | ||
+ | margin: 4px auto; | ||
+ | padding: 0px 1em; | ||
+ | max-width: 75%; | ||
+ | } | ||
+ | table.mbox td | ||
+ | { | ||
+ | padding: 5px 10px; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | table.mbox td:first-child | ||
+ | { | ||
+ | background: transparent no-repeat center; | ||
+ | width: 50px; | ||
+ | line-height: 40px; | ||
+ | text-align: center; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | table.mbox td p, | ||
+ | table.mbox td ul | ||
+ | { | ||
+ | margin-top: 6px; | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | /* MESSAGE BOX THEMES */ | ||
+ | table.mbox.cleanup { border-color: #d1b11b; background-color: #f8f0c7; } | ||
+ | table.mbox.cleanup td:first-child { background-image: url("/images/1/1b/40px-Edit-clear.svg.png"); } | ||
+ | |||
+ | table.mbox.content { border-color: #ff8005; background-color: #ffe0c1; } | ||
+ | table.mbox.content td:first-child { background-image: url("/images/3/38/Imbox_content.png"); } | ||
+ | |||
+ | table.mbox.move { border-color: #b700b7; background-color: #ffe1ff; } | ||
+ | table.mbox.move td:first-child { background-image: url("/images/1/11/Imbox_move.png"); } | ||
+ | |||
+ | table.mbox.notice { border-color: #62b0f6; background-color: #e0eef7; } | ||
+ | table.mbox.notice td:first-child { background-image: url("/images/3/31/Imbox_notice.png"); } | ||
+ | |||
+ | table.mbox.protect { border-color: #66727f; background-color: #e3e6e8; } | ||
+ | table.mbox.protect td:first-child { background-image: url("/images/9/90/Imbox_protection.png"); } | ||
+ | |||
+ | table.mbox.warning { border-color: #c31c1c; background-color: #fce0e0; font-size: 100%; } | ||
+ | table.mbox.warning td:first-child { background-image: url("/images/e/e5/Imbox_warning.png"); } | ||
+ | |||
+ | table.mbox.delete { border-color: #ff0000; background-color: #ffd2d2; } | ||
+ | table.mbox.delete td:first-child { background-image: url("/images/9/99/Imbox_delete.png"); } | ||
+ | |||
+ | table.mbox.disambig { border-color: #000000; background-color: #e2e2e2; } | ||
+ | table.mbox.disambig td:first-child { background-image: url("/images/a/a3/Imbox_disambig.png"); } | ||
/* DIFF */ | /* DIFF */ | ||
Line 66: | Line 282: | ||
td.diff-addedline | td.diff-addedline | ||
{ | { | ||
− | background-color: # | + | background-color: #d8e4f6; |
} | } | ||
td.diff-addedline span.diffchange | td.diff-addedline span.diffchange | ||
{ | { | ||
− | background-color: # | + | background-color: #b0c0f0; |
color: #001040; | color: #001040; | ||
font-weight: bold; | font-weight: bold; | ||
Line 76: | Line 292: | ||
td.diff-deletedline | td.diff-deletedline | ||
{ | { | ||
− | background-color: # | + | background-color: #e4f6d8; |
} | } | ||
td.diff-deletedline span.diffchange | td.diff-deletedline span.diffchange | ||
{ | { | ||
− | background-color: # | + | background-color: #b0e897; |
color: #104000; | color: #104000; | ||
font-weight: bold; | font-weight: bold; | ||
} | } |
Latest revision as of 21:54, 6 June 2014
/** CSS placed here will be applied to all skins */ /* CATEGORY TREE */ #mw-subcategories ul { list-style-type: none; } #mw-subcategories ul li { display: block; } /* LAST UPDATE */ table.lastupdate { border-radius: 18px; -moz-border-radius: 18px; background: lightblue; margin: 12px auto; width: 70%; } table.lastupdate td.lastupdate-left { padding: 10px; width: 240px; text-align: center; } table.lastupdate td.lastupdate-right { border: solid 10px lightblue; border-radius: 18px; -moz-border-radius: 18px; background: #ffffff; padding: 12px; } /* MAIN-NAVIGATOR */ table.mainnavigator { border-spacing: 10px; margin: auto; } /* INFOBOX */ table.infobox { border: solid 2px; border-spacing: 4px; border-radius: 12px; -moz-border-radius: 12px; padding: 0px; min-width: 240px; text-align: left; } table.infobox th { border: solid 2px; border-radius: 8px 0px 0px 8px; -moz-border-radius: 8px 0px 0px 8px; margin: 0px; padding: 2px 6px; text-align: right; vertical-align: bottom; line-height: 20px; white-space: nowrap; } table.infobox th.title { border-radius: 8px; -moz-border-radius: 8px; background-position: 2px center; background-repeat: no-repeat; padding: 6px 36px; text-align: center; font-size: 130%; font-weight: bold; } table.infobox th.subtitle { border-radius: 8px; -moz-border-radius: 8px; padding: 6px; text-align: center; font-size: 110%; font-weight: bold; } table.infobox th.heading { border-width: 0px 0px 2px; border-radius: 0px; -moz-border-radius: 0px; text-align: left; font-weight: bold; } table.infobox td, table.infobox td.data { margin: 0px; padding: 2px; } table.infobox td.data { border: solid 0px; border-bottom: solid 2px; height: 24px; line-height: 20px; text-align: left; vertical-align: bottom; } table.infobox td.image { border: solid 0px; text-align: center; } table.infobox td.data p, table.infobox td.data sup { margin: 0px; padding: 0px; } /* INFOBOX SIDE */ table.infobox.side { margin: 0px 0px 10px 10px; float: right; clear: both; } /* INFOBOX DEFAULT THEME */ table.infobox, table.infobox th, table.infobox td.data { border-color: #cccccc; } table.infobox th { background-color: #ccccff; color: #000000; } table.infobox, table.infobox th.heading { background-color: #ffffff; } /* INFOBOX THEME ICONS */ table.infobox th.theme-icon-grey { background-image: url("/images/6/6e/Orb_grey30.png"); } table.infobox th.theme-icon-green { background-image: url("/images/d/da/Orb_green30.png"); } table.infobox th.theme-icon-red { background-image: url("/images/f/f8/Orb_red30.png"); } table.infobox th.theme-icon-pink { background-image: url("/images/f/f8/Orb_pink30.png"); } table.infobox th.theme-icon-yellow { background-image: url("/images/e/e4/Orb_yellow30.png"); } table.infobox th.theme-icon-cyan { background-image: url("/images/6/6f/Orb_cyan30.png"); } table.infobox th.theme-icon-blue { background-image: url("/images/7/7b/Orb_navy30.png"); } table.infobox th.theme-icon-orange { background-image: url("/images/e/e4/Orb_yellow30.png"); } table.infobox th.theme-icon-purple { background-image: url("/images/6/61/Orb_purple30.png"); } table.infobox th.theme-icon-dblue { background-image: url("/images/7/7b/Orb_navy30.png"); } table.infobox th.theme-icon-navy { background-image: url("/images/7/7b/Orb_navy30.png"); } table.infobox th.theme-icon-sand { background-image: url("/images/e/e4/Orb_yellow30.png"); } /* ARTICLE LINK */ span.articlelink.planet a { background: transparent no-repeat; background-position: left center; padding-left: 16px; font-weight: bold; text-decoration: underline; } span.articlelink.island a { background: transparent; font-weight: bold; text-decoration: underline; } /* ARTICLE LINK THEMES */ span.articlelink.island.twinsun a, span.articlelink.planet.twinsun a { color: royalblue; } span.articlelink.planet.twinsun a { background-image: url("/images/d/d3/Twinsun_icon.gif"); } span.articlelink.island.moon a, span.articlelink.planet.moon a { color: seagreen; } span.articlelink.planet.moon a { background-image: url("/images/6/60/Moon_icon.gif"); padding-left: 17px; } span.articlelink.island.zeelich a, span.articlelink.planet.zeelich a { color: sienna; } span.articlelink.planet.zeelich a { background-image: url("/images/1/16/Zeelich_icon.gif"); padding-left: 18px; } span.articlelink.island.undergas a, span.articlelink.planet.undergas a { color: darkred; } span.articlelink.planet.undergas a { background-image: url("/images/1/16/Zeelich_icon.gif"); padding-left: 18px; } /* QUOTE */ table.quote { border: solid 0px; max-width: 70%; } table.quote td.quote-open { border: solid #b2b7f2; border-width: 2px 0px 0px 2px; border-top-left-radius: 10px; background-color: #ebeff3; color: #b2b7f2; width: 20px; text-align: left; vertical-align: top; font-family: 'Times New Roman', serif; font-size: 36px; font-weight: bold; } table.quote td.quote-close { border-top: solid 2px #b2b7f2; border-right: solid 2px #4c615d; border-top-right-radius: 10px; background-color: #ebeff3; color: #b2b7f2; padding-bottom: 0px; width: 20px; text-align: right; vertical-align: bottom; font-family: 'Times New Roman', serif; font-size: 36px; font-weight: bold; } table.quote td.quote-body { border-top: solid 2px #b2b7f2; background-color: #ebeff3; padding: 4px 0px 0px; vertical-align: top; } table.quote td.quote-cite { border: solid 2px #4c615d; border-top-width: 0px; border-left-color: #b2b7f2; border-radius: 0px 0px 10px 10px; padding-top: 0px; padding-bottom: 4px; font-weight: bold; font-style: italic; } /* MESSAGE BOX */ table.mbox { border: solid 1px #000000; border-collapse: collapse; color: #000000; margin: 4px auto; padding: 0px 1em; max-width: 75%; } table.mbox td { padding: 5px 10px; vertical-align: middle; } table.mbox td:first-child { background: transparent no-repeat center; width: 50px; line-height: 40px; text-align: center; vertical-align: top; } table.mbox td p, table.mbox td ul { margin-top: 6px; margin-bottom: 0px; } /* MESSAGE BOX THEMES */ table.mbox.cleanup { border-color: #d1b11b; background-color: #f8f0c7; } table.mbox.cleanup td:first-child { background-image: url("/images/1/1b/40px-Edit-clear.svg.png"); } table.mbox.content { border-color: #ff8005; background-color: #ffe0c1; } table.mbox.content td:first-child { background-image: url("/images/3/38/Imbox_content.png"); } table.mbox.move { border-color: #b700b7; background-color: #ffe1ff; } table.mbox.move td:first-child { background-image: url("/images/1/11/Imbox_move.png"); } table.mbox.notice { border-color: #62b0f6; background-color: #e0eef7; } table.mbox.notice td:first-child { background-image: url("/images/3/31/Imbox_notice.png"); } table.mbox.protect { border-color: #66727f; background-color: #e3e6e8; } table.mbox.protect td:first-child { background-image: url("/images/9/90/Imbox_protection.png"); } table.mbox.warning { border-color: #c31c1c; background-color: #fce0e0; font-size: 100%; } table.mbox.warning td:first-child { background-image: url("/images/e/e5/Imbox_warning.png"); } table.mbox.delete { border-color: #ff0000; background-color: #ffd2d2; } table.mbox.delete td:first-child { background-image: url("/images/9/99/Imbox_delete.png"); } table.mbox.disambig { border-color: #000000; background-color: #e2e2e2; } table.mbox.disambig td:first-child { background-image: url("/images/a/a3/Imbox_disambig.png"); } /* DIFF */ table.diff { padding: 0.5em; } td.diff-addedline { background-color: #d8e4f6; } td.diff-addedline span.diffchange { background-color: #b0c0f0; color: #001040; font-weight: bold; } td.diff-deletedline { background-color: #e4f6d8; } td.diff-deletedline span.diffchange { background-color: #b0e897; color: #104000; font-weight: bold; }