X-Git-Url: http://git.cyclocoop.org/%7B%24www_url%7Dadmin/compta/exercices/modifier.php?a=blobdiff_plain;f=skins%2Fvector%2Fscreen.css;h=e035caa850b5607f3c3708e0a52c4ab1f1462714;hb=a51296817dbeff4aa24d73f6c0465d6219d3beaf;hp=d3ae305213b455decd1e82f9f9e40b70fcc2ceba;hpb=cf82a750884bdfb2ef21ea3cfec1528e9e808efa;p=lhc%2Fweb%2Fwiklou.git diff --git a/skins/vector/screen.css b/skins/vector/screen.css index d3ae305213..e035caa850 100644 --- a/skins/vector/screen.css +++ b/skins/vector/screen.css @@ -1,8 +1,16 @@ /* - * Any rules which should not be flipped automatically in right-to-left situations should be prepended with @noflip in - * a comment block. Images that should be embedded as base64 data-URLs should be prepended with @embed in a comment - * block. + * Any rules which should not be flipped automatically in right-to-left situations should be + * prepended with @noflip in a comment block. Images that should be embedded as base64 data-URLs + * should be prepended with @embed in a comment block. + * + * This style-sheet employs a few CSS trick to accomplish compatibility with a wide range of web + * browsers. The most common trick is to use some styles in IE6 only. This is accomplished by using + * a rule that makes things work in IE6, and then following it with a rule that begins with + * "html > body" or use a child selector ">", which is ignored by IE6 because it does not support + * the child selector. You can spot this by looking for the "OVERRIDDEN BY COMPLIANT BROWSERS" and + * "IGNORED BY IE6" comments. */ + /* Framework */ html, body { @@ -15,14 +23,14 @@ body { body { background-color: #f3f3f3; /* @embed */ - background-image: url(images/page-base.png?1); + background-image: url(images/page-base.png); } /* Content */ div#content { margin-left: 10em; padding: 1em; /* @embed */ - background-image: url(images/border.png?1); + background-image: url(images/border.png); background-position: top left; background-repeat: repeat-y; background-color: white; @@ -34,7 +42,7 @@ div#content { height: 5em; background-color: white; /* @embed */ - background-image: url(images/page-fade.png?1); + background-image: url(images/page-fade.png); background-position: bottom left; background-repeat: repeat-x; } @@ -43,7 +51,7 @@ div#content { margin-left: 10em; height: 5em; /* @embed */ - background-image: url(images/border.png?1); + background-image: url(images/border.png); background-position: bottom left; background-repeat: repeat-x; } @@ -65,7 +73,6 @@ div#mw-head h5 { #p-personal { position: absolute; top: 0; - padding-left: 10em; right: 0.75em; } #p-personal h5 { @@ -74,7 +81,7 @@ div#mw-head h5 { #p-personal ul { list-style: none; margin: 0; - padding: 0; + padding-left: 10em; /* Keep from overlapping logo */ } /* @noflip */ #p-personal li { @@ -111,7 +118,7 @@ div#mw-head h5 { } div.vectorTabs { /* @embed */ - background-image: url(images/tab-break.png?1); + background-image: url(images/tab-break.png); background-position: bottom left; background-repeat: no-repeat; padding-left: 1px; @@ -139,7 +146,7 @@ div#mw-head h5 { padding: 0; background-color: #f3f3f3; /* @embed */ - background-image: url(images/tab-normal-fade.png?1); + background-image: url(images/tab-normal-fade.png); background-position: bottom left; background-repeat: repeat-x; white-space:nowrap; @@ -150,7 +157,7 @@ div#mw-head h5 { } div.vectorTabs li.selected { /* @embed */ - background-image: url(images/tab-current-fade.png?1); + background-image: url(images/tab-current-fade.png); } /* OVERRIDDEN BY COMPLIANT BROWSERS */ div.vectorTabs li a { @@ -158,22 +165,18 @@ div#mw-head h5 { height: 1.9em; padding-left: 0.5em; padding-right: 0.5em; - /* @embed */ - background-image: url(images/tab-break.png?1); - background-position: bottom right; - background-repeat: no-repeat; - } - div.vectorTabs li a{ color: #0645ad; cursor: pointer; - } - div.vectorTabs li a { font-size: 0.8em; } /* IGNORED BY IE6 */ div.vectorTabs li > a { display: block; } + div.vectorTabs li.icon a { + background-position: bottom right; + background-repeat: no-repeat; + } /* OVERRIDDEN BY COMPLIANT BROWSERS */ div.vectorTabs span a { display: inline-block; @@ -185,6 +188,13 @@ div#mw-head h5 { float: left; display: block; } + div.vectorTabs span { + display: inline-block; + /* @embed */ + background-image: url(images/tab-break.png); + background-position: bottom right; + background-repeat: no-repeat; + } div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited{ color: #333333; @@ -200,11 +210,14 @@ div#mw-head h5 { direction: ltr; float: left; /* @embed */ - background-image: url(images/arrow-down-icon.png?1); - background-position: 100% 60%; + background-image: url(images/arrow-down-icon.png); + background-position: 0px 60%; background-repeat: no-repeat; cursor: pointer; } + div.vectorMenuFocus { + background-position: -22px 60%; + } /* @noflip */ body.rtl div.vectorMenu { direction: rtl; @@ -214,17 +227,18 @@ div#mw-head h5 { div#mw-head div.vectorMenu h5 { float: left; /* @embed */ - background-image: url(images/tab-break.png?1); + background-image: url(images/tab-break.png); background-repeat: no-repeat; } - /* IGNORED BY IE6 */ - div#mw-head div.vectorMenu > h5 { - background-image: none; - } + /* This will be flipped - unlike the one above it */ div#mw-head div.vectorMenu h5 { background-position: bottom left; margin-left: -1px; } + /* IGNORED BY IE6 */ + div#mw-head div.vectorMenu > h5 { + background-image: none; + } div#mw-head div.vectorMenu h4 { display: inline-block; float: left; @@ -242,10 +256,11 @@ div#mw-head h5 { height: 2.5em; text-decoration: none; /* @embed */ - background-image: url(images/tab-break.png?1); + background-image: url(images/tab-break.png); background-repeat: no-repeat; } - div.vectorMenu h5 a{ + /* This will be flipped - unlike the one above it */ + div.vectorMenu h5 a { background-position: bottom right; } /* IGNORED BY IE6 */ @@ -268,13 +283,15 @@ div#mw-head h5 { body.rtl div.vectorMenu > div.menu { margin-left: auto; } - /* Fixes old versions of FireFox */ + /* IGNORED BY IE6 */ + /* Also fixes old versions of FireFox */ /* @noflip */ body.rtl div.vectorMenu > div.menu, x:-moz-any-link { margin-left: 23px; } - div.vectorMenu:hover div.menu { + /* Enable forcing showing of the menu for accessibility */ + div.vectorMenu:hover div.menu, div.vectorMenu div.menuForceShow { display: block; } div.vectorMenu ul { @@ -312,16 +329,14 @@ div#mw-head h5 { display: inline-block; padding: 0.5em; white-space: nowrap; + color: #0645ad; + cursor: pointer; + font-size: 0.8em; } /* IGNORED BY IE6 */ div.vectorMenu li > a { display: block; } - div.vectorMenu li a { - color: #0645ad; - cursor: pointer; - font-size: 0.8em; - } div.vectorMenu li.selected a, div.vectorMenu li.selected a:visited { color: #333333; @@ -345,13 +360,17 @@ div#mw-head h5 { margin-top: 0.4em; } div#simpleSearch { + display: block; + width: 14em; + height: 1.4em; margin-top: 0.65em; position: relative; min-height: 1px; /* Gotta trigger hasLayout for IE7 */ border: solid 1px #AAAAAA; + color: black; background-color: white; /* @embed */ - background-image: url(images/search-fade.png?1); + background-image: url(images/search-fade.png); background-position: top left; background-repeat: repeat-x; } @@ -362,41 +381,66 @@ div#mw-head h5 { */ font-size: 13px; top: 0.25em; + direction: ltr; + } + div#simpleSearch input { + color: black; + direction: ltr; + } + div#simpleSearch input:focus { + outline: none; } - div#simpleSearch .placeholder { + div#simpleSearch input.placeholder { color: #999999; } div#simpleSearch input::-webkit-input-placeholder { color: #999999; } div#simpleSearch input#searchInput { + position: absolute; + top: 0; + left: 0; + width: 90%; margin: 0; - border-width: 0; - padding: 3px; - vertical-align: top; + padding: 0; + padding-left: 0.2em; + padding-top: 0.2em; + padding-bottom: 0.2em; + outline: none; + border: none; /* * DON'T PANIC! Browsers that won't scale this properly are the same browsers that have JS issues that prevent * this from ever being shown anyways. */ font-size: 13px; - width: 14em; background-color: transparent; - color: black; + direction: ltr; } - /* OVERRIDDEN BY COMPLIANT BROWSERS */ div#simpleSearch button#searchButton { + position: absolute; + width: 10%; + right: 0; + top: 0; padding: 0; - margin: 0 5px; + padding-top: 0.3em; + padding-bottom: 0.2em; + padding-right: 0.4em; + margin: 0; border: none; cursor: pointer; background-color: transparent; - font-size: x-small; + background-image: none; } + /* OVERRIDDEN BY COMPLIANT BROWSERS */ div#simpleSearch button#searchButton img { border: none; margin: 0; + margin-top: -3px; padding: 0; - vertical-align: middle; + } + /* IGNORED BY IE6 */ + div#simpleSearch button#searchButton > img { + margin: 0; } /* Panel */ div#mw-panel { @@ -425,7 +469,7 @@ div#mw-panel { padding-top: 0.5em; margin-left: 1.25em; /* @embed */ - background-image: url(images/portal-break.png?1); + background-image: url(images/portal-break.png); background-repeat: no-repeat; background-position: top left; } @@ -456,7 +500,7 @@ div#footer { margin-top: 0; padding: 0.75em; /* @embed */ - background-image: url(images/border.png?1); + background-image: url(images/border.png); background-position: top left; background-repeat: repeat-x; direction: ltr; @@ -490,6 +534,7 @@ div#footer #footer-icons li { float: left; margin-left: 0.5em; line-height: 2em; + text-align: right; } div#footer #footer-places li { float: left; @@ -529,7 +574,7 @@ div#footer #footer-places li { margin: 0 !important; padding: 0 !important; /* @embed */ - background-image: url(images/preferences-break.png?1); + background-image: url(images/preferences-break.png); background-position: bottom left; background-repeat: no-repeat; } @@ -544,11 +589,11 @@ div#footer #footer-places li { list-style-type: none; list-style-image: none; /* @embed */ - background-image: url(images/preferences-break.png?1); + background-image: url(images/preferences-break.png); background-position: bottom right; background-repeat: no-repeat; } - /* IGNORED BY IE6 */ + /* Sadly, IE6 won't understand this */ #preftoc li:first-child { margin-left: 1px; } @@ -568,7 +613,7 @@ div#footer #footer-places li { } #preftoc li.selected a { /* @embed */ - background-image: url(images/preferences-fade.png?1); + background-image: url(images/preferences-fade.png); background-position: bottom; background-repeat: repeat-x; color: #333333; @@ -583,17 +628,17 @@ div#footer #footer-places li { border: solid 1px #cccccc; background-color: #f9f9f9; /* @embed */ - background-image: url(images/preferences-base.png?1); + background-image: url(images/preferences-base.png); +} +#preferences fieldset { + border: none; + border-top: solid 1px #cccccc; } #preferences fieldset.prefsection { border: none; padding: 0; margin: 1em; } -#preferences fieldset.prefsection fieldset { - border: none; - border-top: solid 1px #cccccc; -} #preferences legend { color: #666666; } @@ -643,316 +688,18 @@ div#content { #bodyContent { font-size: 0.8em; } -/* Links */ -a { - text-decoration: none; - color: #0645ad; - background: none; -} -a:visited { - color: #0b0080; -} -a:active { - color: #faa700; -} -a:hover, a:focus { - text-decoration: underline; -} -a.stub { - color: #772233; -} -a.new, #p-personal a.new { - color: #ba0000; -} -a.new:visited, #p-personal a.new:visited { - color: #a55858; -} -/* Inline Elements */ -img { - border: none; - vertical-align: middle; -} -hr { - height: 1px; - color: #aaa; - background-color: #aaa; - border: 0; - margin: .2em 0 .2em 0; -} - -/* Structural Elements */ -h1, -h2, -h3, -h4, -h5, -h6 { - color: black; - background: none; - font-weight: normal; - margin: 0; - padding-top: .5em; - padding-bottom: .17em; - border-bottom: 1px solid #aaa; - width: auto; -} -h1 { font-size: 188%; } -h1 .editsection { font-size: 53%; } -h2 { font-size: 150%; } -h2 .editsection { font-size: 67%; } -h3, -h4, -h5, -h6 { - border-bottom: none; - font-weight: bold; -} -h3 { font-size: 132%; } -h3 .editsection { font-size: 76%; font-weight: normal; } -h4 { font-size: 116%; } -h4 .editsection { font-size: 86%; font-weight: normal; } -h5 { font-size: 100%; } -h5 .editsection { font-weight: normal; } -h6 { font-size: 80%; } -h6 .editsection { font-size: 125%; font-weight: normal; } .editsection { float: right; } -p { - margin: .4em 0 .5em 0; - line-height: 1.5em; -} - p img { - margin: 0; - } -abbr, -acronym, -.explain { - border-bottom: 1px dotted black; - color: black; - background: none; - cursor: help; -} -q { - font-family: Times, "Times New Roman", serif; - font-style: italic; -} -/* Disabled for now -blockquote { - font-family: Times, "Times New Roman", serif; - font-style: italic; -}*/ -pre, code, tt { - /* - * It's important for this rule to first reference an actual font name, some browsers will render the monospace text - * too small otherwise, namely Firefox, Chrome and Safari - */ - font-family: monospace, "Courier New"; -} -code { - background-color: #f9f9f9; -} -pre { - padding: 1em; - border: 1px dashed #2f6fab; - color: black; - background-color: #f9f9f9; - line-height: 1.1em; -} + ul { - line-height: 1.5em; - list-style-type: square; - margin: .3em 0 0 1.5em; - padding: 0; /* @embed */ - list-style-image: url(images/bullet-icon.png?1); -} -ol { - line-height: 1.5em; - margin: .3em 0 0 3.2em; - padding: 0; - list-style-image: none; -} -li { - margin-bottom: .1em; -} -dt { - font-weight: bold; - margin-bottom: .1em; -} -dl { - margin-top: .2em; - margin-bottom: .5em; -} -dd { - line-height: 1.5em; - margin-left: 2em; - margin-bottom: .1em; -} -/* Tables */ -table { - font-size: 100%; - color: black; - /* we don't want the bottom borders of

s to be visible through - * floated tables */ - background-color: white; -} -fieldset table { - /* but keep table layouts in forms clean... */ - background: none; -} -/* Forms */ -fieldset { - border: 1px solid #2f6fab; - margin: 1em 0 1em 0; - padding: 0 1em 1em; - line-height: 1.5em; -} - fieldset.nested { - margin: 0 0 0.5em 0; - padding: 0 0.5em 0.5em; - } -legend { - padding: .5em; - font-size: 95%; -} -form { - border: none; - margin: 0; -} -textarea { - width: 100%; - padding: .1em; -} -select { - vertical-align: top; -} -/* Table of Contents */ -#toc, -.toc, -.mw-warning { - border: 1px solid #aaa; - background-color: #f9f9f9; - padding: 5px; - font-size: 95%; -} -#toc h2, -.toc h2 { - display: inline; - border: none; - padding: 0; - font-size: 100%; - font-weight: bold; + list-style-image: url(images/bullet-icon.png); } -#toc #toctitle, -.toc #toctitle, -#toc .toctitle, -.toc .toctitle { - text-align: center; -} -#toc ul, -.toc ul { - list-style-type: none; - list-style-image: none; - margin-left: 0; - padding-left: 0; - text-align: left; -} -#toc ul ul, -.toc ul ul { - margin: 0 0 0 2em; -} -#toc .toctoggle, -.toc .toctoggle { - font-size: 94%; -} -/* Images */ -div.floatright, table.floatright { - clear: right; - float: right; - position: relative; - margin: 0 0 .5em .5em; - border: 0; -} -div.floatright p { font-style: italic; } -div.floatleft, table.floatleft { - float: left; - clear: left; - position: relative; - margin: 0 .5em .5em 0; - border: 0; -} -div.floatleft p { font-style: italic; } -/* Thumbnails */ -div.thumb { - margin-bottom: .5em; - border-style: solid; - border-color: white; - width: auto; - background-color: transparent; -} -div.thumbinner { - border: 1px solid #ccc; - padding: 3px !important; - background-color: #f9f9f9; - font-size: 94%; - text-align: center; - overflow: hidden; -} -html .thumbimage { - border: 1px solid #ccc; -} -html .thumbcaption { - border: none; - text-align: left; - line-height: 1.4em; - padding: 3px !important; - font-size: 94%; -} -div.magnify { - float: right; - border: none !important; - background: none !important; -} -div.magnify a, div.magnify img { - display: block; - border: none !important; - background: none !important; -} -/* @noflip */ -div.tright { - clear: right; - float: right; - border-width: .5em 0 .8em 1.4em; -} -/* @noflip */ -div.tleft { - float: left; - clear: left; - margin-right: .5em; - border-width: .5em 1.4em .8em 0; -} -img.thumbborder { - border: 1px solid #dddddd; -} -.hiddenStructure { - display: none; -} -/* Warning */ -.mw-warning { - margin-left: 50px; - margin-right: 50px; - text-align: center; -} -/* User Message */ -.usermessage { - background-color: #ffce7b; - border: 1px solid #ffa500; - color: black; - font-weight: bold; - margin: 2em 0 1em; - padding: .5em 1em; - vertical-align: middle; + +pre { + line-height: 1.3em; } + /* Site Notice (includes notices from CentralNotice extension) */ #siteNotice { position: relative; @@ -963,47 +710,6 @@ img.thumbborder { #localNotice { margin-bottom: 0.9em; } -/* Categories */ -.catlinks { - border: 1px solid #aaa; - background-color: #f9f9f9; - padding: 5px; - margin-top: 1em; - clear: both; -} -/* Sub-navigation */ -#siteSub { - display: none; -} -#jump-to-nav { - display: none; -} -#contentSub, #contentSub2 { - font-size: 84%; - line-height: 1.2em; - margin: 0 0 1.4em 1em; - color: #7d7d7d; - width: auto; -} -span.subpages { - display: block; -} -/* Emulate Center */ -.center { - width: 100%; - text-align: center; -} -*.center * { - margin-left: auto; - margin-right: auto; -} -/* Small for tables and similar */ -.small, .small * { - font-size: 94%; -} -table.small { - font-size: 100%; -} /* Edge Cases for Content */ h1, h2 { margin-bottom: .6em; @@ -1023,38 +729,40 @@ h3, h4, h5 { div#content a.external, div#content a[href ^="gopher://"] { /* @embed */ - background: url(images/external-link-ltr-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/external-link-ltr-icon.png) center right no-repeat; + padding-right: 13px; } div#content a[href ^="https://"], .link-https { /* @embed */ - background: url(images/lock-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/lock-icon.png) center right no-repeat; + padding-right: 13px; } div#content a[href ^="mailto:"], .link-mailto { /* @embed */ - background: url(images/mail-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/mail-icon.png) center right no-repeat; + padding-right: 13px; } div#content a[href ^="news://"] { /* @embed */ - background: url(images/news-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/news-icon.png) center right no-repeat; + padding-right: 13px; } div#content a[href ^="ftp://"], .link-ftp { /* @embed */ - background: url(images/file-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/file-icon.png) center right no-repeat; + padding-right: 13px; } div#content a[href ^="irc://"], div#content a.extiw[href ^="irc://"], +div#content a[href ^="ircs://"], +div#content a.extiw[href ^="ircs://"], .link-irc { /* @embed */ - background: url(images/talk-icon.png?2) center right no-repeat; - padding: 0 13px 0 0; + background: url(images/talk-icon.png) center right no-repeat; + padding-right: 13px; } div#content a.external[href $=".ogg"], div#content a.external[href $=".OGG"], div#content a.external[href $=".mid"], div#content a.external[href $=".MID"], @@ -1065,7 +773,7 @@ div#content a.external[href $=".wma"], div#content a.external[href $=".WMA"], .link-audio { /* @embed */ background: url("images/audio-icon.png?2") center right no-repeat; - padding: 0 13px 0 0; + padding-right: 13px; } div#content a.external[href $=".ogm"], div#content a.external[href $=".OGM"], div#content a.external[href $=".avi"], div#content a.external[href $=".AVI"], @@ -1074,7 +782,7 @@ div#content a.external[href $=".mpg"], div#content a.external[href $=".MPG"], .link-video { /* @embed */ background: url("images/video-icon.png?2") center right no-repeat; - padding: 0 13px 0 0; + padding-right: 13px; } div#content a.external[href $=".pdf"], div#content a.external[href $=".PDF"], div#content a.external[href *=".pdf#"], div#content a.external[href *=".PDF#"], @@ -1082,18 +790,9 @@ div#content a.external[href *=".pdf?"], div#content a.external[href *=".PDF?"], .link-document { /* @embed */ background: url("images/document-icon.png?2") center right no-repeat; - padding: 0 13px 0 0; -} -/* Interwiki Styling (Disabled) */ -div#content a.extiw, -div#content a.extiw:active { - color: #36b; - background: none; - padding: 0; -} -div#content a.external { - color: #36b; + padding-right: 13px; } + div#content .printfooter { display: none; } @@ -1102,17 +801,19 @@ div#content .printfooter { #pt-anonuserpage, #pt-login { /* @embed */ - background: url(images/user-icon.png?1) left top no-repeat; + background: url(images/user-icon.png) left top no-repeat; padding-left: 15px !important; text-transform: none; } -.toccolours { - border: 1px solid #aaa; - background-color: #f9f9f9; - padding: 5px; - font-size: 95%; +.redirectText { + font-size: 140%; +} + +.redirectMsg img { + vertical-align: text-bottom; } + #bodyContent { position: relative; width: 100%; @@ -1125,10 +826,6 @@ div#bodyContent { } /* Watch/Unwatch Icon Styling */ -#ca-unwatch.icon, -#ca-watch.icon { - margin-right:1px; -} #ca-unwatch.icon a, #ca-watch.icon a { margin: 0; @@ -1138,36 +835,33 @@ div#bodyContent { width: 26px; /* This hides the text but shows the background image */ padding-top: 3.1em; + margin-top: 0; + /* Only applied in IE6 */ + margin-top: -0.8em !ie; height: 0; overflow: hidden; + /* @embed */ + background-image: url(images/watch-icons.png); } #ca-unwatch.icon a { - /* @embed */ - background-image: url(images/watch-icons.png?1); background-position: -43px 60%; } #ca-watch.icon a { - /* @embed */ - background-image: url(images/watch-icons.png?1); background-position: 5px 60%; } #ca-unwatch.icon a:hover, #ca-unwatch.icon a:focus { - /* @embed */ - background-image: url(images/watch-icons.png?1); background-position: -67px 60%; } #ca-watch.icon a:hover, #ca-watch.icon a:focus { - /* @embed */ - background-image: url(images/watch-icons.png?1); background-position: -19px 60%; } #ca-unwatch.icon a.loading, #ca-watch.icon a.loading { /* @embed */ - background-image: url(images/watch-icon-loading.gif?1); - background-position: center 60%; + background-image: url(images/watch-icon-loading.gif); + background-position: 5px 60%; } #ca-unwatch.icon a span, #ca-watch.icon a span { @@ -1175,13 +869,12 @@ div#bodyContent { } div.vectorTabs ul { /* @embed */ - background-image:url(images/tab-break.png?1); + background-image:url(images/tab-break.png); background-position:right bottom; background-repeat:no-repeat; } -/* Convenience links to edit block, delete and protect reasons */ -p.mw-ipb-conveniencelinks, p.mw-protect-editreasons, -p.mw-filedelete-editreasons, p.mw-delete-editreasons { - float: right; +/* Tooltips are outside of the normal body code, so this helps make the size of the text sensible */ +.tipsy { + font-size: 0.8em; }