styles/1/pageMinichat.css

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