MediaWiki:PageServices.css

/** SERVICES **/
.services button:not(.collapsed):before {
  content: url('data:image/svg+xml;utf8,<svg fill="#4c9c2e" width="48px" height="48px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>chevron-up</title><polygon points="21.1 18.7 12 9.6 2.9 18.7 0.1 15.8 12 3.9 23.9 15.8 21.1 18.7"/></svg>');
}

.services button.collapsed:before {
  content:"";
}

.services button:not(.collapsed) a,
.services button.collapsed:before a {
  text-decoration:none;
  color:white;
}

/** Entêtes deux couleurs **/

.service-carbone button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_CO2_Blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-carbone button:not(.collapsed),
.service-carbone button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_CO2_Bleu.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-microforet button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_Microforet_Blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-microforet button:not(.collapsed),
.service-microforet button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_Microforet_vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-comestible button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_Amenagement_Comestible_blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-comestible button:not(.collapsed),
.service-comestible button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_Amenagement_Comestible_vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-foretcorppo button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_Team_Building_Blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-foretcorppo button:not(.collapsed),
.service-foretcorppo button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_Team_Building_vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-haie button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_Agroforesterie_blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-haie button:not(.collapsed),
.service-haie button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_Agroforesterie_Vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-paysage button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_Paysage_blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-paysage button:not(.collapsed),
.service-paysage button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_Paysage_Vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}
.service-renat button.collapsed {
  background-image: url("themes/images/Page_Services/Icones/Icone_renaturalisation_blanc.svgz");
  background-repeat:no-repeat; background-position:95% 0; background-color:#4c9c2e;color:white;
}
.service-renat button:not(.collapsed),
.service-renat button.collapsed:hover {
  background-image: url("themes/images/Page_Services/Icones/Icone_renaturalisation_Vert.svgz"); 
  background-repeat:no-repeat; background-position:95% 0; background-color:white; color:#4c9c2e;
}