css/1/pageMinichat.css

   1 #page.minichat {
   2         padding: 0px;
   3 }
   4
   5 #page.minichat img {
   6    line-height: normal;
   7         vertical-align: middle;
   8 }
   9
  10 /***** La boite de sélection des smiles *****/
  11 #smiles {
  12         text-align: center;
  13         border: 1px solid;
  14         border-color: #ffffff;
  15         background-color: #f6dfc2;
  16         margin-bottom: 10px;
  17         padding: 1px;
  18         width: 140px;
  19         position: absolute;
  20         display: none
  21 }
  22 #smiles img {
  23         margin: 1px;
  24         cursor: pointer;
  25         opacity: 0.5;
  26 }
  27
  28 /***** La boite permettant de slaper/kicker/bannir une personne *****/
  29 #outilsBan {
  30         border-width: 1px 1px 1px 1px;
  31         border-color: #ffffff;
  32         border-style: dotted;
  33         padding: 2px;
  34         position: absolute;
  35         display: none;
  36 }
  37 #outilsBan img,
  38 #outilsBan form {
  39         float: right;
  40         cursor: pointer
  41 }
  42 #outilsBan p {
  43         font-size: 2px;
  44 }
  45 #outilsBan input {
  46         font-size: 9px;
  47         margin-top: 1px;
  48         margin-left: 1px
  49 }
  50
  51 /***** Le troll courant affiché en haut de la page *****/
  52 #page.minichat #trollCourant {
  53         color: #FFFFFF;
  54         position: absolute;
  55         z-index: 20;
  56         left: 140px;
  57         top: 77px;
  58         line-height: 32px;
  59 }
  60 #page.minichat #trollCourant .troll {
  61         cursor: pointer;
  62         font-style: italic
  63 }
  64
  65 /***** Le formulaire pour poster un message *****/
  66 #page.minichat form#posterMessage {
  67         background-color: #e19671;
  68         padding-left: 10px;
  69         padding-bottom: 10px;
  70 }
  71 #page.minichat form#posterMessage p {
  72    margin: 0px;
  73    padding: 0px;
  74 }
  75 #page.minichat form#posterMessage .pseudo {
  76    margin-right: 5px;
  77    width: 12%
  78 }
  79 #page.minichat form#posterMessage input.message {
  80    margin-right: 5px;
  81    width: 75%
  82 }
  83 #page.minichat form#posterMessage .return {
  84         height: 16px;
  85         width: 32px;
  86         background-image: url(../../img/css1/return.png);
  87         background-repeat: no-repeat;
  88         background-position: 5px 2px;
  89         vertical-align: top;
  90         margin-right: 5px;
  91 }
  92 #page.minichat form#posterMessage .smiles {
  93         height: 16px;
  94         width: 16px;
  95         background-image: url(../../img/css2/bouton_smiles.png);
  96         background-repeat: no-repeat;
  97         background-position: 2px 2px;
  98         vertical-align: top;
  99         margin-right: 5px;
 100 }
 101 #page.minichat form#posterMessage #repondA {
 102         background-color: #f0df95;
 103         border: #841919 1px solid;
 104    margin-right: 5px;
 105    padding-right: 2px;
 106    padding-left: 2px;
 107    cursor: pointer;
 108    display: none;
 109 }
 110 #page.minichat form#posterMessage #repondA .messages {
 111    position: absolute;
 112         border: #841919 1px solid;
 113    width: 50%;
 114    display:none;
 115 }
 116 #page.minichat form#posterMessage #repondA .messages div.message:hover .outilsMess {
 117    display: none
 118 }
 119
 120 /***** Les conversations *****/
 121 /* voir pour l'astuce css "float left" des conversations : http://www.quirksmode.org/css/clearing.html */
 122 #page.minichat #conversations {
 123         overflow: hidden;
 124         width: 100%
 125 }
 126 #page.minichat #conversations .conversation {
 127         border-width: 0px;
 128         border-style: solid;
 129         border-color: white;
 130         float: left;
 131         width: 100%;
 132 }
 133 #page.minichat #conversations .titre {
 134    border-top: 1px dashed white
 135 }
 136 #page.minichat #conversations .titre .barre {
 137         text-align: center;
 138         padding-right: 8px;
 139         background-color: #e19671;
 140         color: #ffffff;
 141 }
 142
 143 #page.minichat #conversations .titre .extraire,
 144 #page.minichat #conversations .titre .extraireCompletement {
 145         display: none
 146 }
 147
 148 #page.minichat #conversations .titre .barre .reduire {
 149         margin-top: 1px;
 150         margin-left: 5px;
 151         float: right;
 152         width: 13px;
 153         height: 13px;
 154         background-image: url(../../img/css1/reduire_conv.png);
 155         cursor: pointer;
 156 }
 157 #page.minichat #conversations .titre .barre .reduire:hover {
 158         background-image: url(../../img/css1/reduire_conv_hover.png);
 159 }
 160
 161 #page.minichat #conversations .titre .barre .fermer {
 162         margin-top: 1px;
 163         margin-left: 5px;
 164         float: right;
 165         width: 13px;
 166         height: 13px;
 167         background-image: url(../../img/css1/fermer_conv.png);
 168         cursor: pointer;
 169 }
 170 #page.minichat #conversations .titre .barre .fermer:hover {
 171         background-image: url(../../img/css1/fermer_conv_hover.png);
 172 }
 173 #page.minichat #conversations .titre .barre .lien {
 174         margin-top: 1px;
 175         margin-left: 5px;
 176         float: right;
 177         width: 13px;
 178         height: 13px;
 179         background-image: url(../../img/css1/copier_conv.png);
 180         cursor: pointer;
 181 }
 182 #page.minichat #conversations .titre .barre .lien:hover {
 183         background-image: url(../../img/css1/copier_conv_hover.png);
 184 }
 185 #page.minichat #conversations .titre .barre .next,
 186 #page.minichat #conversations .titre .barre .prev {
 187         display: none;
 188 }
 189 #page.minichat #conversations .titre .barre .next,
 190 #page.minichat #conversations .titre .barre .prev,
 191 #page.minichat #conversations .titre .barre .numPage {
 192         background-color: #841919;
 193         cursor: pointer;
 194         padding-right: 5px;
 195         padding-left: 5px;
 196 }
 197 #page.minichat #conversations .titre .barre .next:hover,
 198 #page.minichat #conversations .titre .barre .prev:hover,
 199 #page.minichat #conversations .titre .barre .numPage:hover {
 200         background-color: #cb2626
 201 }
 202
 203 /***** Les messages *****/
 204 #page.minichat div.message {
 205         padding-right: 5px;
 206         cursor: pointer;
 207         min-height: 18px;
 208         line-height: 18px;
 209 }
 210 #page.minichat div.messageImpair {
 211    background-color: #fbeede;
 212 }
 213 #page.minichat div.messagePair {
 214    background-color: #f6dfc2;
 215 }
 216 #page.minichat div.cache {
 217         opacity: 0.3;
 218
 219         /* Hack IE 7 */
 220         filter: alpha(opacity = 30);
 221         zoom: 1
 222 }
 223 #page.minichat div.message.reponse .entete {
 224         background-color: #bf2911
 225 }
 226 #page.minichat div.message.reponse .delimitationEntete,
 227 #page.minichat div.message.reponse .repondA {
 228         background-image: url(../../img/css1/fleche_reponse.png);
 229 }
 230 #page.minichat div.message.repondu .entete {
 231         background-color: #84196c
 232 }
 233 #page.minichat div.message.repondu .delimitationEntete,
 234 #page.minichat div.message.repondu .repondA {
 235         background-image: url(../../img/css1/fleche_repondu.png);
 236 }
 237 #page.minichat div.message.proprietaire .entete {
 238         background-color: #31732f
 239 }
 240 #page.minichat div.message.proprietaire .delimitationEntete,
 241 #page.minichat div.message.proprietaire .repondA {
 242         background-image: url(../../img/css1/fleche_proprietaire.png);
 243 }
 244 #page.minichat div.message.repondEnEvidence {
 245         background-color: #fce476
 246 }
 247 #page.minichat div.message.systeme {
 248         background-color: #f0df95
 249 }
 250 #page.minichat div.message a {
 251         font-weight: bold;
 252 }
 253 #page.minichat div.message .lienConv {
 254         color: #c62929;
 255         font-weight: bold;
 256         cursor: pointer
 257 }
 258 #page.minichat div.message .lienConv:hover {
 259         color: #e84747
 260 }
 261 #page.minichat .entete {
 262         z-index: 20;
 263         background-color: #841919;
 264         color: #f6dfc2;
 265         display: block;
 266         float: left;
 267         height: 18px;
 268 }
 269 #page.minichat .delimitationEntete {
 270         z-index: 20;
 271         height: 18px;
 272         width: 7px;
 273         background-image: url(../../img/css1/fleche.png);
 274         display: block;
 275         float: left;
 276 }
 277 #page.minichat .date {
 278    margin-right: 3px;
 279    margin-left: 3px;
 280 }
 281 #page.minichat div.message .pseudo,
 282 /* FIXME : entre en conflit avec une règle précédente */
 283 #page.minichat form .pseudo {
 284    margin-left: 4px;
 285    margin-right: 2px;
 286    font-weight: bold;
 287 }
 288 #page.minichat div.message.ekMasterlight .pseudo {
 289         color: #f0df95
 290 }
 291 #page.minichat div.message.ekMasterheavy .pseudo {
 292    color: #fcd82f;
 293    padding-left: 14px;
 294    background: transparent url(../../img/css1/marque_ek.png) no-repeat scroll left center
 295 }
 296
 297 #page.minichat div.message .pseudo .login {
 298    margin-left: 2px;
 299    font-size: 8px;
 300 }
 301 #page.minichat .repondA {
 302         z-index: 5;
 303         height: 18px;
 304         margin-left: -7px;
 305         padding-left: 9px;
 306         float: left;
 307         background-color: #cb2626;
 308         color: #ffffff;
 309         display: block;
 310         background-image: url(../../img/css1/fleche.png);
 311         background-repeat: no-repeat;
 312 }
 313 #page.minichat .delimitationRepondA {
 314         z-index: 20;
 315         height: 18px;
 316         width: 7px;
 317         background-image: url(../../img/css1/fleche_reponda.png);
 318         display: block;
 319         float: left;
 320 }
 321 #page.minichat .contenu {
 322         margin-left: 5px;
 323 }
 324 #page.minichat .outilsMess {
 325         float: right;
 326         display: none;
 327 }
 328 #page.minichat div.message:hover .outilsMess {
 329         display: block
 330 }
 331 #page.minichat .extraire {
 332         float: right;
 333         width: 13px;
 334         height: 13px;
 335         background-image: url(../../img/css1/extraction.png);
 336         margin-top: 2px;
 337 }
 338 #page.minichat .extraire:hover {
 339         background-image: url(../../img/css1/extraction_hover.png);
 340 }
 341 #page.minichat .extraireCompletement {
 342         float: right;
 343         width: 13px;
 344         height: 13px;
 345         background-image: url(../../img/css1/extraction_complete.png);
 346         margin-top: 2px;
 347    margin-right: 2px;
 348 }
 349 #page.minichat .extraireCompletement:hover {
 350         background-image: url(../../img/css1/extraction_complete_hover.png);
 351 }