[Sommaire] [Imprimer]

   1  /****************************************************************/

   2  /* 1. IMPORT DES FEUILLES DE STYLE */

   3  /****************************************************************/

   4  
   5  /* Import de la feuille de style de base */

   6  @import url(imports/base.css);
   7  /* Import du thème de couleur */

   8  @import url(imports/Oxygen_cs.css);
   9  
  10  /****************************************************************/

  11  /* 2. PARAMETRES DU TEXTE */

  12  /****************************************************************/

  13  
  14  /* 2.1 Ceci fixe la famille de police par défaut */

  15  
  16  .pun, .pun INPUT, .pun SELECT, .pun TEXTAREA, .pun OPTGROUP {
  17      FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
  18  }
  19  
  20  .pun {FONT-SIZE: 11px; LINE-HEIGHT: normal}
  21  
  22  /* Taille de police d'Internet Explorer seulement - pour permettre à IE de zoomer.  N'enlevez pas les commentaires \*/

  23  * HTML .pun {FONT-SIZE: 68.75%}
  24  /* Fin de la taille des polices pour IE */

  25  
  26  /* Règle la taille de la police pour ces tableaux parce que IE l'exige */

  27  .pun TABLE, .pun INPUT, .pun SELECT, .pun OPTGROUP, .pun TEXTAREA, DIV.postmsg P.postedit {FONT-SIZE: 1em}
  28  
  29  /* 2.2 Règle la taille de la police pour le texte préformaté c.-à-d. dans des boîtes de code */

  30  
  31  .pun PRE {FONT-FAMILY: monaco, "Bitstream Vera Sans Mono", "Courier New", courier, monospace}
  32  
  33  /* 2.3 Taille de police pour les en-têtes (headers en anglais) */

  34  
  35  .pun H2, .pun H4 {FONT-SIZE: 1em}
  36  .pun H3 {FONT-SIZE: 1.1em}
  37  #brdtitle H1 {FONT-SIZE: 1.4em}

  38  
  39  /* 2.4 Texte plus gros pour les objets particuliers */

  40  
  41  DIV.postmsg P {LINE-HEIGHT: 1.4}
  42  DIV.postleft DT {FONT-SIZE: 1.1em}
  43  .pun PRE {FONT-SIZE: 1.2em}
  44  
  45  /* 2.5 Texte en gras */

  46  
  47  DIV.postleft DT, DIV.postmsg H4, TD.tcl H3, DIV.forminfo H3, P.postlink, DIV.linkst LI,
  48  DIV.linksb LI, DIV.postlinksb LI, .blockmenu LI, #brdtitle H1, .pun SPAN.warntext, .pun P.warntext {FONT-WEIGHT: bold}
  49  
  50  /****************************************************************/

  51  /* 3. LIENS */

  52  /****************************************************************/

  53  
  54  /* 3.1 Enlève le soulignement pour le menu principal, les liens en en-tête, les liens et les menus verticaux */

  55  
  56  #brdmenu A:link, #brdmenu A:visited, .blockpost DT A:link, .blockpost DT A:visited, .blockpost H2 A:link,

  57  .blockpost H2 A:visited, .postlink A:link, .postlink A:visited, .postfootright A:link, .postfootright A:visited,
  58  .blockmenu A:link, .blockmenu A:visited {
  59      TEXT-DECORATION: none
  60  }
  61  
  62  /* 3.2 Souligne au passage de la souris (ou hover en anglais) pour des liens dans les en-têtes et dans le menu principal */

  63  
  64  #brdmenu A:hover, .blockpost H2 A:hover {TEXT-DECORATION: underline}

  65  
  66  /****************************************************************/

  67  /* 4. LARGEUR ET MODÈLE DE BORDURE */

  68  /****************************************************************/

  69  
  70  /* 4.1 Par défaut les bordures sont solides (forment un trait plein) et font 1 pixel */

  71  
  72  DIV.box, .pun TD, .pun TH, .pun BLOCKQUOTE, DIV.codebox, DIV.forminfo, DIV.blockpost LABEL {
  73      BORDER-STYLE: solid;
  74      BORDER-WIDTH: 1px
  75  }
  76  
  77  /* 4.2 Réglages spéciaux pour le logo du forum */

  78  
  79  #brdheader DIV.box {BORDER-TOP-WIDTH: 4px}

  80  
  81  /* 4.3 Bordures pour les cellules des tableaux */

  82  
  83  .pun TD, .pun TH {
  84      BORDER-BOTTOM: none;
  85      BORDER-RIGHT: none
  86  }
  87  
  88  .pun .tcl {BORDER-LEFT: none}
  89  
  90  /* 4.4 Réglage spécial pour les jeu de champs afin de préserver ceux par défaut de IE */

  91  
  92  DIV>FIELDSET {
  93      BORDER-STYLE: solid;
  94      BORDER-WIDTH: 1px
  95  }
  96  
  97  /****************************************************************/

  98  /* 5. ESPACEMENT VERTICAL ET DE LA PAGE */

  99  /****************************************************************/

 100  
 101  /* 5.1 Marge des pages */

 102  
 103  HTML, BODY {MARGIN: 0; PADDING: 0}
 104  #punwrap {margin:12px 20px}

 105  
 106  /* 5.2 Crée un espace vertical entre les éléments du tableau de bord (marges) */

 107  
 108  DIV.blocktable, DIV.block, DIV.blockform, DIV.block2col, #postreview {MARGIN-BOTTOM: 12px}
 109  #punindex DIV.blocktable, DIV.blockpost {MARGIN-BOTTOM: 6px}

 110  DIV.block2col DIV.blockform, DIV.block2col DIV.block {MARGIN-BOTTOM: 0px}
 111  
 112  /* 5.3 Supprime l'espace au-dessus des breadcrumbs (infos qui indiquent l'emplacement exact d'une page au sein d'une arborescence) et des liens qui ont une marge supérieure négative */

 113  
 114  DIV.linkst, DIV.linksb {MARGIN-TOP: -12px}
 115  DIV.postlinksb {MARGIN-TOP: -6px}
 116  
 117  /* 5.4 Mets un espace de 12px au-dessus de la boîte d'information du forum sur la page d'index parce que les tableaux de catégorie ont un espace de seulement 6px sous eux  */

 118  
 119  #brdstats {MARGIN-TOP: 12px}

 120  
 121  /****************************************************************/

 122  /* 6. ESPACEMENT AUTOUR DU CONTENU */

 123  /****************************************************************/

 124  
 125  /* 6.1 Remplissage par défaut des éléments principaux */

 126  
 127  DIV.block DIV.inbox, DIV.blockmenu DIV.inbox {PADDING: 3px 6px}
 128  .pun P, .pun UL, .pun DL, DIV.blockmenu LI, .pun LABEL, #announce DIV.inbox DIV {PADDING: 3px 0}
 129  .pun H2 {PADDING: 4px 6px}
 130  
 131  /* 6.2 Espacement spécial pour divers éléments */

 132  
 133  .pun H1 {PADDING: 3px 0px 0px 0}
 134  #brdtitle P {PADDING-TOP: 0px}

 135  DIV.linkst {PADDING: 8px 6px 3px 6px}
 136  DIV.linksb, DIV.postlinksb {PADDING: 3px 6px 8px 6px}
 137  #brdwelcome, #brdfooter DL A, DIV.blockmenu LI, DIV.rbox INPUT  {LINE-HEIGHT: 1.4em}

 138  #viewprofile DT, #viewprofile DD {PADDING: 0 3px; LINE-HEIGHT: 2em}

 139  
 140  /* 6.4 Crée un espacement horizontal pour divers éléments */

 141  
 142  #brdmenu LI, DIV.rbox INPUT, DIV.blockform P INPUT  {MARGIN-RIGHT: 12px}

 143  
 144  /****************************************************************/

 145  /* 7. ESPACEMENT POUR LES TABLEAUX */

 146  /****************************************************************/

 147  
 148  .pun TH, .pun TD {PADDING: 4px 6px}
 149  .pun TD P {PADDING: 5px 0 0 0}
 150  
 151  /****************************************************************/

 152  /* 8. ESPACEMENT POUR LES POSTS */

 153  /****************************************************************/

 154  
 155  /* 8.1 Remplissage autour des colonnes gauches et droites dans viewtopic */

 156  
 157  DIV.postleft DL, DIV.postright {PADDING: 6px}
 158  
 159  /* 8.2 Espacement supplémentaires pour contacter le posteur et pour son avatar */

 160  
 161  DD.usercontacts, DD.postavatar {MARGIN-TOP: 5px}
 162  DD.postavatar {MARGIN-BOTTOM: 5px}
 163  
 164  /* 8.3 Espacement supérieur supplémentaire pour les signatures pour "édité par" */

 165  
 166  DIV.postsignature, DIV.postmsg P.postedit {PADDING-TOP: 15px}
 167  
 168  /* 8.4 Espacement pour les boîtes de code et de citation */

 169  
 170  DIV.postmsg H4 {MARGIN-BOTTOM: 10px}
 171  .pun BLOCKQUOTE, DIV.codebox {MARGIN: 5px 15px 15px 15px; PADDING: 8px}
 172  
 173  /* 8.5 Remplissage pour les liens d'action (ex : Poster une réponse) et l'indicateur en ligne dans viewtopic */

 174  
 175  DIV.postfootleft P, DIV.postfootright UL, DIV.postfootright DIV {PADDING: 10px 6px 5px 6px}
 176  
 177  /* 8.6 Ceci est l'entrée visuelle des modérateurs pour supprimer plusieurs sujets */

 178  
 179  DIV.blockpost INPUT, DIV.blockpost LABEL {
 180      PADDING: 3px;
 181      DISPLAY: inline
 182  }
 183  
 184  P.multidelete {
 185      PADDING-TOP: 15px;
 186      PADDING-BOTTOM: 5px
 187  }
 188  
 189  /* 8.7 S'assure que les paragraphes dans des posts n'obtiennent aucune remplissage */

 190  
 191  DIV.postmsg P {PADDING: 0}
 192  
 193  /****************************************************************/

 194  /* 9. ESPACEMENT SPECIAL POUR LES FORMULAIRES */

 195  /****************************************************************/

 196  
 197  /* 9.1 Remplissage autour des champs */

 198  
 199  DIV.blockform FORM, DIV.fakeform {PADDING: 20px 20px 15px 20px}
 200  DIV.inform {PADDING-BOTTOM: 12px}
 201  
 202  /* 9.2 Remplissage à l'intérieur des champs */

 203  
 204  .pun FIELDSET {PADDING: 0px 12px 0px 12px}
 205  DIV.infldset {PADDING: 9px 0px 12px 0}
 206  .pun LEGEND {PADDING: 0px 6px}
 207  
 208  /* 9.3 Pour la boîte d'information au dessus du formulaire d'enregistrement et ailleurs */

 209  
 210  DIV.forminfo {
 211      MARGIN-BOTTOM: 12px;
 212      PADDING: 9px 10px
 213  }
 214  
 215  /* 9.4 Liens d'aide de BBCode sous les formulaires de post */

 216  
 217  UL.bblinks LI {PADDING-RIGHT: 20px}
 218  
 219  UL.bblinks {PADDING-BOTTOM: 10px; PADDING-LEFT: 4px}
 220  
 221  /* 9.5 Positionnement horizontal pour le bouton d'envoi des formulaires */

 222  
 223  DIV.blockform P INPUT {MARGIN-LEFT: 12px}
 224  
 225  /****************************************************************/

 226  /* 10. INDICATEURS DE STATUTS DES POST */

 227  /****************************************************************/

 228  
 229  /* 10.1 Ce sont les indicateurs de statut des post, qui apparaissent à gauche de quelques tableaux : 

 230  .inew = nouveaux posts, .iredirect = forums de redirection, .iclosed = sujets fermés 

 231  et .isticky = sujets épinglés. Par défaut seul .inew est différent du défaut. */
 232  
 233  DIV.icon {
 234      FLOAT: left;
 235      MARGIN-TOP: 0.1em;
 236      MARGIN-LEFT: 0.2em;
 237      DISPLAY: block;
 238      BORDER-WIDTH: 0.6em 0.6em 0.6em 0.6em;
 239      BORDER-STYLE: solid
 240  }
 241  
 242  DIV.searchposts DIV.icon {MARGIN-LEFT: 0}
 243  
 244  /* 10.2 La class .tclcon est une division à l'intérieur de la première colonne des tableaux qui ont des indicateurs de statuts de posts. 

 245  La marge crée l'espace pour les indicateurs de statuts de posts */
 246  
 247  TD DIV.tclcon {MARGIN-LEFT: 2.3em}