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