« MediaWiki:Common.css » : différence entre les versions

De EduTech Wiki
Aller à la navigation Aller à la recherche
mAucun résumé des modifications
mAucun résumé des modifications
 
(173 versions intermédiaires par 2 utilisateurs non affichées)
Ligne 4 : Ligne 4 :
<pre>
<pre>
*/
*/
.counter-start {
counter-reset: counter;
}
.count:before {
content: counter(counter);
counter-increment: counter;
}
/* round image*/
.round img{border-radius:50%;filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.3));}
/*  rounded corner image */
.rounded img{border-radius:10%;filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.3));}
/* Mediawiki generic color https://www.mediawiki.org/wiki/Design/Archive/Wikimedia_Foundation_Design/Color_usage*/
.background-blue{background:#3366BB}
.text-blue{color:#3366BB}
.background-green{background:#008640}
.text-green{color:#008640}
.background-red{background:#CB0000}
.text-red{color:#CB0000}
.background-yellow{background:#ffa700}
.text-yellow{color:#ffa700}
.background-grey{background:#808083}
.text-grey{color:#808083}
/* Simple tableform style */
table.formtable th {background:rgba(0,0,0,0.1);padding:0.5em;}
table.formtable td {padding:0.5em;}
/*Fix a bug with leaflet map... (otherwise map appears above every elements even info windows, popups, input dropdowns etc.) */
.pfLeafletInput{
position:relative;
z-index: 0;
}
/* fix a strange bug with semantic mediawiki multiple input form*/
.multipleTemplateInstance.multipleTemplate.minimized {
    overflow: hidden;
}
/*css for template {{toggle}}*/
.toggle-template .mw-collapsible::before, .toggle-template .mw-collapsed::before{
content:"▲";
text-align: right;
margin-top: -2em;
display: block;
width: auto;
padding: 0 1em;
white-space: pre;
line-height: 2em;
border-radius: 0em 0.2em 0 0;
z-index: 2;
position: relative;
float:right;
color:#fff;
background:#808083;
pointer-events:none;
}
/*css for template {{felxGrid}}*/
.flexGrid p{margin:0;}
.flexGrid img{
width: 100%;
height: auto;
max-width: 500px;
}
/*css for template {{printonly}}*/
.hidden{
display:none;
}
/*css for template {{button}}*/
.modele-button{
color: #fff;
cursor:pointer;
display:inline-block;
font-weight:600;
margin:2px auto;
padding:0 0.5em;
box-sizing:border-box;
white-space: nowrap;
vertical-align: middle;
border-radius:0.2em;
box-shadow: 1px 1px 0.1em rgba(0,0,0,0.2);
border-bottom: 1px solid rgba(0,0,0,0.3);
font-size:0.85em;
}
.modele-button:hover{
box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.2);
}
.modele-button:active{
border:1px solid rgba(0,0,0,0.4);
}
.modele-button a{
text-decoration:none !important;
display:inline-block;
color:inherit !important;
}
.modele-button.small a{
font-size:0.85em;
}
.modele-button.medium a{
font-size:0.92em;
padding-top:0.15em;
padding-bottom:0.15em;
}
.modele-button.large a,.modele-button.full a{
font-size:1em;
padding-top:0.45em;
padding-bottom:0.45em;
}
.modele-button.full a{
width: calc(100% + 1em);
}
/* Badges */
div.appear {
    width: 184px;
    border: red 2px solid;
    background:#F8F8F8;
    position: absolute;
    top: 10px;
    left:-6px;
    display:none;go
    padding: 0 3px 3px 3px;
    z-index: 1000000;
}
div.appear_left {
    width: 184px;
    border: red 2px solid;
    background:#F8F8F8;
    position: absolute;
    top: 10px;
    left:-50%;
    display:none;
    padding: 0 3px 3px 3px;
    z-index: 1000000;
}
div.badge {
    cursor:pointer;
    position: relative;
    display: inline-block;
    border: green 1px solid;
    width: 130px;
    margin-bottom: 3px;
    text-align: center;
}
div.badge:hover div.appear, div.badge:hover div.appear_left{
    display:block;
}
/*front page */
[class*="front-"] {width: 100%}
@media only screen and (min-width: 768px){
#front_left {padding: 0.25em 1em;float: left;width: 57%;border: 1px solid rgba(33,33,33,0.1);background: #EAF5FB;box-sizing: border-box;border-radius: 0.2em;box-sizing:border-box;}
#front_right {padding: 0.25em 1em;float:left; width:40%; background: #FAF9EC; border: 1px solid rgba(33,33,33,0.1); margin-left: 4px;box-sizing:border-box;border-radius: 0.2em;}
div.front_title {font-size: large;border-bottom: 2px solid #36b;padding: 0.1em 0;margin: 0 0 0.5em 0;font-variant: small-caps;}
@media print{
#front_left {}
#front_right {}
}
/* Cours bases */
.PageFormsRadioButton {display:block;}
/* collection extension */
.onlyinprint {display: none}
/* Space out main section titles */
h1 {font-weight:bold;}
h2 {margin-top:3ex;font-weight:bold;}
h3 {margin-top:1ex;}


table.wikitable,
table.wikitable,
table.prettytable {
table.prettytable,
table.datatable {
   margin: 1em 1em 1em 0;
   margin: 1em 1em 1em 0;
   background: #f9f9f9;
   background: #f9f9f9;
Ligne 13 : Ligne 226 :
}
}
   
   
table.datatable {
font-size:70%
}
table.wikitable th, table.wikitable td,
table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
table.prettytable th, table.prettytable td {
   border: 1px #aaaaaa solid;
   border: 1px #aaaaaa solid;
   padding: 0.2em;
   padding: 0.2em;
}
table.datatable th, table.datatable td {
  border: 1px #aaaaaa solid;
  font-size:70%
  padding: 0em;
}
}
   
   
table.wikitable th,
table.wikitable th,
table.datatable th,
table.prettytable th {
table.prettytable th {
   background: #f2f2f2;
   background: #f2f2f2;
Ligne 26 : Ligne 250 :
   
   
table.wikitable caption,
table.wikitable caption,
table.datatable caption,
table.prettytable caption {
table.prettytable caption {
   margin-left: inherit;
   margin-left: inherit;
   margin-right: inherit;
   margin-right: inherit;
}
}
/* Extralarge big element in tables of class emoji, to display emojis */
table.emoji big {font-size:xx-large}


/* Removes useless links from printout */
/* Removes useless links from printout */
Ligne 101 : Ligne 329 :
  }
  }


code {
  border: 1px solid #ddd;
  padding: 1px 4px;
  border-radius: 2px;
}


/* category tree - first is just for portlet - second for all trees */
/* category tree - first is just for portlet - second for all trees */
#p-categorytree-portlet {font-size: 80% }
/*
.CategoryTreeTag {font-size: 95%; }
#p-categorytree-portlet {font-size: 80% }  
*/
.CategoryTreeTag {font-size: 90%; }
 


/* Syntaxhighlight geshi */
/* Syntaxhighlight geshi */
.mw-geshi {
div.mw-geshi {
   padding: 1px;  
   border: 1px dotted grey;
   font-size: 100%;
   padding: 2px;  
   margin-left:1em;
   margin-left:1em;
   margin-top:1px;
  font-size: 120%;
   margin-right:1px;
   margin-top:2px;
   margin-bottom:1px
   margin-right:2px;
  border: 2px dashed #2fab6f;
   margin-bottom:2px
}
}
 


.sidebar_banner {
.sidebar_banner {
  margin-top: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-bottom: 5px;
}
h3 .editsection { font-size: 76%; font-weight: normal; }
h4 .editsection { font-size: 86%; font-weight: normal; }
h5 .editsection { font-weight: normal; }
h6 .editsection { font-size: 125%; font-weight: normal; }
/* Contribution Scores */
.contributionscores-wrapper {  font-size: 80%; }
.contributionscores-title  { margin-left: 0; padding-left: 0em; margin-bottom: 0;}
.contributionscores .header { border-bottom: 1px solid #999999; font-weight: bold; }
.contributionscores .odd    { background-color: #eeeeee; }
.contributionscores .header td  { padding-left: .2em; padding-right: .2em; }
.contributionscores .content  { padding-left: .2em; padding-right: .2em; }
.GoBlock{
background: rgb(207,234,153);
border-radius: 3px;
display:inline-block;
color:#333333;
font-family:arial;
font-size:0.9em;
box-sizing: border-box;
padding:0 13px;
text-align:center;
border: 1px solid rgba(0,0,0,0.05);
line-height:1.5em;
}
.StopBlock{
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:rgb(200, 230, 140);
background-image: linear-gradient(rgb(248, 228, 158), rgb(220, 200, 130));
background-image: -webkit-linear-gradient(rgb(248, 228, 158), rgb(220, 200, 130));
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
text-indent:0;
border:1px solid rgb(155,185,95);
display:inline-block;
color:#333333;
font-family:arial;
font-size:13px;
font-style:normal;
text-decoration:none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:0px 8px;
text-align:center;
line-height:2.5em;
}
.tableBlue{
margin:auto;
background: #f9f9f9;
border-collapse: collapse;
width:98%;
text-align:center;
}
.tableBlue td{
border: 1px #aaaaaa solid;
padding:8px !important;
}
.tableBlue th{
background: rgb(200,220,240);
text-align: center;
font-weight:bold;
color:rgb(120,140,180);
padding: 8px 15px 8px 15px;
border: 1px #aaaaaa solid;
}
.tableBlue tr.row-odd{background:white;}
.tableBlue tr.row-even{background:rgb(235,245,255);}
/* Leyla formulaires STIC III/IV */
.annee.radioButtonItem {
  width: 10%;
  display: block;
  float:left;
}
.technologie.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}
.type.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}
.domaine_enseignement.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}
.niveau_enseignement.checkboxLabel {
  width: 33.3%;
  display: block;
  float:left;
}
.public_cible.checkboxLabel {
  width: 20%;
  display: block;
  float:left;
}
.public_age.checkboxLabel {
  width: 20%;
  display: block;
  float:left;
}
/* for smartphone display*/
pre{
word-break: break-word;
}
}



Dernière version du 29 novembre 2021 à 17:30

/** Le CSS placé ici sera appliqué à toutes les apparences. */

/*
<pre>
*/

.counter-start {
	counter-reset: counter;
}
.count:before {
	content: counter(counter);
	counter-increment: counter;
}

/* round image*/
.round img{border-radius:50%;filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.3));}

/*  rounded corner image */
.rounded img{border-radius:10%;filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.3));}


/* Mediawiki generic color https://www.mediawiki.org/wiki/Design/Archive/Wikimedia_Foundation_Design/Color_usage*/

.background-blue{background:#3366BB}
.text-blue{color:#3366BB}


.background-green{background:#008640}
.text-green{color:#008640}


.background-red{background:#CB0000}
.text-red{color:#CB0000}


.background-yellow{background:#ffa700}
.text-yellow{color:#ffa700}


.background-grey{background:#808083}
.text-grey{color:#808083}

/* Simple tableform style */

table.formtable th {background:rgba(0,0,0,0.1);padding:0.5em;}
table.formtable td {padding:0.5em;}


/*Fix a bug with leaflet map... (otherwise map appears above every elements even info windows, popups, input dropdowns etc.) */

.pfLeafletInput{
position:relative;
z-index: 0;
}

/* fix a strange bug with semantic mediawiki multiple input form*/

.multipleTemplateInstance.multipleTemplate.minimized {
    overflow: hidden;
}


/*css for template {{toggle}}*/

.toggle-template .mw-collapsible::before, .toggle-template .mw-collapsed::before{
content:"▲";
text-align: right;
margin-top: -2em;
display: block;
width: auto;
padding: 0 1em;
white-space: pre;
line-height: 2em;
border-radius: 0em 0.2em 0 0;
z-index: 2;
position: relative;
float:right;
color:#fff;
background:#808083;
pointer-events:none;
}

/*css for template {{felxGrid}}*/

.flexGrid p{margin:0;}
.flexGrid img{
width: 100%;
height: auto;
max-width: 500px;
}


/*css for template {{printonly}}*/

.hidden{
display:none;
}



/*css for template {{button}}*/

.modele-button{
color: #fff;
cursor:pointer;
display:inline-block;
font-weight:600;
margin:2px auto;
padding:0 0.5em;
box-sizing:border-box;
white-space: nowrap;
vertical-align: middle;
border-radius:0.2em;
box-shadow: 1px 1px 0.1em rgba(0,0,0,0.2);
border-bottom: 1px solid rgba(0,0,0,0.3);
font-size:0.85em;
}

.modele-button:hover{
box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.2);
}

.modele-button:active{
border:1px solid rgba(0,0,0,0.4);
}


.modele-button a{
text-decoration:none !important;
display:inline-block;
color:inherit !important;
}


.modele-button.small a{
font-size:0.85em;
}
.modele-button.medium a{
font-size:0.92em;
padding-top:0.15em;
padding-bottom:0.15em;
}
.modele-button.large a,.modele-button.full a{
font-size:1em;
padding-top:0.45em;
padding-bottom:0.45em;
}
.modele-button.full a{
width: calc(100% + 1em);
}


/* Badges */

div.appear {
    width: 184px; 
    border: red 2px solid;
    background:#F8F8F8;
    position: absolute;
    top: 10px;
    left:-6px;
    display:none;go
    padding: 0 3px 3px 3px;
    z-index: 1000000;
}

div.appear_left {
    width: 184px; 
    border: red 2px solid;
    background:#F8F8F8;
    position: absolute;
    top: 10px;
    left:-50%;
    display:none;
    padding: 0 3px 3px 3px;
    z-index: 1000000;
}

div.badge {
    cursor:pointer;
    position: relative;
    display: inline-block;
    border: green 1px solid;
    width: 130px;
    margin-bottom: 3px;
    text-align: center;
}

div.badge:hover div.appear, div.badge:hover div.appear_left{
    display:block;
}

/*front page */

[class*="front-"] {width: 100%}

@media only screen and (min-width: 768px){
#front_left {padding: 0.25em 1em;float: left;width: 57%;border: 1px solid rgba(33,33,33,0.1);background: #EAF5FB;box-sizing: border-box;border-radius: 0.2em;box-sizing:border-box;}
#front_right {padding: 0.25em 1em;float:left; width:40%; background: #FAF9EC; border: 1px solid rgba(33,33,33,0.1); margin-left: 4px;box-sizing:border-box;border-radius: 0.2em;}
div.front_title {font-size: large;border-bottom: 2px solid #36b;padding: 0.1em 0;margin: 0 0 0.5em 0;font-variant: small-caps;}
 
@media print{
#front_left {}
#front_right {}
}

/* Cours bases */
.PageFormsRadioButton {display:block;}

/* collection extension */

.onlyinprint {display: none}

/* Space out main section titles */
h1 {font-weight:bold;}
h2 {margin-top:3ex;font-weight:bold;}
h3 {margin-top:1ex;}

table.wikitable,
table.prettytable,
table.datatable {
  margin: 1em 1em 1em 0;
  background: #f9f9f9;
  border: 1px #aaaaaa solid;
  border-collapse: collapse;
}
 
table.datatable {
		font-size:70%
		}

table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
  border: 1px #aaaaaa solid;
  padding: 0.2em;
}

table.datatable th, table.datatable td {
  border: 1px #aaaaaa solid;
  font-size:70%	
  padding: 0em;
}
 
table.wikitable th,
table.datatable th,
table.prettytable th {
  background: #f2f2f2;
  text-align: center;
}
 
table.wikitable caption,
table.datatable caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
}

/* Extralarge big element in tables of class emoji, to display emojis */
table.emoji big {font-size:xx-large}

/* Removes useless links from printout */
@media print {
    .portlet, #privacy, #about, #disclaimer {display:none;}
}


/* Banner Styles used in EduTech wiki 
 - use class names like Banner_xxxx
 */

.Banner_incomplete {
  float:right;
  clear:right;
  width:200px;
  border:1px solid orange;
  background-color:#FFFACD;
  padding:7px; 
  margin-bottom: 10px;
  margin-left: 1em;
}

/* See http://svn.wikimedia.org/svnroot/mediawiki/trunk/extensions/PageBy/README */
ul.pageby {
    border:1px solid #60606F;
    background-color:#E0E0EF;
    font-size: 80%;
    margin:1ex;
    padding:1ex;
    list-style-type:none;
  }

.Banner_tutorial {
  float:right;
  clear:right;
  width:200px;
  border:1px solid blue;
  background-color:#F8C9E4;
  padding:7px; 
  margin-bottom: 10px;
  margin-left: 1em;
}

.tut_goals{
  background-color:#F8C9E4;
  padding:7px; 
  margin-bottom: 10px;
  border:1px solid #AAAAAA;
}

.Banner_copyright{
  background-color:#d0f0c0;
  padding:7px; 
  margin-bottom: 10px;
  border:1px solid #AAAAAA;
}

.tagcloud {
	width: 95%;
	text-align: center;
	background-color: #FDFDFD;
	border: 1px solid #EEEEEE;
	padding: 15px 10px 15px 10px;
 }
.tagcloud a {
	color: #0052CB;
	margin-left: 10px;
	margin-right: 10px;
	font-weight: bold;
 }

code {
  border: 1px solid #ddd;
  padding: 1px 4px;
  border-radius: 2px;
}

/* category tree - first is just for portlet - second for all trees */
/* 
#p-categorytree-portlet {font-size: 80% } 
*/
.CategoryTreeTag {font-size: 90%; }


/* Syntaxhighlight geshi */
div.mw-geshi {
  border: 1px dotted grey;
  padding: 2px; 
  margin-left:1em;
  font-size: 120%;
  margin-top:2px;
  margin-right:2px;
  margin-bottom:2px
 }


.sidebar_banner {
 margin-top: 5px;
 margin-bottom: 5px;
}

h3 .editsection { font-size: 76%; font-weight: normal; }
h4 .editsection { font-size: 86%; font-weight: normal; }
h5 .editsection { font-weight: normal; }
h6 .editsection { font-size: 125%; font-weight: normal; }

/* Contribution Scores */
.contributionscores-wrapper {  font-size: 80%; }
.contributionscores-title   { margin-left: 0; padding-left: 0em; margin-bottom: 0;}
.contributionscores .header { border-bottom: 1px solid #999999; font-weight: bold; }
.contributionscores .odd     { background-color: #eeeeee; }
.contributionscores .header td   { padding-left: .2em; padding-right: .2em; }
.contributionscores .content   { padding-left: .2em; padding-right: .2em; }

.GoBlock{
background: rgb(207,234,153);
border-radius: 3px;
display:inline-block;
color:#333333;
font-family:arial;
font-size:0.9em;
box-sizing: border-box;
padding:0 13px;
text-align:center;
border: 1px solid rgba(0,0,0,0.05);
line-height:1.5em;
}

.StopBlock{
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:rgb(200, 230, 140);
background-image: linear-gradient(rgb(248, 228, 158), rgb(220, 200, 130));
background-image: -webkit-linear-gradient(rgb(248, 228, 158), rgb(220, 200, 130));
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
text-indent:0;
border:1px solid rgb(155,185,95);
display:inline-block;
color:#333333;
font-family:arial;
font-size:13px;
font-style:normal;
text-decoration:none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:0px 8px;
text-align:center;
line-height:2.5em;
}

.tableBlue{
margin:auto;
background: #f9f9f9;
border-collapse: collapse;
width:98%;
text-align:center;
}

.tableBlue td{
border: 1px #aaaaaa solid;
padding:8px !important;
}

.tableBlue th{
background: rgb(200,220,240);
text-align: center;
font-weight:bold;
color:rgb(120,140,180);
padding: 8px 15px 8px 15px;
border: 1px #aaaaaa solid;
}

.tableBlue tr.row-odd{background:white;}
.tableBlue tr.row-even{background:rgb(235,245,255);}

/* Leyla formulaires STIC III/IV */

.annee.radioButtonItem {
  width: 10%;
  display: block;
  float:left;
}

.technologie.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}

.type.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}

.domaine_enseignement.checkboxLabel {
  width: 25%;
  display: block;
  float:left;
}

.niveau_enseignement.checkboxLabel {
  width: 33.3%;
  display: block;
  float:left;
}

.public_cible.checkboxLabel {
  width: 20%;
  display: block;
  float:left;
}
.public_age.checkboxLabel {
  width: 20%;
  display: block;
  float:left;
}

/* for smartphone display*/
pre{
word-break: break-word;
}

/*
</pre>
*/