summaryrefslogtreecommitdiff
path: root/resources/screen.css
diff options
context:
space:
mode:
Diffstat (limited to 'resources/screen.css')
-rw-r--r--resources/screen.css504
1 files changed, 252 insertions, 252 deletions
diff --git a/resources/screen.css b/resources/screen.css
index 4366a5b..0b74aa3 100644
--- a/resources/screen.css
+++ b/resources/screen.css
@@ -22,7 +22,7 @@ html, body {
max-width: 70em;
margin: 0 auto;
- position: relative;
+ position: relative;
}
@@ -36,15 +36,15 @@ html, body {
.left-navigation {
- position: absolute;
- left: -300px;
+ position: absolute;
+ left: -300px;
}
.right-navigation {
- position: absolute;
- right: -150px;
+ position: absolute;
+ right: -150px;
}
@@ -52,9 +52,9 @@ html, body {
#mw-navigation > div {
- position: fixed;
+ position: fixed;
- top: 160px;
+ top: 160px;
}
@@ -64,13 +64,13 @@ html, body {
text-align: left;
margin: 0;
- margin-top: 50px;
+ margin-top: 50px;
border: 1px solid transparent;
padding-left: 4px;
- padding-top: 8px;
+ padding-top: 8px;
padding-right: 4px;
- padding-bottom: 8px;
+ padding-bottom: 8px;
}
@@ -86,23 +86,23 @@ html, body {
#mw-navigation ul li {
padding: 0px;
- padding-top: 2px;
- padding-bottom: 2px;
+ padding-top: 2px;
+ padding-bottom: 2px;
- margin: 0px;
+ margin: 0px;
list-style: none;
font-size: 0.875em;
- opacity: 0.4;
+ opacity: 0.4;
- /* Les images ne doivent pas être tronquées verticalement */
- line-height: 32px;
+ /* Les images ne doivent pas être tronquées verticalement */
+ line-height: 32px;
}
#mw-navigation ul:hover li {
- opacity: 0.8;
+ opacity: 0.8;
}
@@ -110,10 +110,10 @@ html, body {
display: block;
- /* Fait de la place pour les images */
- padding-left: 40px;
+ /* Fait de la place pour les images */
+ padding-left: 40px;
- background-position: left center;
+ background-position: left center;
background-repeat: no-repeat;
white-space: nowrap;
@@ -122,13 +122,13 @@ html, body {
#mw-navigation ul span {
- visibility: hidden;
+ visibility: hidden;
}
#mw-navigation ul:hover span {
- visibility: visible;
+ visibility: visible;
}
@@ -136,112 +136,112 @@ html, body {
#pt-userpage a {
- /**
- * "User" par Philip Gwynne
- * https://thenounproject.com/term/user/14219/
- */
- background-image: url('identity.png');
+ /**
+ * "User" par Philip Gwynne
+ * https://thenounproject.com/term/user/14219/
+ */
+ background-image: url('identity.png');
}
#pt-mytalk a {
- /**
- * "Chat" par Jaclyne Ooi
- * https://thenounproject.com/term/chat/26692/
+ /**
+ * "Chat" par Jaclyne Ooi
+ * https://thenounproject.com/term/chat/26692/
*/
- background-image: url('chat.png');
+ background-image: url('chat.png');
}
#pt-preferences a {
- /**
- * "Configure" par Gonzalo Bravo
- * https://thenounproject.com/term/configure/63054/
+ /**
+ * "Configure" par Gonzalo Bravo
+ * https://thenounproject.com/term/configure/63054/
*/
- background-image: url('preferences.png');
+ background-image: url('preferences.png');
}
#pt-watchlist a {
- /**
- * "Eye" par Casper Jensen
- * https://thenounproject.com/term/eye/104152/
+ /**
+ * "Eye" par Casper Jensen
+ * https://thenounproject.com/term/eye/104152/
*/
- background-image: url('watchlist.png');
+ background-image: url('watchlist.png');
}
#pt-mycontris a {
- /**
- * "Share" par P.J. Onori
- * https://thenounproject.com/term/share/2886/
+ /**
+ * "Share" par P.J. Onori
+ * https://thenounproject.com/term/share/2886/
*/
- background-image: url('contribs.png');
+ background-image: url('contribs.png');
}
#pt-logout a {
- /**
- * "Power" par Michela Tannoia
- * https://thenounproject.com/term/power/25339/
+ /**
+ * "Power" par Michela Tannoia
+ * https://thenounproject.com/term/power/25339/
*/
- background-image: url('logout.png');
+ background-image: url('logout.png');
}
#ca-edit a {
- /**
- * "Document" par Cody Lawson
- * https://thenounproject.com/term/document/4502/
+ /**
+ * "Document" par Cody Lawson
+ * https://thenounproject.com/term/document/4502/
*/
- background-image: url('page.png');
+ background-image: url('page.png');
}
#ca-history a {
- /**
- * "History" par Joe Mortell
- * https://thenounproject.com/term/history/18126/
+ /**
+ * "History" par Joe Mortell
+ * https://thenounproject.com/term/history/18126/
*/
- background-image: url('history.png');
+ background-image: url('history.png');
}
#ca-delete a {
- /**
- * "Trash Can" par Dima Kolchan
- * https://thenounproject.com/term/trash-can/8119/
- */
- background-image: url('delete.png');
+ /**
+ * "Trash Can" par Dima Kolchan
+ * https://thenounproject.com/term/trash-can/8119/
+ */
+ background-image: url('delete.png');
}
#ca-move a {
- /**
- * "Rename" par Icons8
- * https://thenounproject.com/term/rename/61456/
+ /**
+ * "Rename" par Icons8
+ * https://thenounproject.com/term/rename/61456/
*/
- background-image: url('rename.png');
+ background-image: url('rename.png');
}
#ca-protect a {
- /**
- * "Shield" par Charlene Chen
- * https://thenounproject.com/term/shield/7005/
+ /**
+ * "Shield" par Charlene Chen
+ * https://thenounproject.com/term/shield/7005/
*/
- background-image: url('protect.png');
+ background-image: url('protect.png');
}
@@ -255,65 +255,65 @@ html, body {
header {
- background: rgb(58,110,165);
+ background: rgb(58,110,165);
width: 100%;
height: 170px;
- /**
- * Pour une image de taille 200px, si on a header.height à 170px,
- * il reste ~30px à compenser.
- *
- * On laisse beaucoup de marge pour que le texte du contenu de la
- * ne colle pas l'image de trop près.
- *
- * La taille totale doit être reportée dans 'mw-wrapper'.
- */
+ /**
+ * Pour une image de taille 200px, si on a header.height à 170px,
+ * il reste ~30px à compenser.
+ *
+ * On laisse beaucoup de marge pour que le texte du contenu de la
+ * ne colle pas l'image de trop près.
+ *
+ * La taille totale doit être reportée dans 'mw-wrapper'.
+ */
- margin-bottom: 60px;
+ margin-bottom: 60px;
}
header.sticky {
position: fixed;
- top: 0px;
+ top: 0px;
- height: 50px;
+ height: 50px;
- margin-bottom: 0px;
+ margin-bottom: 0px;
- z-index: 8000;
+ z-index: 8000;
}
header ~ div.extender {
- display: none;
+ display: none;
}
header.sticky ~ div.extender {
- display: block;
+ display: block;
- /**
- * On doit compenser les hauteurs ici.
- *
- * Par exemple : (170 + 60) = (50 + x)
- * 180 = x
- */
+ /**
+ * On doit compenser les hauteurs ici.
+ *
+ * Par exemple : (170 + 60) = (50 + x)
+ * 180 = x
+ */
- height: 180px;
+ height: 180px;
}
header a, header a:hover, header a:focus {
- text-deoration: none;
- color: black;
- opacity: 0.8;
+ text-deoration: none;
+ color: black;
+ opacity: 0.8;
}
@@ -328,55 +328,55 @@ header a, header a:hover, header a:focus {
float: left;
text-align: right;
- margin-left: 20px;
+ margin-left: 20px;
- width: 620px;
+ width: 620px;
- position: relative;
- top: 111px;
- -webkit-transform: translateY(-50%);
- -ms-transform: translateY(-50%);
- transform: translateY(-50%);
+ position: relative;
+ top: 111px;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
- opacity: 1.0;
+ opacity: 1.0;
}
header #p-logo {
- top: 111px;
+ top: 111px;
}
header #p-logo img.big {
- display: initial;
+ display: initial;
}
header #p-logo img.small {
- display: none;
+ display: none;
}
header.sticky #p-logo {
- top: 26px;
+ top: 26px;
}
header.sticky #p-logo img.big {
- display: none;
+ display: none;
}
header.sticky #p-logo img.small {
- display: initial;
+ display: initial;
- height: 47px;
+ height: 47px;
}
@@ -389,13 +389,13 @@ header.sticky #p-logo img.small {
/* Barre supérieure de menu */
#p-navigation {
- display:inline-block;
+ display:inline-block;
- position: relative;
- top: 50%;
- -webkit-transform: translateY(-50%);
- -ms-transform: translateY(-50%);
- transform: translateY(-50%);
+ position: relative;
+ top: 50%;
+ -webkit-transform: translateY(-50%);
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
}
@@ -412,24 +412,24 @@ header.sticky #p-logo img.small {
margin-left: 1em;
margin-right: 2em;
- text-align: center;
+ text-align: center;
}
#p-navigation a {
- color: white;
- opacity: 0.7;
+ color: white;
+ opacity: 0.7;
- font-weight: bold;
+ font-weight: bold;
- text-decoration: none;
+ text-decoration: none;
}
#p-navigation a:hover, #p-navigation a:focus {
- opacity: 1.0;
+ opacity: 1.0;
}
@@ -437,7 +437,7 @@ header.sticky #p-logo img.small {
/* On cache certains en-têtes */
#mw-navigation h2, #p-navigation h3, #p-search h3 {
- display: none;
+ display: none;
}
@@ -446,26 +446,26 @@ header.sticky #p-logo img.small {
.link_icon span {
- white-space: nowrap;
+ white-space: nowrap;
}
header .link_icon {
- visibility: visible;
+ visibility: visible;
- padding-top: 70px;
+ padding-top: 70px;
- background-position: center top;
- background-repeat: no-repeat;
+ background-position: center top;
+ background-repeat: no-repeat;
}
header.sticky .link_icon {
- padding-top: 0px;
+ padding-top: 0px;
- background-image: none;
+ background-image: none;
}
@@ -474,51 +474,51 @@ header.sticky .link_icon {
header:not([class~=sticky]) #n-screenshots-desc .link_icon {
- /**
- * "Camera" par Haitham Almayman
- * https://thenounproject.com/term/camera/76991/
- */
- background-image: url('screenshots.png');
+ /**
+ * "Camera" par Haitham Almayman
+ * https://thenounproject.com/term/camera/76991/
+ */
+ background-image: url('screenshots.png');
}
header:not([class~=sticky]) #n-documentation-desc .link_icon {
- /**
- * "Books" par Les vieux garçons
- * https://thenounproject.com/term/books/51607/
- */
- background-image: url('documentation.png');
+ /**
+ * "Books" par Les vieux garçons
+ * https://thenounproject.com/term/books/51607/
+ */
+ background-image: url('documentation.png');
}
header:not([class~=sticky]) #n-download-desc .link_icon {
- /**
- * "Download" par Alexander Bickov
- * https://thenounproject.com/term/download/29328/
- */
- background-image: url('download.png');
+ /**
+ * "Download" par Alexander Bickov
+ * https://thenounproject.com/term/download/29328/
+ */
+ background-image: url('download.png');
}
header:not([class~=sticky]) #n-activity-desc .link_icon {
- /**
- * "Write" par Lemon Liu
- * https://thenounproject.com/term/write/21211/
- */
- background-image: url('blog.png');
+ /**
+ * "Write" par Lemon Liu
+ * https://thenounproject.com/term/write/21211/
+ */
+ background-image: url('blog.png');
}
header:not([class~=sticky]) #n-contact-desc .link_icon {
- /**
- * "Contact" par Icons8
- * https://thenounproject.com/term/contact/50339/
- */
- background-image: url('contact.png');
+ /**
+ * "Contact" par Icons8
+ * https://thenounproject.com/term/contact/50339/
+ */
+ background-image: url('contact.png');
}
@@ -530,37 +530,37 @@ header:not([class~=sticky]) #n-contact-desc .link_icon {
#myMenu {
- z-index: 100000;
+ z-index: 100000;
- position: fixed;
+ position: fixed;
text-align: left;
padding: 8px;
- padding-left: 20px;
- padding-right: 20px;
+ padding-left: 20px;
+ padding-right: 20px;
}
#myMenu a {
- display: block;
+ display: block;
- color: #205c9a;
- opacity: 0.9;
+ color: #205c9a;
+ opacity: 0.9;
- font-weight: bold;
+ font-weight: bold;
- text-decoration: none;
+ text-decoration: none;
- line-height: 160%;
+ line-height: 160%;
}
#myMenu a:hover {
- color: white;
- opacity: 1.0;
+ color: white;
+ opacity: 1.0;
}
@@ -569,50 +569,50 @@ header:not([class~=sticky]) #n-contact-desc .link_icon {
.menu_arrow_box {
- background: #88afd8;
- border: 1px solid #fff;
+ background: #88afd8;
+ border: 1px solid #fff;
- border-top-left-radius: 12px;
- border-top-right-radius: 12px;
- border-bottom-left-radius: 12px;
- border-bottom-right-radius: 12px;
+ border-top-left-radius: 12px;
+ border-top-right-radius: 12px;
+ border-bottom-left-radius: 12px;
+ border-bottom-right-radius: 12px;
}
.menu_arrow_box:after, .menu_arrow_box:before {
- bottom: 100%;
- left: 50%;
+ bottom: 100%;
+ left: 50%;
- border: solid transparent;
+ border: solid transparent;
- content: " ";
+ content: " ";
- height: 0;
- width: 0;
+ height: 0;
+ width: 0;
- position: absolute;
- pointer-events: none;
+ position: absolute;
+ pointer-events: none;
}
.menu_arrow_box:after {
- border-color: rgba(0, 0, 0, 0);
- border-bottom-color: #88afd8;
+ border-color: rgba(0, 0, 0, 0);
+ border-bottom-color: #88afd8;
- border-width: 13px;
- margin-left: -13px;
+ border-width: 13px;
+ margin-left: -13px;
}
.menu_arrow_box:before {
- border-color: rgba(0, 0, 0, 0);
- border-bottom-color: #fff;
+ border-color: rgba(0, 0, 0, 0);
+ border-bottom-color: #fff;
- border-width: 15px;
- margin-left: -15px;
+ border-width: 15px;
+ margin-left: -15px;
}
@@ -624,20 +624,20 @@ header:not([class~=sticky]) #n-contact-desc .link_icon {
#mw-footer {
- margin-top: 23px;
+ margin-top: 23px;
padding: 0.6em;
padding-bottom: 0.4em;
- border: 1px solid rgb(32, 92, 154);
- border-top-left-radius: 25px;
- border-top-right-radius: 25px;
+ border: 1px solid rgb(32, 92, 154);
+ border-top-left-radius: 25px;
+ border-top-right-radius: 25px;
- background-color: rgb(58,110,165);
+ background-color: rgb(58,110,165);
- display:table;
- width: 100%;
+ display:table;
+ width: 100%;
- position:absolute;
+ position:absolute;
bottom:0;
}
@@ -658,28 +658,28 @@ header:not([class~=sticky]) #n-contact-desc .link_icon {
#mw-footer ul#poweredby {
- display:table-cell;
- vertical-align: middle;
- text-align: left;
+ display:table-cell;
+ vertical-align: middle;
+ text-align: left;
}
#mw-footer ul#lastmod {
- display:table-cell;
- vertical-align: middle;
- text-align: center;
+ display:table-cell;
+ vertical-align: middle;
+ text-align: center;
- color: white;
- opacity: 0.7;
+ color: white;
+ opacity: 0.7;
}
#mw-footer ul#links {
- display:table-cell;
- vertical-align: middle;
- text-align: right;
+ display:table-cell;
+ vertical-align: middle;
+ text-align: right;
}
@@ -687,32 +687,32 @@ header:not([class~=sticky]) #n-contact-desc .link_icon {
html, body {
- height: 100%;
+ height: 100%;
}
#mw-wrapper {
- /* 230px = header[.sticky].height + div.extender.height */
- min-height: calc(100% - 230px);
+ /* 230px = header[.sticky].height + div.extender.height */
+ min-height: calc(100% - 230px);
}
#mw-footer {
- position:absolute;
+ position:absolute;
bottom:0;
}
.mw-body {
- /**
- * On reste un espace pour le pied de page, avec marge :
- *
- * 69px + 2em ~= #mw-footer.height + marge
- */
- padding-bottom: calc(69px + 2em);
+ /**
+ * On reste un espace pour le pied de page, avec marge :
+ *
+ * 69px + 2em ~= #mw-footer.height + marge
+ */
+ padding-bottom: calc(69px + 2em);
}
@@ -726,75 +726,75 @@ html, body {
.toc {
- /*background: #88afd8;*/
- border: 2px solid #3a6ea5;
- border: 2px solid #88afd8;
+ /*background: #88afd8;*/
+ border: 2px solid #3a6ea5;
+ border: 2px solid #88afd8;
border-radius: 8px;
- margin: 20px;
+ margin: 20px;
- padding-left: 25px;
- padding-right: 25px;
- padding-bottom: 8px;
+ padding-left: 25px;
+ padding-right: 25px;
+ padding-bottom: 8px;
- float: right;
- display: table;
+ float: right;
+ display: table;
}
.toctoggle {
- display: none;
+ display: none;
}
.toclevel-1 {
- margin-top: 10px;
+ margin-top: 10px;
- list-style-type: square;
+ list-style-type: square;
}
body:not(.page-Page_Main):not(.page-Accueil):not(.page-Chrysalide) *:not(#toctitle):not(.h2) > h2 {
- position: relative;
- left: -30px;
+ position: relative;
+ left: -30px;
- padding-left: 30px;
- padding-right: 30px;
+ padding-left: 30px;
+ padding-right: 30px;
- border-bottom: 2px solid rgb(58, 110, 165);
+ border-bottom: 2px solid rgb(58, 110, 165);
- display: inline-block;
- margin: 0px;
- margin-top: 20px;
+ display: inline-block;
+ margin: 0px;
+ margin-top: 20px;
- clear: both;
+ clear: both;
}
pre {
- border: 2px dashed;
- border-left: 8px solid;
- border-color: rgb(58, 110, 165);
+ border: 2px dashed;
+ border-left: 8px solid;
+ border-color: rgb(58, 110, 165);
- padding: 10px;
- padding-right: 50px;
+ padding: 10px;
+ padding-right: 50px;
- margin-left: 40px;
+ margin-left: 40px;
- font-size: 120%;
+ font-size: 120%;
- display: table;
- white-space: pre-wrap;
+ display: table;
+ white-space: pre-wrap;
}
a {
- text-decoration: none;
+ text-decoration: none;
}
@@ -803,13 +803,13 @@ a {
* Par défaut, une image centrée reste à gauche...
* On force donc un comportement correct.
*
- * Le code permettant de valider le résultat attendu est du genre :
+ * Le code permettant de valider le résultat attendu est du genre :
*
- * [[File:XXX.png|center]]
+ * [[File:XXX.png|center]]
*
*/
div.center {
- text-align: center;
+ text-align: center;
}