css/1/pageMinichat.css

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