[Sommaire] [Imprimer]

   1  /* ***** BEGIN LICENSE BLOCK *****
   2   * This file is part of DotClear.
   3   * Copyright (c) 2004 Maurice Svay and contributors. All rights
   4   * reserved.
   5   *
   6   * DotClear is free software; you can redistribute it and/or modify
   7   * it under the terms of the GNU General Public License as published by
   8   * the Free Software Foundation; either version 2 of the License, or
   9   * (at your option) any later version.
  10   * 
  11   * DotClear is distributed in the hope that it will be useful,
  12   * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13   * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  14   * GNU General Public License for more details.
  15   * 
  16   * You should have received a copy of the GNU General Public License
  17   * along with DotClear; if not, write to the Free Software
  18   * Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA  02111-1307  USA
  19   *
  20   * ***** END LICENSE BLOCK *****
  21   *
  22   * Contributor(s):
  23   *  Maurice Svay
  24   */
  25  
  26  /* Ce fichier définit le style visuel pour les différents éléments du blog.
  27   * Dans l'ordre, vous trouverez les règles qui définissent l'apparence pour:
  28   * - les éléments HTML en général
  29   * - la page
  30   * - l'entête
  31   * - le prélude
  32   * - le contenu
  33   * - la barre de navigation
  34   * - le pied de page
  35   *
  36   * L'agengement des blocs est défini dans le fichier layout.css
  37   * Pour mettre la barre de navigation à gauche, décommentez l'appel à 
  38   * layout-gauche.css
  39   */
  40  
  41  @import "layout.css";
  42  /* @import "layout-gauche.css"; */
  43   
  44  /* Les éléments HTML en général
  45  -------------------------------------------------------- */
  46  body{
  47      background: #EEE;
  48      color: #000;
  49      font-size: 80%;
  50      line-height: 1.6em;
  51      font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  52      border-top: 10px solid #DDD;
  53  }
  54  
  55  h1, h2, h3, h4, h5, h6{
  56      font-family: "Trebuchet MS", sans-serif;
  57  }
  58  
  59  h1{font-size: 1.5em;}
  60  h2{font-size: 1.4em;}
  61  h3{font-size: 1.3em;}
  62  h4{font-size: 1.2em;}
  63  h5{font-size: 1.1em;}
  64  h6{font-size: 1em;}
  65  
  66  pre, code{
  67      font-size: 1.2em;
  68  }
  69  
  70  pre{
  71      width: 100%;
  72      overflow: auto;
  73      border: 1px solid #CCC;
  74  }
  75  
  76  fieldset{
  77      border: none;
  78  }
  79  
  80  label{
  81      cursor: pointer;
  82      cursor: hand;
  83  }
  84  
  85  .field label{
  86      display: block;
  87  }
  88  
  89  input,textarea{
  90      border: 1px solid #999;
  91  }
  92  
  93  textarea{
  94      width: 100%;
  95      font-size: 1em;
  96      font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  97  }
  98  
  99  a{
 100      color: #000;
 101  }
 102  
 103  a:visited{
 104      color: #663;
 105  }
 106  
 107  a:hover{
 108      color: #636;
 109  }
 110  
 111  .left{
 112      float: left;
 113      margin-right: 1em;
 114  }
 115  
 116  .right{
 117      float: right;
 118      margin-left: 1em;
 119  }
 120  
 121  /* La page
 122  -------------------------------------------------------- */
 123  #page{
 124      background: #fff url(img/page.png) repeat-y center top;
 125      color: inherit;
 126  }
 127   
 128  /* L'entête
 129  -------------------------------------------------------- */
 130  #top{
 131      height: 120px;
 132      /*padding-top: 20px;*/
 133      background: #FFF url(img/top.png) no-repeat left top;
 134  }
 135  
 136  #top h1{
 137      height: 80px;
 138      line-height: 80px;
 139      margin: 0 0 0 40px;
 140      padding-top: 20px;
 141      color: #FFFFFF;
 142  }
 143  
 144  #top h1 a{
 145      text-decoration: none;
 146      color: #FFFFFF;
 147  }
 148  
 149  /* Le prélude
 150  -------------------------------------------------------- */ 
 151  #prelude{
 152      background: transparent;
 153      color: #DFDFDF;
 154      text-align: center;
 155  }
 156  
 157  #prelude a{
 158      color: #DFDFDF;
 159      background: transparent;
 160  }
 161  
 162  #prelude a:hover{
 163      color: #666;
 164      background: transparent;
 165  }
 166  
 167  /* Le contenu
 168  -------------------------------------------------------- */
 169  .day-date{
 170      padding-left: 20px;
 171      margin-left: -25px;
 172      color: #888;
 173      background: transparent url(img/day-date.png) no-repeat left center;
 174      font-style: italic;
 175  }
 176  
 177  .post-title{
 178      color: #F90;
 179      background: transparent;
 180      margin-bottom: 0;
 181  }
 182  
 183  .post-title a{
 184      color: #F90;
 185      background: transparent;
 186      text-decoration: none;
 187  }
 188  
 189  .post-info{
 190      margin-top: 0;
 191      color: #FA0;
 192      background: transparent;
 193      padding-bottom: 1ex;
 194      /*border-bottom: 1px solid #FC0;*/
 195  }
 196  
 197  .post-info a{
 198      color: #FA0;
 199      background: transparent;
 200      text-decoration: none;
 201  }
 202  
 203  .post-content{
 204      text-align: justify;
 205  }
 206  
 207  .post-content blockquote{
 208      font-family: Georgia, serif;
 209      font-style: italic;
 210  }
 211  
 212  .post-info-co{
 213      text-align: right;
 214  }
 215  
 216  #trackbacks blockquote, #comments blockquote{
 217      border: 1px solid #EEE;
 218      margin: 1em 0;
 219      padding: 1ex 1em;
 220  }
 221  
 222  /* La barre de navigation
 223  -------------------------------------------------------- */
 224  #sidebar div{
 225      border-bottom: 1px solid #F0F0F0;
 226      color: inherit;
 227  }
 228  
 229  #sidebar div ul{
 230      margin: 0;
 231      padding: 0;
 232      list-style: none;
 233  }
 234  
 235  #sidebar h2, #sidebar h3{
 236      color: #9ED200;
 237      margin: 0 0 1ex 0;
 238  }
 239  
 240  #sidebar h3{
 241      font-size: 1em;
 242      margin: 0;
 243  }
 244  
 245  #sidebar div#search{
 246      background: transparent;
 247      color: inherit;
 248      line-height: 2.3em;
 249  }
 250  
 251  #search fieldset, #search p{
 252      margin: 0;
 253      padding: 0;
 254  }
 255  
 256  #q{
 257      padding-left: 18px;
 258      background: #fff url(img/q.png) no-repeat 4px center;
 259  }
 260  
 261  #sidebar div#calendar{
 262      /*border-top: 1px solid #F0F0F0;*/
 263  }
 264  
 265  #sidebar div#calendar table{
 266      font-size: 0.8em;
 267      text-align: center;
 268      margin: 0 auto;
 269      border-collapse: collapse;
 270  }
 271  
 272  #sidebar div#calendar table caption{
 273      margin: 0 auto;
 274  }
 275  
 276  #sidebar div#calendar table th{
 277      color: #493;
 278      background: transparent;
 279  }
 280  
 281  #sidebar div#calendar table td{
 282      width: 14%;
 283      line-height: 2em;
 284      border: 1px solid #EEE;
 285  }
 286  
 287  #sidebar div#calendar table td a{
 288      display: block;
 289      background: #EFA;
 290      color: #493;
 291      font-weight: bold;
 292      text-decoration: none;
 293  }
 294  
 295  #sidebar div#calendar table td a:hover{
 296      background: #DBB8DC;
 297      color: #636;
 298  }
 299  
 300  /* Le pied de page
 301  -------------------------------------------------------- */
 302  #footer{
 303      margin: 0;
 304      padding: 1em;
 305      border-top: 1px solid #CCC;
 306      background: #EEE;
 307      color: #666;
 308  }
 309  
 310  #footer a{
 311      color: #999;
 312  }