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