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

Une nouvelle de Wikinews, la source d'informations que vous pouvez écrire.
Contenu supprimé Contenu ajouté
m coquille :(
m test pour un survol à la souris de certaines rangées de tableau
Ligne 3 : Ligne 3 :


Cette page contrôle l'apparence, pour toutes les skins.<br />Les modifications devant s'appliquer à la seule apparence Monobook seront portées dans [[MediaWiki:Monobook.css]].
Cette page contrôle l'apparence, pour toutes les skins.<br />Les modifications devant s'appliquer à la seule apparence Monobook seront portées dans [[MediaWiki:Monobook.css]].

== Survol des rangées de tableau à la souris ==

Inspiré de [[es:MediaWiki:Common.css]]

<source lang="css">*/
/* Efectos con hover para tablas */

table.hovertr tr:hover { background: #FFCC66; } /* no se puede aplicar un fondo de color */

tr.gris-hover { background: #EFEFEF }
tr.gris-hover:hover { background: #FFCC66; }

tr.blanco-hover { background:#FFFFFF }
tr.blanco-hover:hover { background: #FFCC66; }

/*</source>


== Interligne des titres de pages ==
== Interligne des titres de pages ==





<source lang="css">*/
<source lang="css">*/

Version du 18 septembre 2009 à 17:45

/*
<big>'''Feuille de style globale'''</big>

Cette page contrôle l'apparence, pour toutes les skins.<br />Les modifications devant s'appliquer à la seule apparence Monobook seront portées dans [[MediaWiki:Monobook.css]].

== Survol des rangées de tableau à la souris ==

Inspiré de [[es:MediaWiki:Common.css]]

<source lang="css">*/
/* Efectos con hover para tablas */

table.hovertr tr:hover { background: #FFCC66; }  /* no se puede aplicar un fondo de color */

tr.gris-hover { background: #EFEFEF }
tr.gris-hover:hover { background: #FFCC66; }

tr.blanco-hover { background:#FFFFFF }
tr.blanco-hover:hover { background: #FFCC66; } 

/*</source>

== Interligne des titres de pages ==




<source lang="css">*/
h1.firstHeading {
          line-height: 1.2em;
}
/*</source>

Ce réglage est utile pour les titres de page « à rallonge », débordant sur la deuxième ligne.

== En-tête des articles quotidiens de brèves ==

Certains de ces réglages sont également utilisés par l'en-tête des [[Wikinews:Interview|interviews]] ou des [[Wikinews:Médias|listes de médias]].

<hr style="margin: 1.5em" />

<source lang="css">*/
div.breves {
          border-top: 1px solid #99b2cc;
          border-right: 2px solid #99b2cc;
          border-bottom: 2px solid #99b2cc;
          border-left: 1px solid #99b2cc;
          background-color: #f6f6f6;
          padding: 0.5em;
          margin-bottom: 1em;
}
/*</source>

Cette classe détermine l’apparence générale de la boîte d’en-tête.

<hr style="margin: 1.5em" />

<source lang="css">*/
div.breves div.bloc_0 {
          padding-bottom: 0.5em;
}
/*</source>

Cette classe n'est utilisée que si elle est immédiatement suivie par le bloc de sommaire.

<hr style="margin: 1.5em" />

<source lang="css">*/
div.breves div.bloc_1 {
          border-bottom: 1px solid #99b2cc;
          padding-bottom: 0.5em;
}
div.breves div.bloc_2 {
          text-align: left;
          padding: 0.5em 0 0 1.5em;
          margin-bottom: 0.5em;
}
/*</source>

Dans les autres cas apparaissent :
*un bloc de classe .bloc_1,
*un autre bloc, de classe .bloc_2,
*un bloc de sommaire horizontal.

== Sommaire horizontal ==

<source lang="css">*/
div.toc_breves {
          border-top: 1px solid #99b2cc;
          padding-top: 0.5em;
}
div.toc_breves .tocindent {
          margin: 0;
}
div.toc_breves table#toc ul {
          display: inline;
}
div.toc_breves table#toc ul li {
          display: inline;
}
div.toc_breves table#toc .toctoggle {
          display: none;
}
div.toc_breves table#toc ul li span.tocnumber {
          display: none;
}
div.toc_breves table#toc ul li:before {
          content: " ··· ";
}
div.toc_breves table#toc div#toctitle {
          display: inline;
}
div.toc_breves table#toc div#toctitle h2 {
          display: inline;
}
div.toc_breves table#toc {
          border: 0;
          padding: 0;
          background-color: #f9f9f9;
}
/*</source>

L'ensemble de ces réglages déterminent l'apparence du sommaire horizontal.

Le sommaire horizontal est utilisé :
*dans les [[Wikinews:Brèves|articles quotidiens de brèves]] ;
*dans les [[Wikinews:Interviews|interviews]] (facultatif) ;
*dans les [[Wikinews:Médias|listes de médias]].

== Apparence du titre de section « Notes » ==

<source lang="css">*/
h2.notes span.editsection {
          display:none
}
/*</source>

Cette classe entraîne la suppression du lien [modifier] à côté du titre de la section consacrée aux notes.

== Masquage du titre de la page [[Accueil]] ==

<source lang="css">*/
.page-Accueil .firstHeading {
          display:none;
}
.page-Accueil #ca-nstab-main a {
          content:"Accueil";
}
/*</source>

Cette classe masque la barre de titre de la page [[Accueil]] et remplace, dans l'onglet de gauche, le libellé {{guil|Article}} par le libellé {{guil|Accueil}}.

== Apparence de la page d'accueil ==

<source lang="css">*/
table.bandeau_accueil {                    /* bandeau supérieur */
        width: 100%;
        margin-top: 0;
        margin-bottom: 1em;
        border-top: 2px solid #99b2cc;
        border-right: 2px solid #99b2cc;
        border-bottom: 1px solid #99b2cc;
        border-left: 1px solid #99b2cc;
}
span.accueil_WIKI {
        color: #444444;
        font-size: 2em;
        font-weight: bold;
}
span.accueil_NEWS {
        color: #999999;
        font-size: 2em;
        font-weight: bold;
}
span.accueil_FRANC {
        color: #aa0000;
        font-size: 1.2em;
        font-weight: bold;
        letter-spacing: 1px;
}
div.bord_VOUS {
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        padding: 3px;
}
span.VOUS {
        color: #aa0000;
        font-style: italic;
}
div.float_accueil {                        /* icônes flottant à droite des zones */
        float: right;
        padding: 5px;
}
div.accueil_zone {
        padding: 1em 5px 0 5px;
}
div.gauche_accueil {                       /* réglage général : zones de gauche */
        border-top: 2px solid #99b2cc;
        border-right: 2px solid #99b2cc;
        border-bottom: 1px solid #99b2cc;
        border-left: 1px solid #99b2cc;
        margin-bottom: 3ex;
}
span.gauche_accueil_T {
        font-size: 150%;
        padding: 5px;
        border-right: 2px solid #99b2cc;
        border-bottom: 2px solid #99b2cc;
        border-left: 1px solid #99b2cc;
}
div.droite_accueil {                       /* réglage général : zones de droite */
        border-top: 2px solid #d0d0d0;
        border-right: 2px solid #d0d0d0;
        border-bottom: 1px solid #d0d0d0;
        border-left: 1px solid #d0d0d0;
        margin-bottom: 3ex;
}
span.droite_accueil_T {
        font-size: 150%;
        margin-bottom: 1em;
        padding: 5px;
        border-right: 2px solid #d0d0d0;
        border-bottom: 2px solid #d0d0d0;
        border-left: 1px solid #d0d0d0;
}
div.bas_accueil {
        border-top: 2px solid #d0d0d0;
        border-right: 2px solid #d0d0d0;
        border-bottom: 1px solid #d0d0d0;
        border-left: 1px solid #d0d0d0;
        padding: 5px 5px 0 5px;
        margin-bottom: 3ex;
}
/*</source>

== Boîtes déroulantes ==

<source lang="css">*/

div.BoxenVerschmelzen, div.NavFrame {
     margin: 0px;
     padding: 2px;
     text-align: center;
     border-collapse: collapse;
     font-size: 95%;
}
div.BoxenVerschmelzen div.NavFrame {
     border-style: none;
     border-style: hidden;
}
div.NavFrame + div.NavFrame {
     border-top-style: none;
     border-top-style: hidden;
}
div.NavPic {
     background-color: #ffffff;
     margin: 0px;
     padding: 2px;
     float: left;
}
div.NavFrame div.NavHead {
     height: 1.6em;
     font-weight: bold;
     font-size:100%;
     background-color: #efefef;
}
div.NavFrame p {
     font-size: 100%;
}

div.NavFrame div.NavContent {
     font-size: 100%;
}
div.NavFrame div.NavContent p {
     font-size: 100%;
}
div.NavEnd {
     margin: 0px;
     padding: 0px;
     line-height: 1px;
     clear: both;
}
.NavToggle {
        font-size: x-small;
        float: right;
        margin-right: 4px;
}

/*</source>

== Capitalisation des onglets ==

Sans ce réglage, certains onglets ({{guil|modifier}}, {{guil|renommer}}) ont un libellé entièrement en bas-de-casse, tandis que d'autres ({{guil|Message}} ou {{guil|Article}} ou {{guil|Spécial}}, {{guil|Discussion}}, {{guil|Historique}}, {{guil|Protéger/Déprotéger}}, {{guil|Protéger/Déprotéger}}, {{guil|Suivre/Ne plus suivre}}) ont un libellé avec majuscule...

<source lang="css"> */

#p-cactions li:first-letter, #p-cactions li a:first-letter {text-transform: capitalize;}

/* </source>

== Modifications récentes ==

<source lang="css"> */

table.rc_text {
        background-color: #f8fcff;
        margin-bottom: 1em;
        border-top: 1px solid #99b2cc;
        border-right: 2px solid #99b2cc;
        border-bottom: 2px solid #99b2cc;
        border-left: 1px solid #99b2cc;
}
table.rc_text td {
        vertical-align: top;
}
table.rc_text td.rc_left {
        font-weight: bold;
        text-align: right;
}
/* </source>
 
== En-tête de la Salle café ==

<source lang="css"> */

table.entete_cafe {
        margin-bottom: 1em;
        border-top: 1px solid #99b2cc;
        border-right: 2px solid #99b2cc;
        border-bottom: 2px solid #99b2cc;
        border-left: 1px solid #99b2cc;
}
table.entete_cafe td {
        background-color: #f8fcff;
        color: #000000;
}
div.deroule_cafe {
        margin: 1em 0.5em 0.5em 0.5em;
}
/* </source> 

== Pied de page ==

<source lang="css"> */

div#footer li {
        display: block;
}
div#footer li#privacy, div#footer li#about, div#footer li#disclaimer {
        display: inline;
}
/* </source>

Ces réglages permettent de séparer, dans le pied de page, le message de licence, sur la deuxième ligne, des trois messages suivants (Politique de confidentialité, À propos de Wikinews, Avertissements). Précédemment, on voyait Licence + Politique de confidentialité sur la 2{{e}} ligne, puis À propos de Wikinews, Avertissements sur la 3{{e}} ligne... 

<source lang="css"> */

div.footer_license {
        padding-top: 0.5em;
        padding-bottom: 0.5em;
        font-size: 1.1em;
}
div.trademark {
        padding-bottom: 0.5em;
        font-size: 1.1em;
}
/* </source>

Ces réglages permettent l'isolation, au sein du pied de page, du message de présentation de la marque déposée et des liens vers la Wikimedia Foundation et vers l'article WP-EN sur son statut fiscal. 

== Encadrement de l'image de une ==

<source lang="css"> */

div.image_une {
        border: 1px solid #99b2cc;
        padding: 3px;
        margin-right: 5px;
}
/* </source> 

== Archives quotidiennes ==

<source lang="css"> */

div.journee div.titre_journee {
        font-size: 1.3em;
        font-weight: bold;
        margin-top: 0.5em;
}

/* </source>

== Références ==
<source>*/

/* Éviter d'obtenir un interlignage de taille variable. */
.reference, .exposant { 
 vertical-align:text-top;
 position:relative;
 font-size:.7em;
 top:-5px;
}
.reference {
 padding-left:1px;
}

/* </source> */

  /************************/
  /* CommonsTicker styles */
  /************************/
 
  /* links */
  .tickerDiffLink { } /* diff links in ticker */
  .tickerMiscLink { } /* misc links in ticker */
 
  /* remove list bullets */
  .tickerList ul,    .tickerList ul li    { list-style: none; text-indent:-2em; margin-left:2em;   text-align:left; }
  .tickerList ul ul, .tickerList ul ul li { list-style: none; text-indent:0;    margin-left:1.5em; text-align:left; }

  /* per-type styles */
  .tickerEntry_deleted     { }  /* entry for image deletion */
  .tickerEntry_restored    { }  /* entry for restored image */
  .tickerEntry_replaced    { }  /* entry for image replacement */
  .tickerEntry_tagged      { }  /* entry for adding/removing problem tags */
  .tickerEntry_redir       { }  /* entry for critical redirection (fot tag redirects) */
  .tickerEntry_recat       { }  /* entry for critical re-categorization (for tag categories) */
  .tickerEntry_notify      { }  /* entry for global notifications */
  .tickerEntry_changed     { }  /* entry for generic change */

  /* per-status styles */
  .tickerStatus_done     { text-decoration:line-through; }  /* strike through when entry has been handeled */

  /* per-action styles */
  .tickerAction_deleted:before     { content:" GONE "; color: #FF0000; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_restored:before    { content:" BACK "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_deletedRev:before  { content:" -OLD "; color: #DDAAAA; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_replaced:before    { content:" REPL "; color: #CC88FF; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_replacedOwn:before { content:" UPDT "; color: #EEAAFF; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_addedBad:before    { content:" +VfD "; color: #FF8800; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_removedBad:before  { content:" -VfD "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_addedGood:before   { content:" +OK  "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_removedGood:before { content:" -OK  "; color: #FF8800; font-family:monospace; font-weight:bold; font-size:100%; }

  /* ticker usage list */
  .tickerUsage  { font-size:80%; }  

  /* entry applies to a template used by multiple images */
  .tickerTemplateEntry    { font-weight: bold; } 

  /* entry applies to sub-entries, i.e. images that use a specific template */
  .tickerSubEntry         { }                       

  /* minor entry styles */ 
  .tickerMinorEntry  { color:#666; }     /* minor entry */
  .tickerMinorEntry a,
  .tickerMinorEntry a:link,
  .tickerMinorEntry a:visited { color:#669; }
  #bodyContent .tickerMinorEntry a.extiw,
  #bodyContent .tickerMinorEntry a.extiw:link,
  #bodyContent .tickerMinorEntry a.extiw:visited { color:#669; }

 /* masquer certains boutons par défaut de la barre d'éditions */ 
 img#mw-editbutton-headline { display:none; }
 img#mw-editbutton-media { display:none; }
 img#mw-editbutton-math { display:none; }
 img#mw-editbutton-hr { display:none; }

/* BANDEAUX DE PAGE */
/* style par défaut des bandeaux vers page utilisé dans Modèle:Page et Modèle:Bandeau page
*/
#bandeau-page {
  border: solid #bfbfff 2px;
  padding: .1em;
  background-color: #FFFFFF;
  text-align: center;
  margin-top: 1em;
  margin-left: 0;
  clear: both;
}

#bandeau-page li {display: inline}
.bandeau-page-element {white-space: nowrap; margin: auto 1.5em}
.bandeau-page-icone {margin-right: 0.5em}
.bandeau-page-texte {font-size: 110%}

/* MESSAGEBOX */

/* Styles des « messagebox » standard. Utilisation : 
* class="messagebox" : voir [[modèle:Messagebox]].
* class="messagebox merge" : inutilisé ?
* class="messagebox cleanup" pour certains bandeaux de maintenance (exemple sur [[modèle:Résumé introductif]])
* class="messagebox standard-talk" pour les bandeaux en page de discussion des aricles (exemple : [[modèle:Traduit de]])
*/
.messagebox { /* monobookocentré */
 border:1px solid #AAA;
 background:#F9F9F9;
 width:80%;
 margin:0 auto 1em auto;
 padding:.2em;
 text-align:justify;
}

.messagebox.merge { /* monobookocentré */
 border:1px solid #CF9FFF;
 background:#F5EDF5;
 text-align:center;
}

.messagebox.cleanup { /* monobookocentré */
 border:1px solid #9F9FFF;
 background:#EFEFFF;
 text-align:center;
}

.messagebox.standard-talk { /* monobookocentré */
 border:1px solid #C0C090;
 background:#F8EABA;
}

/* MESSAGES SYSTÈME */
 
/* Standardisation de quelques messages systèmes :
 * class="mw-alerte" : bandeaux d'alerte comme [[MediaWiki:Editinginterface]].
 * class="mw-toolbox" : boîtes à outils comme sur [[MediaWiki:Sp-contributions-footer]].
 */
 
/* Bandeau jaune / rouge en cas de retard de la base de données. */
div.mw-lag-warn-normal, div.mw-lag-warn-high {
 text-align:left !important;
 width:50% !important;
}
 
/* suppression du message avertissant du lag de 1 seconde dans la liste de suivi*/
.mw-lag-warn-normal {
 display:none;
}
 
/* Messages d'alerte */
.mw-alerte {
 width:100%;
 clear:both;
 background:#FAEBD7;
 border:2px solid #FF8C00;
}
 
/* Boîtes à outils */
.mw-toolbox { /* monobookocentré */
 font-size:90%;
 background:#F8F8F8;
 border:1px solid #B8B8B8;
 padding:.25em 1em .25em 1em;
 clear:both;
}

/*Ticker2 (animated ticker) (Modèle:Ticker)*/
ul.actualTicker li {list-style-type:none; list-style-image:none;}/*mostly for IE*/
ul.actualTicker li {display:inline;}
ul.actualTicker span.tickerIntroduction {font-weight:bold;padding-right:0.5em;}
 
div.isATicker, div#singleTickerForPage {display:none;}



/*###############################################
##Tabber stuff. See code in mediawiki:common.js 
#################################################*/

/*===Wikinews specific==== */

/*horizTabBox*/

div.horizTabBox ul.tabbernav li a {
 background-color:#7ec9fd;
margin-left: 15px;
border-bottom: solid 1px #7ec9fd;
padding-left:0.8em;
padding-right:0.8em;
-moz-border-radius:1em 1em 0 0; /* this should be replaced with images for browsers that don't support it somehow*/
/*webkit doesn't like too big radii or having it in the shorthand form. Make sure radi < 1.7em */
-webkit-border-top-left-radius:1em;
-webkit-border-top-right-radius:1em;
border-radius:1em 1em 0 0;
}

div.horizTabBox ul.tabbernav li.tabberactive a
{
 background-color: #bce1ff;
 border-bottom: 3px solid #bce1ff;
 margin-left:10px;
}
div.horizTabBox .tabbertab 
{
border:solid 2px #7ec9fd;
padding:0;
}
div.horizTabBox ul.tabbernav li a:hover
{
 color: #000;
 background: #bce1ff;
 border-bottom: 3px solid #bce1ff;
}

div.horizTabBox ul.tabbernav li.tabberactive a:hover
{
 color: #000;

}
div.horizTabBox { width:80%;margin-left:auto;margin-right:auto;text-align:left;}
div.horizTabBox {min-width:41em;max-width:47em;} /* IMPORTANT: keep width:80% above or it will suck on IE*/


/* pict box */

div.pictChanger ul.tabbernav {line-height: 2.4;}
div.pictChanger ul.tabbernav li a {border: #CCC 1px solid}
div.pictChanger {width:400px;}
div.pictChanger div.tabbertab {text-align:left;}

/*
===Generic defaults===

Copied from http://www.barelyfitz.com/projects/tabber/example.css used under mit license
see http://www.barelyfitz.com/projects/tabber/
*/
/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #CCC;
 font: bold 12px Verdana, sans-serif;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 3px 0.5em;
 margin-left: 3px;
 border: 1px solid #ccc;
 border-bottom: none;
 background: #f2f7ff;
 text-decoration: none;
}

ul.tabbernav li a:link { color: #448; }
ul.tabbernav li a:visited { color: #667; }

ul.tabbernav li a:hover
{
 color: #000;
 background: #fff9f2;
 border-color: #CCC;
}

ul.tabbernav li.tabberactive a
{
 background-color: #fff;
 border-bottom: 1px solid #fff;
}

ul.tabbernav li.tabberactive a:hover
{
 color: #000;
 background: white;
 border-bottom: 1px solid white;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:5px;
 border:1px solid #CCC;
 border-top:0;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}