MediaWiki:Common.css

De Cat OPIDoR
Révision datée du 14 juin 2017 à 11:16 par CiolekAnne (discussion | contributions) (Page créée avec « →‎Le CSS placé ici sera appliqué à tous les habillages. : *{box-sizing:border-box;} →‎ACCUEIL : [class*="container"],.leservice,.lastructure{display:-webkit-flex;di... »)
(diff) ← Version précédente | Voir la version actuelle (diff) | Version suivante → (diff)

Note : après avoir publié vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

  • Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
  • Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
  • Internet Explorer / Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
  • Opera : appuyez sur Ctrl + F5.
/* Le CSS placé ici sera appliqué à tous les habillages. */
*{box-sizing:border-box;}

/*ACCUEIL*/

[class*="container"],.leservice,.lastructure{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
[class*="grid-2"]> *{width:calc(50% - 1.25em);margin-left:1.25em;margin-bottom:1.25em;}
[class*="container"] h3{padding-top:0;padding-left:3%;background-image: linear-gradient(90deg, rgb(255,207,15) 1%, rgb(255, 255, 255) 1%, rgb(255, 255, 255) 50%, rgba(255,207,15,.5));margin-top:1em}
.cycle{background:transparent url("/images/a/ae/CycleVieCatOpidorB.png")no-repeat;position:relative;margin-top:1em}
.grandcycle{min-height:28em;}

.rond{border: 1px solid rgb(210, 210, 210);border-radius: 50%;display: -webkit-flex;display: -ms-flexbox;display: flex;height: 6em;width: 6em;line-height: 1.3em;background-color: rgba(255, 207, 15,.1);}
.rond {-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);transition:1s;}
.rond:hover,.rond:focus{background-color: rgba(255, 207, 15,.5);border: 1px solid rgb(255, 207, 15);-webkit-transform:scale(1.3);-ms-transform:scale(1.3);transform:scale(1.3)}
.Planification{position: absolute;left: 10.9em;top: 0.1em;*/left: 10.95em;top: 0.2em;}
.Collecte{position:absolute;top:3.4em;left:18.1em}
.Analyse{position:absolute;top:10.6em;left:21em}
.Documentation{position:absolute;top:18.1em;left:18.1em;font-stretch: condensed;}
.Stockage{position:absolute;top:21.2em;left:10.6em}
.Conservation{position:absolute;top:18em;left:3.1em;font-stretch: condensed;}
.Exposition{position:absolute;top:10.5em;left:0.2em}
.Réutilisation{position:absolute;top:3.1em;left:3.4em}

.rond  > a{-webkit-flex:0 1 6em;-ms-flex:0 1 6em;flex:0 1 6em;text-align: center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}

.catopidor-mainpage ul{list-style:none;}
.catopidor-mainpage li{padding:0.22em;border-bottom:1px solid rgba(210, 210, 210,.5);font-variant:small-caps}
.two ul a,.three ul a{display:block}
.catopidor-mainpage li:hover,.catopidor-mainpage li:focus{border-bottom:1px solid rgb(255,207,15);background-color:rgba(255,207,15,0.1);}

 /*INFOBOX*/
.infobox{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}

.identiteservice{padding:.5em;border:1px solid rgba(255,207,15,.5);width:33em}
.identitestructure{padding:.5em;border:1px solid rgba(67,146,195,.5);width:33em}
.identiteservice tr,.identitestructure tr{text-align:left;vertical-align:top}
.identiteservice > caption{background-image: linear-gradient(90deg, rgb(255, 207, 15) 5%, rgb(255, 255, 255) 20%, rgb(255, 255, 255) 80%, rgb(255, 207, 15));color: #333;font-weight:bold;border-radius:5px 5px 0 0;padding:.5em;}
.identitestructure > caption{background-image: linear-gradient(90deg, rgb(67, 146, 195) 5%, rgb(255, 255, 255) 20%, rgb(255, 255, 255) 80%, rgb(67, 146, 195));color: #333;font-weight:bold;border-radius:5px 5px 0 0;padding:.5em;}
.identiteservice th,.identitestructure th{font-weight:normal;color:grey;}

.infobox .titre{font-variant:small-caps;text-align:center;font-weight:bold}
.petitcycle{width:20.5em;height:20.5em;background-size:contain;margin:0 auto}
.petitcycle .rond{font-size:75%}

.infobox > .maps-leaflet{margin:0 auto;}

/*DETAIL*/
.detail{-webkit-box-flex:1;-ms-flex:1;flex:1;margin-right:1em;}
.construc{font-style:italic;font-size: 90%;}
.description{margin-bottom:2em;padding-left:4em;padding-top:2em;min-height:84px}
.service{background:transparent url("/images/f/f0/Bg_description_service.png")no-repeat left top;}
.structure{background:transparent url("/images/d/d0/Bg_description_structure.png")no-repeat left top;}
.leservice .detail p, .detail>.cycle{margin-left:4em;}
div.description p,p.construc{margin-left:0}
.libelle{display:block;color:grey;margin-left:-4em;}
.section{border-top:1px dashed #ffcf0f}


/*TABLES*/
table.wikitable{border:none;background-color:transparent;border-collapse: collapse;text-align:left;width:100%}

table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
 border: 0; padding: 0.22em 1em; min-width:12em}
table.wikitable > tr,table.wikitable > * > tr,.infoboxservice tr{border-bottom: 1px solid rgba(210, 210, 210, 0.5);}
table.wikitable > * > tr:hover,table.wikitable > * > tr:focus{border-bottom:1px solid rgb(255,207,15);background-color:rgba(255,207,15,0.1);}

/*RESULT */
.headerSort{font-variant:small-caps}

/*FORMS*/
table.formtable th{min-width:20%}
#pfForm .mandatoryField{border:1px solid rgb(214, 96, 77)}

@media screen and (max-width: 65em){
[class*="-tiny-1"]> *{width:calc(100% - 1.25em);}
.leservice,.lastructure{flex-direction:column}
.infobox{margin-top:1em;}
.identiteservice,.identitestructure{order:0;width:100%}
table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
min-width:100%}
}