Merge branch 'tab_layout' into development
[KiwiIRC.git] / client / assets / css / style.css
1 html, body { height:100%; }
2 * { margin:0; padding:0; }
3
4
5
6 /* Few resets for within the kiwi container */
7 #kiwi {
8 overflow:hidden; position:relative;
9 height:100%;
10 }
11 #kiwi * { margin:0px; padding:0px; }
12 #kiwi p { margin:0.5em 0; }
13 #kiwi a { color:#36C; text-decoration:none; cursor:pointer; }
14 #kiwi a img { border:none; }
15
16
17 /**
18 * Main layout blocks
19 */
20 #kiwi #toolbar { position:absolute; top:0px; width:100%; display:none; }
21 #kiwi #panels { position:absolute; left:0px; right:200px; bottom:100px; top:100px; }
22 #kiwi #memberlists { position:absolute; right:0px; width:200px; bottom:100px; top:100px; overflow-y:auto; }
23 #kiwi #controlbox { position: absolute; bottom:0px; width:100%; display:none; }
24 #kiwi #memberlists_resize_handle {
25 position: absolute; width:10px; z-index:1; cursor:w-resize;
26 }
27
28
29 #kiwi #toolbar #tabs { margin-right: 200px; }
30 #kiwi #toolbar .panellist {
31 overflow: hidden;
32 white-space: nowrap;
33 display:block;
34 }
35 #kiwi #toolbar .panellist li {
36 float: left; list-style: inline;
37 display:inline; position:relative;
38 padding:5px; margin:3px;
39 cursor: pointer;
40 }
41
42 #kiwi #toolbar .panellist .active { padding-right:23px; }
43 #kiwi #toolbar .panellist .alert_highlight { font-weight: bold; }
44 #kiwi #toolbar .panellist .alert_activity { font-weight: bold; }
45 #kiwi #toolbar .panellist .alert_action { font-weight: bold; }
46
47 #kiwi #toolbar .panellist li .part { position: absolute; top: 8px; right: 5px; }
48 #kiwi #toolbar .panellist li .part:after { content:"[x]"; }
49 #kiwi #toolbar .panellist li img.icon { left:5px; top:2px; height:auto; width:auto; }
50
51 #kiwi #status_message {
52 background: #FFF;
53 border-bottom: 1px solid;
54 text-align: center;
55 }
56
57
58 #kiwi .panel_container { overflow-y:auto; height:100%; }
59
60
61
62 #kiwi .messages {
63 overflow-x:wrap;
64 border:none; display: none;
65 }
66 #kiwi .messages a {}
67 #kiwi .messages.active { display:block; }
68
69 #kiwi .messages .msg {}
70 #kiwi .messages .msg .time { display:inline; }
71 #kiwi .messages .msg .nick { display:inline; }
72 #kiwi .messages .msg .text { display:inline; }
73
74 #kiwi .messages .msg.action .nick { display:none; }
75 #kiwi .messages .msg.action .text { }
76 #kiwi .messages .msg.action.join { }
77 #kiwi .messages .msg.action.part .text { }
78 #kiwi .messages .msg.action.quit .text { }
79 #kiwi .messages .msg.action.kick .text { }
80 #kiwi .messages .msg.status .nick { display:none; }
81 #kiwi .messages .msg.status .text { }
82 #kiwi .messages .msg.topic .nick { display:none; }
83 #kiwi .messages .msg.topic .text { }
84 #kiwi .messages .msg.motd { }
85 #kiwi .messages .msg.motd .nick { }
86 #kiwi .messages .msg.motd .text { }
87 #kiwi .messages .msg.whois .nick { }
88 #kiwi .messages .msg.whois .text { }
89 #kiwi .messages .msg.error .text { }
90
91 #kiwi .messages .msg.global_nick_highlight { }
92 #kiwi .messages .msg.highlight { }
93
94
95
96 /* A member/nick list per channel */
97 #kiwi #memberlists { border-left: 1px solid #8A8A8A; }
98 #kiwi #memberlists.disabled { display:none; }
99 #kiwi #memberlists ul { display:none; }
100
101 /* The active channels nicklist */
102 #kiwi #memberlists ul.active { display:block; }
103 #kiwi #memberlists ul li { overflow-y:auto; overflow-x:hidden; cursor:pointer; }
104 #kiwi #memberlists ul li a.nick { }
105
106 /* The userbox shown when clicking a nick */
107 #kiwi #memberlists ul li .userbox { position:relative; }
108 #kiwi #memberlists ul li .userbox a { }
109 #kiwi #memberlists ul li .userbox a i { }
110
111
112
113 /**
114 * Control box
115 */
116 #kiwi #controlbox .input {
117 height:1.7em;
118 }
119
120 /* The nick label */
121 #kiwi #controlbox .input .nick { cursor: pointer; }
122 #kiwi #controlbox .input .nick a { }
123
124 /* Wrapper div around the text area input */
125 #kiwi #controlbox .input .input_wrap { display:inline; }
126
127 /* The textarea input */
128 #kiwi #controlbox .input .inp { white-space: nowrap; }
129
130
131 /* Nick change dialog showed when clicking the nick label */
132 #kiwi #controlbox .nickchange {
133 position: absolute;
134 background: #FFF;
135 }
136 #kiwi #controlbox .nickchange input { }
137 #kiwi #controlbox .nickchange button { }
138
139
140
141 /**
142 * Topic bar
143 */
144 #kiwi #topic { position:relative; height:2em; }
145 #kiwi #topic div {
146 position:absolute;
147 top:0; bottom:0; left:0; right:0;
148 overflow: hidden;
149 }
150
151
152
153
154
155 /**
156 * Server selection dialog
157 */
158 #kiwi .server_select { width:800px; margin:0 auto; overflow:hidden; }
159 #kiwi .server_select .more { display: none; }
160 #kiwi .server_select button { }
161 #kiwi .server_select input { }
162 #kiwi .server_select label { }
163 #kiwi .server_select br { clear:both; }
164 #kiwi .server_select .basic input { }
165 #kiwi .server_select .basic label { }
166 #kiwi .server_select .basic { border-bottom: 1px solid gray; margin-bottom:1em; }
167 #kiwi .server_select .basic .show_more { }
168 #kiwi .server_select .basic tr.pass { display:none; }
169 #kiwi .server_select.single_server .basic { border:none; }
170 #kiwi .server_select .status { }
171
172 /* When connected to an IRC server, .ok is set on the status div */
173 #kiwi .server_select .status.ok { }
174
175 /* IRC server connection error, .error is set on the status div */
176 #kiwi .server_select .status.error { }
177
178
179
180 /* Logo and title in the server selection dialog */
181 #kiwi .server_select .kiwi_logo { text-align: center; display:block; }
182 #kiwi .server_select .kiwi_logo h1 { }
183 #kiwi .server_select .kiwi_logo img { }
184
185
186
187 /* Icons in the top right corner */
188 #kiwi #toolbar .app_tools { float:right; }
189 #kiwi #toolbar .app_tools ul li {
190 display:inline; cursor:pointer;
191 }
192 #kiwi #toolbar .app_tools img { height:25px; width:25px; margin: 6px 0.7em 0 0; }
193
194
195
196 /* Settings applet */
197 #kiwi .settings {
198 width:900px;
199 margin:1em auto;
200 }
201 #kiwi .settings table td {
202 padding:0.5em 1em;
203 }
204
205
206
207
208 /**
209 * Reusable componants
210 */
211
212 #kiwi .divider-verticle {
213 border-left: 1px solid #CFCFCF;
214 border-right: 1px solid #FFFFFF;
215 position: absolute;
216 top:25px; bottom:25px;
217 right:0;
218 width:0;
219 }
220
221 #kiwi .divider-horizontal {
222 border-top: 1px solid #CFCFCF;
223 border-bottom: 1px solid #FFFFFF;
224 position: absolute;
225 left:25px; right:25px;
226 bottom:0;
227 height:0;
228 }
229
230
231
232
233
234 /**
235 * Themes
236 */
237
238
239 /* Relaxed theme */
240 #kiwi.theme_relaxed {
241 background: url(../img/background-light.png) left top repeat-x #E3E3E3;
242 color: #555555;
243 }
244 #kiwi.theme_relaxed,
245 #kiwi.theme_relaxed input,
246 #kiwi.theme_relaxed button,
247 #kiwi.theme_relaxed textarea {
248 font-family:Arial, Helvetica, sans-serif;
249 font-size:14px; line-height:1.4em;
250 }
251 #kiwi.theme_relaxed input, textarea {
252 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5),0 1px 0px rgba(255, 255, 255, 0.3);
253 border: none;
254 border-radius: 3px;
255 }
256 #kiwi.theme_relaxed #toolbar {
257 background-color:#1B1B1B; font-size:0.9em;
258 }
259 #kiwi.theme_relaxed #controlbox { background-color:#1B1B1B; }
260 #kiwi.theme_relaxed #memberlists_resize_handle {
261 /*background:url('../img/resize_handle.png') no-repeat; background-position:center;*/
262 }
263 #kiwi.theme_relaxed #toolbar .panellist li {
264 line-height: 1.4em;
265 vertical-align: middle;
266
267 border-radius:5px;
268 -moz-border-radius:5px;
269 -webkit-border-radius:5px;
270 -khtml-border-radius:5px;
271 behavior: url(border-radius.htc);
272
273 background-image: -webkit-gradient(
274 linear,
275 left top,
276 left bottom,
277 color-stop(0.38, rgb(238,238,238)),
278 color-stop(0.68, rgb(209,209,209))
279 );
280 background-image: -moz-linear-gradient(
281 center top,
282 rgb(238,238,238) 38%,
283 rgb(209,209,209) 68%
284 );
285
286 border: 1px solid #333;
287 background-color: #eee;
288 }
289
290 #kiwi.theme_relaxed #toolbar .panellist .alert_highlight { /*background: #990000;*/ }
291 #kiwi.theme_relaxed #toolbar .panellist .alert_activity { font-weight:normal; }
292 #kiwi.theme_relaxed #toolbar .panellist .alert_action { font-weight:normal; }
293
294 #kiwi.theme_relaxed #toolbar .panellist .active { padding-right:23px; }
295 #kiwi.theme_relaxed #toolbar .panellist li .part {
296 background:url('../img/redcross.png'); width:14px; height:14px;
297 }
298 #kiwi.theme_relaxed #toolbar .panellist li .part:after { content:""; }
299
300 #kiwi.theme_relaxed #toolbar .panellist li.server span { background:url(../img/server_tab.png) no-repeat; padding-left:23px; }
301
302 /* Tab texts are within a span */
303 #kiwi.theme_relaxed #toolbar .panellist li span { line-height:20px; vertical-align:middle; display:inline-block; }
304
305 #kiwi.theme_relaxed #toolbar .panellist li.active .activity { display:none; }
306 #kiwi.theme_relaxed #toolbar .panellist li .activity.zero { visibility:hidden; }
307 #kiwi.theme_relaxed #toolbar .panellist li .activity {
308 padding: 1px 3px; margin-left:1em;
309 border-radius: 4px;
310 background: #3F9532; color:#000; /*color: #ff5300;*/
311 text-align: center; font-size: 10px;
312 display:inline-block;
313 width:2em;
314 }
315 #kiwi.theme_relaxed #toolbar .panellist li.alert_highlight .activity {
316 color: #fff; background: #a60400;
317 }
318
319 #kiwi.theme_relaxed #status_message {
320 background: #FEEFB3; color: #9F6000;
321 border-bottom: 1px solid;
322 padding: 0.9em;
323 text-align: center; font-size:1.1em;
324 }
325 #kiwi.theme_relaxed #status_message.err { color:#D8000C; background:#FFBABA; }
326
327 #kiwi.theme_relaxed .messages { color: #333333; }
328 #kiwi.theme_relaxed .messages.active { }
329 #kiwi.theme_relaxed .messages a { text-decoration:none; }
330
331 #kiwi.theme_relaxed .messages .msg { border-bottom: 1px solid #DEDEDE; padding: 1px; font-family:arial; font-size:0.9em; }
332 #kiwi.theme_relaxed .messages .msg .time { width:6em; float:left; color:#777; display:none; }
333 #kiwi.theme_relaxed .messages .msg .nick { width:11em; float:left; font-size:12px; font-family:Arial; text-align:right; padding: 5px; overflow:hidden; }
334 #kiwi.theme_relaxed .messages .msg .text { display:block; margin-left:12em; border-left: 1px solid #DEDEDE; white-space:pre-wrap; word-wrap:break-word; font-family:arial; padding:5px; }
335
336 #kiwi.theme_relaxed.narrow .messages .msg .nick { width: auto; }
337 #kiwi.theme_relaxed.narrow .messages .msg .text { margin-left: 1em; border:none; }
338
339 #kiwi.theme_relaxed .messages .msg.action .nick { }
340 #kiwi.theme_relaxed .messages .msg.action .text { color:#009900; border-left:none; font-style:italic; }
341 #kiwi.theme_relaxed .messages .msg.action.join { color:#009900; }
342 #kiwi.theme_relaxed .messages .msg.action.part .text { color:#900; }
343 #kiwi.theme_relaxed .messages .msg.action.quit .text { color:#900; }
344 #kiwi.theme_relaxed .messages .msg.action.kick .text { color:#900; }
345 #kiwi.theme_relaxed .messages .msg.status .nick { }
346 #kiwi.theme_relaxed .messages .msg.status .text { color:#990000; margin-left:9em; border-left:none; font-weight:bold; }
347 #kiwi.theme_relaxed .messages .msg.topic .nick { display:none; }
348 #kiwi.theme_relaxed .messages .msg.topic .text { color:#009900; margin-left:9em; font-style: italic; border-left:none; }
349 #kiwi.theme_relaxed .messages .msg.motd { border:none; }
350 /*#kiwi.theme_relaxed .messages .msg.motd .nick { display:none; }*/
351 #kiwi.theme_relaxed .messages .msg.motd .text { color:#666; font-family:monospace; }
352 #kiwi.theme_relaxed .messages .msg.whois .nick { font-weight:normal; }
353 #kiwi.theme_relaxed .messages .msg.whois .text { margin-left:18em; padding-left:1em; border-left:1px dashed #999; }
354 #kiwi.theme_relaxed .messages .msg.error .text {
355 border:1px solid #A33F3F; background-color:#D28A8A;
356 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
357 }
358
359 #kiwi.theme_relaxed .messages .msg.global_nick_highlight,
360 #kiwi.theme_relaxed .messages .msg.highlight { background:#D9D9D9; }
361
362 /* Narrow styling (window width < 400px) */
363 #kiwi.theme_relaxed.narrow .messages .msg .nick { width: auto; }
364 #kiwi.theme_relaxed.narrow .messages .msg .text { margin-left: 1em; border:none; }
365 #kiwi.theme_relaxed.narrow .messages .msg.action .text { margin-left: 1em; }
366
367
368 #kiwi.theme_relaxed .messages .msg .media { margin-left:0.5em; }
369 #kiwi.theme_relaxed .messages .msg .media .media_close { font-size:0.9em; }
370 #kiwi.theme_relaxed .messages .msg .media .media_content { margin:10px 0 0 10px; overflow:hidden; }
371 #kiwi.theme_relaxed .messages .msg .media .media_content img { padding:3px; border:1px solid gray; }
372 #kiwi.theme_relaxed .messages .msg .media .media_content > .content {
373 background: white;
374 overflow: hidden;
375 padding: 10px;
376 border: #DDD 1px solid;
377 border-top-color: #EEE;
378 border-bottom-color: #BBB;
379 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
380 -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.15);
381 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
382 border-radius: 5px;
383 float: left;
384 }
385
386 #kiwi.theme_relaxed .messages .msg .media.twitter .media_content > .content {
387 background: transparent;
388 border:none;
389 overflow: hidden;
390 box-shadow: none;
391 padding: 0;
392 }
393 #kiwi.theme_relaxed .messages .msg .media.reddit .thumbnail_nsfw {
394 display: inline-block;
395 float: left;
396 }
397 #kiwi.theme_relaxed .messages .msg .media.reddit .thumbnail { float:left; margin-right: 0.5em; }
398
399
400 #kiwi.theme_relaxed #memberlists {
401 background-color: #DADADA;
402 border-left: 1px solid #8A8A8A;
403 }
404 #kiwi.theme_relaxed.narrow #memberlists { display:none; }
405 #kiwi.theme_relaxed #memberlists ul { list-style: none; }
406 #kiwi.theme_relaxed #memberlists ul.active { }
407 #kiwi.theme_relaxed #memberlists ul li { padding: 0.2em 1em; }
408 #kiwi.theme_relaxed #memberlists ul li:hover {
409 border-left: 5px solid #88C56A;
410 -webkit-transition: 0.2s ease;
411 -moz-transition: 0.2s ease;
412 -ms-transition: 0.2s ease;
413 -o-transition: 0.2s ease;
414 transition: 0.2s ease;
415 }
416 #kiwi.theme_relaxed #memberlists ul li a.nick { display:block; color:black; }
417
418 #kiwi.theme_relaxed #memberlists ul li .userbox { margin:4px 1em 5px 1em; padding-bottom:0.7em; font-size:.9em; }
419 #kiwi.theme_relaxed #memberlists ul li .userbox a { display:block; text-decoration:none; margin-bottom:2px; }
420 #kiwi.theme_relaxed #memberlists ul li .userbox a i { font-size:1.1em; margin-right:5px; }
421
422 /* User mode styles */
423 #kiwi.theme_relaxed #memberlists ul li .prefix {
424 display:none;
425 width:20px; height:20px;
426 border-radius: 5px;
427 margin: 0 7px 0 0;
428 font-size:12px; text-align: center;
429 color: #E3E3E3;
430 /* text-indent: -1000px; */
431 }
432 /* Most important modes towards the bottom - they override the top ones! */
433 #kiwi.theme_relaxed #memberlists ul li.mode.v .prefix { display:inline-block; background:#b3b3b3; }
434 #kiwi.theme_relaxed #memberlists ul li.mode.h .prefix { display:inline-block; background:#b5b447; }
435 #kiwi.theme_relaxed #memberlists ul li.mode.o .prefix { display:inline-block; background:#47b547; }
436 #kiwi.theme_relaxed #memberlists ul li.mode.a .prefix { display:inline-block; background:#b54747; }
437 #kiwi.theme_relaxed #memberlists ul li.mode.q .prefix { display:inline-block; background:#8547b5; }
438
439 #kiwi.theme_relaxed #controlbox .input {
440 background:#fff; margin:3px;
441 height:1.7em;
442 border-radius:5px;
443 -moz-border-radius:5px;
444 -webkit-border-radius:5px;
445 -khtml-border-radius:5px;
446 }
447 #kiwi.theme_relaxed #controlbox .input .nick { text-align: right; width:11em; left:0px; position:absolute; padding:2px; overflow:hidden; }
448 #kiwi.theme_relaxed #controlbox .input .nick a { text-decoration:none; color:black; }
449
450 #kiwi.theme_relaxed.narrow #controlbox .input .nick { display:none; }
451 #kiwi.theme_relaxed.narrow #controlbox .input .input_wrap { left:7px; }
452
453 #kiwi.theme_relaxed #controlbox .input .input_wrap {
454 position:absolute;
455 right:7px; left: 12.2em;
456 height:1.7em;
457 }
458 #kiwi.theme_relaxed #controlbox .input .inp {
459 line-height:1.7em;
460 border: medium none;
461 box-shadow: none;
462 border-radius: 0;
463 outline:none; resize:none;
464 overflow:hidden;
465 position:relative;
466 height:100%; width:100%;
467 display: block;
468 }
469
470
471 #kiwi.theme_relaxed #controlbox .nickchange {
472 padding:10px; left: 0px;
473 background: #1B1B1B; color:#eeeeee;
474 }
475 #kiwi.theme_relaxed #controlbox .nickchange input { padding:0.3em 0.5em; }
476 #kiwi.theme_relaxed #controlbox .nickchange button { padding:0.5em; }
477
478
479
480 #kiwi.theme_relaxed #topic { background-color:#1B1B1B; padding-bottom:2px; }
481 #kiwi.theme_relaxed #topic div {
482 padding: 0.2em 1em;
483 text-align: center;
484 box-shadow: none;
485 border-radius: 0;
486 background-color:#FFF;
487 height: 1.5em;
488 overflow: hidden;
489 outline: none;
490 white-space: nowrap;
491 }
492 #kiwi.theme_relaxed #topic:hover div {
493 min-height:1.5em;
494 white-space:pre-wrap; word-wrap:break-word;
495 overflow:visible;
496 background-color:#FFF;
497 z-index: 1;
498 height:auto; bottom:auto;
499 border-bottom: 2px solid #1B1B1B;
500 }
501
502
503 #kiwi.theme_relaxed #toolbar .app_tools { width:200px; padding-left:10px; color:#D4D4D4; }
504 #kiwi.theme_relaxed.narrow #toolbar #tabs { margin-right:0; }
505 #kiwi.theme_relaxed.narrow #toolbar .app_tools { width:auto; }
506 #kiwi.theme_relaxed #toolbar .app_tools ul li {
507 font-size:26px;
508 -webkit-transition: all .3s ease;
509 -moz-transition: all .3s ease;
510 transition: all .3s ease;
511 margin-left:10px;
512 }
513 #kiwi.theme_relaxed #toolbar .app_tools ul li:hover { color:#88C56A; }
514 #kiwi.theme_relaxed #toolbar .app_tools img { }
515
516
517 /* The server select dialog */
518 #kiwi.theme_relaxed .server_select { width:730px; padding:3em 0 2em 0; margin: 0 auto; }
519 #kiwi.theme_relaxed .server_select .more { display: none; width:270px; margin:0 auto; }
520 #kiwi.theme_relaxed .server_select table tr td { padding:5px; }
521 #kiwi.theme_relaxed .server_select button { float:right; padding:3px 7px; }
522 #kiwi.theme_relaxed .server_select input { padding:3px 7px; width:150px; }
523 #kiwi.theme_relaxed .server_select label { }
524 #kiwi.theme_relaxed .server_select br { clear:both; }
525 #kiwi.theme_relaxed .server_select .basic input, .server_select .basic button { font-size:1em; padding:0.5em 1em; }
526 #kiwi.theme_relaxed .server_select .basic input { width:170px; }
527 #kiwi.theme_relaxed .server_select .basic label { font-size:1.3em; margin-top:4px; }
528 #kiwi.theme_relaxed .server_select .basic tr.have_pass { font-size:0.8em; }
529 #kiwi.theme_relaxed .server_select .basic tr.channel td { padding-top:1em; }
530 #kiwi.theme_relaxed .server_select .basic { border-bottom: 1px dashed gray; margin-bottom:1em; }
531 #kiwi.theme_relaxed .server_select .basic .show_more { display: block; width:110px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
532 #kiwi.theme_relaxed .server_select.single_server .basic { border:none; }
533 #kiwi.theme_relaxed .server_select .status { text-align: center; font-weight: bold; padding:1em; }
534 #kiwi.theme_relaxed .server_select .status.ok { }
535 #kiwi.theme_relaxed .server_select .status.error {
536 border:1px solid #A33F3F; background-color:#D28A8A;
537 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
538 }
539
540
541 #kiwi.theme_relaxed .server_select .kiwi_logo { text-align: center; display:block; }
542 #kiwi.theme_relaxed .server_select .kiwi_logo h1 {
543 font-size:20px;
544 line-height:48px; vertical-align: middle;
545 color: #555555;
546 }
547 #kiwi.theme_relaxed .server_select .kiwi_logo img { }
548
549
550 #kiwi.theme_relaxed.chanlist_treeview #panels { left:200px; }
551 #kiwi.theme_relaxed.chanlist_treeview #toolbar { position:static; }
552 #kiwi.theme_relaxed.chanlist_treeview #toolbar .app_tools { float:none; }
553 #kiwi.theme_relaxed.chanlist_treeview #toolbar > div { margin-left:200px; }
554 #kiwi.theme_relaxed.chanlist_treeview #toolbar #tabs { position:absolute; left:0px; bottom:0px; top:0px; margin:0; width:200px; background:#1B1B1B; overflow-y:auto; }
555 #kiwi.theme_relaxed.chanlist_treeview #tabs ul li { display:block; float:none; }
556 #kiwi.theme_relaxed.chanlist_treeview #tabs ul li .activity { float:right; }
557 #kiwi.theme_relaxed.chanlist_treeview #tabs ul li.active {
558 margin-right:0;
559 border-right-width:0;
560 border-bottom-right-radius:0;
561 border-top-right-radius:0;
562 }
563
564
565
566
567
568 /**
569 * Mini theme
570 */
571 #kiwi.theme_mini {
572 background: #FFF;
573 color: #555555;
574 }
575 #kiwi.theme_mini,
576 #kiwi.theme_mini input,
577 #kiwi.theme_mini button,
578 #kiwi.theme_mini textarea {
579 font-family:Arial, Helvetica, sans-serif;
580 font-size:14px; line-height:1.4em;
581 }
582 #kiwi.theme_mini input, textarea {
583 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5),0 1px 0px rgba(255, 255, 255, 0.3);
584 border: none;
585 border-radius: 3px;
586 }
587 #kiwi.theme_mini #toolbar {
588 background-color:#1B1B1B; font-size:0.9em;
589 }
590 #kiwi.theme_mini #controlbox { background-color:#1B1B1B; }
591 #kiwi.theme_mini #memberlists_resize_handle {
592 display:none; width:0;
593 }
594 #kiwi.theme_mini #toolbar .panellist li {
595 line-height: 1.4em;
596 vertical-align: middle;
597
598 border-radius:5px;
599 -moz-border-radius:5px;
600 -webkit-border-radius:5px;
601 -khtml-border-radius:5px;
602
603 border: 1px solid #333;
604 background-color: #eee;
605 }
606
607 #kiwi.theme_mini #toolbar #tabs { margin-right:0 !important; }
608 #kiwi.theme_mini #toolbar .panellist .alert_highlight { font-weight:bold; }
609 #kiwi.theme_mini #toolbar .panellist .alert_activity { font-weight:normal; }
610 #kiwi.theme_mini #toolbar .panellist .alert_action { font-weight:normal; }
611
612 #kiwi.theme_mini #toolbar .panellist .active { padding-right:23px; }
613 #kiwi.theme_mini #toolbar .panellist li .part {
614 background:url('../img/redcross.png'); width:14px; height:14px;
615 }
616 #kiwi.theme_mini #toolbar .panellist li .part:after { content:""; }
617
618 #kiwi.theme_mini #toolbar .panellist li.server span { background:url(../img/server_tab.png) no-repeat; padding-left:23px; }
619
620 /* Tab texts are within a span */
621 #kiwi.theme_mini #toolbar .panellist li span { line-height:20px; vertical-align:middle; display:inline-block; }
622
623 #kiwi.theme_mini #toolbar .panellist li .activity { display:inline; margin-left:0.5em; font-style:italic; font-size:0.8em; }
624 #kiwi.theme_mini #toolbar .panellist li .activity:before { content:"("; }
625 #kiwi.theme_mini #toolbar .panellist li .activity:after { content:")"; }
626
627 #kiwi.theme_mini #status_message {
628 background: #FEEFB3; color: #9F6000;
629 border-bottom: 1px solid;
630 padding: 0.9em;
631 text-align: center; font-size:1.1em;
632 }
633 #kiwi.theme_mini #status_message.err { color:#D8000C; background:#FFBABA; }
634
635 #kiwi.theme_mini .messages { color: #333333; }
636 #kiwi.theme_mini .messages.active { }
637 #kiwi.theme_mini .messages a { text-decoration:none; }
638
639 #kiwi.theme_mini .messages .msg { border-bottom: 1px solid #DEDEDE; padding: 5px; font-family:arial; font-size:0.9em; }
640 #kiwi.theme_mini .messages .msg .time { display:none; }
641 #kiwi.theme_mini .messages .msg .nick { display:block; font-family:Arial; text-transform:capitalize; }
642 #kiwi.theme_mini .messages .msg .text { display:block; white-space:pre-wrap; word-wrap:break-word; font-family:arial; }
643
644 #kiwi.theme_mini .messages .msg.action .nick { }
645 #kiwi.theme_mini .messages .msg.action .text { color:#009900; border-left:none; font-style:italic; }
646 #kiwi.theme_mini .messages .msg.action.join { color:#009900; }
647 #kiwi.theme_mini .messages .msg.action.part .text { color:#900; }
648 #kiwi.theme_mini .messages .msg.action.quit .text { color:#900; }
649 #kiwi.theme_mini .messages .msg.action.kick .text { color:#900; }
650 #kiwi.theme_mini .messages .msg.status .nick { }
651 #kiwi.theme_mini .messages .msg.status .text { color:#990000; border-left:none; font-weight:bold; }
652 #kiwi.theme_mini .messages .msg.topic .nick { display:none; }
653 #kiwi.theme_mini .messages .msg.topic .text { color:#009900; font-style: italic; border-left:none; }
654 #kiwi.theme_mini .messages .msg.motd { border:none; }
655 /*#kiwi.theme_mini .messages .msg.motd .nick { display:none; }*/
656 #kiwi.theme_mini .messages .msg.motd .text { color:#666; }
657 #kiwi.theme_mini .messages .msg.whois .nick { font-weight:normal; }
658 #kiwi.theme_mini .messages .msg.whois .text { padding-left:1em; border-left:1px dashed #999; }
659 #kiwi.theme_mini .messages .msg.error .text {
660 border:1px solid #A33F3F; background-color:#D28A8A;
661 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
662 }
663
664 #kiwi.theme_mini .messages .msg.global_nick_highlight,
665 #kiwi.theme_mini .messages .msg.highlight { background:#D9D9D9; }
666
667
668
669 #kiwi.theme_mini #memberlists {
670 background-color: #DADADA;
671 border-left: 1px solid #8A8A8A;
672 display:none;
673 width:0px;
674 }
675 #kiwi.theme_mini #memberlists ul { list-style: none; }
676 #kiwi.theme_mini #memberlists ul.active { }
677 #kiwi.theme_mini #memberlists ul li { padding: 0.2em 1em; }
678 #kiwi.theme_mini #memberlists ul li:hover {
679 border-left: 5px solid #88C56A;
680 -webkit-transition: 0.2s ease;
681 -moz-transition: 0.2s ease;
682 -ms-transition: 0.2s ease;
683 -o-transition: 0.2s ease;
684 transition: 0.2s ease;
685 }
686 #kiwi.theme_mini #memberlists ul li a.nick { display:block; color:black; }
687
688 #kiwi.theme_mini #memberlists ul li .userbox { margin:0 1em 5px 1em; padding-bottom:0.7em; font-size:.9em; }
689 #kiwi.theme_mini #memberlists ul li .userbox a { display:block; text-decoration:none; margin-bottom:2px; }
690 #kiwi.theme_mini #memberlists ul li .userbox a i { font-size:1.1em; margin-right:5px; }
691
692
693 #kiwi.theme_mini #controlbox .input {
694 background:#fff; margin:3px;
695 height:1.7em;
696 }
697 #kiwi.theme_mini #controlbox .input .nick { display:none; }
698 #kiwi.theme_mini #controlbox .input .nick a { text-decoration:none; color:black; }
699 #kiwi.theme_mini #controlbox .input .input_wrap {
700 position:absolute;
701 right:3px; left:3px;
702 height:1.7em;
703 }
704 #kiwi.theme_mini #controlbox .input .inp {
705 line-height:1.7em;
706 border: medium none;
707 box-shadow: none;
708 border-radius: 0;
709 resize:none;
710 overflow:hidden;
711 position:relative;
712 height:100%; width:100%;
713 display: block;
714 }
715
716
717 #kiwi.theme_mini #controlbox .nickchange {
718 padding:10px; left: 0px;
719 background: #1B1B1B; color:#eeeeee;
720 }
721 #kiwi.theme_mini #controlbox .nickchange input { padding:0.3em 0.5em; }
722 #kiwi.theme_mini #controlbox .nickchange button { padding:0.5em; }
723
724
725
726 #kiwi.theme_mini #topic { display:none; }
727 #kiwi.theme_mini #topic div {
728 top:2; bottom:2px; left:0; width:100%;
729 padding: 0.2em 1em;
730 text-align: center;
731 box-shadow: none;
732 border-radius: 0;
733 background-color:#FFF;
734 height: 1.5em;
735 overflow: hidden;
736 outline: none;
737 }
738
739
740 #kiwi.theme_mini #toolbar .app_tools { padding-left:10px; color:#D4D4D4; }
741 #kiwi.theme_mini #toolbar .app_tools ul li {
742 font-size:26px;
743 -webkit-transition: all .3s ease;
744 -moz-transition: all .3s ease;
745 transition: all .3s ease;
746 margin-left:10px;
747 }
748 #kiwi.theme_mini #toolbar .app_tools ul li:hover { color:#88C56A; }
749 #kiwi.theme_mini #toolbar .app_tools img { }
750
751
752 /* The server select dialog */
753 #kiwi.theme_mini .server_select { padding:3em 0 2em 0; margin: 0 auto; width:100%; }
754 #kiwi.theme_mini .server_select .more { display:none; }
755 #kiwi.theme_mini .server_select button { display:block; padding:3px 7px; margin:0 auto; }
756 #kiwi.theme_mini .server_select input.nick {
757 float:none; display:block; width:80%;
758 padding:0.5em 1em; margin:0 auto;
759 text-align: center;
760 }
761 #kiwi.theme_mini .server_select label { display:none; }
762 #kiwi.theme_mini .server_select br { clear:both; }
763 #kiwi.theme_mini .server_select .basic { border:none; }
764 #kiwi.theme_mini .server_select .basic table { width:100%; }
765 #kiwi.theme_mini .server_select .basic table tr.channel,
766 #kiwi.theme_mini .server_select .basic table tr.pass,
767 #kiwi.theme_mini .server_select .basic table tr.have_pass { display:none; }
768 #kiwi.theme_mini .server_select .basic .show_more { display:none !important; }
769 #kiwi.theme_mini .server_select.single_server .basic { border:none; }
770 #kiwi.theme_mini .server_select .status { text-align: center; font-weight: bold; padding:1em; }
771 #kiwi.theme_mini .server_select .status.ok { }
772 #kiwi.theme_mini .server_select .status.error {
773 border:1px solid #A33F3F; background-color:#D28A8A;
774 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
775 }
776
777 #kiwi.theme_mini .server_select .divider-verticle {
778 display:none;
779 }
780 #kiwi.theme_mini .server_select .server_details {
781 position: relative !important;
782 float: none !important;
783 width: auto !important;
784 padding: 0 !important;
785 margin: 2em 0 0 0 !important;
786 }
787 #kiwi.theme_mini .server_select .about_kiwi { display:none; }
788
789
790
791
792
793
794
795
796
797 /* CLI theme */
798 #kiwi.theme_cli { background:#222222; color:#6d6d6d; }
799 #kiwi.theme_cli,
800 #kiwi.theme_cli input,
801 #kiwi.theme_cli button,
802 #kiwi.theme_cli textarea {
803 font-family:Arial, Helvetica, sans-serif;
804 font-size:14px; line-height:1.4em;
805 }
806
807 #kiwi.theme_cli #controlbox { background:#111111; border-top:1px solid #444444; color:#909090; font-size:1.3em; line-height:2em; }
808 #kiwi.theme_cli #controlbox .input_wrap:before { content:"> " }
809 #kiwi.theme_cli #controlbox .input { background:none; border:none;}
810 #kiwi.theme_cli #controlbox .input .nick { line-height:1.7em; padding:0; text-align: right; width:11em; left:0px; position:absolute; overflow:hidden; }
811 #kiwi.theme_cli #controlbox .input .input_wrap {
812 position:absolute;
813 right:7px; left: 12.2em;
814 height:1.7em;
815 }
816 #kiwi.theme_cli #controlbox .input .inp {
817 line-height:1.4em;
818 font-size:1.3em;
819 background:transparent; color:#909090;
820 border: medium none;
821 box-shadow: none;
822 border-radius: 0;
823 outline:none; resize:none;
824 overflow:hidden;
825 position:absolute;
826 top: 0px;
827 height:99%; width:98%;
828 display: inline;
829 padding-left:0.5em;
830 }
831
832 #kiwi.theme_cli #topic { background:#111111; height:2em; border-bottom:1px solid #444444; border-top:1px solid #444444; }
833 #kiwi.theme_cli #topic div {
834 width:100%; height: 1.5em;
835 padding: 0.2em 1em;
836 text-align: center;
837 color:#6d6d6d;
838 border:none; outline:none;
839 overflow: hidden;
840 white-space: nowrap;
841 }
842 #kiwi.theme_cli #topic:hover div {
843 min-height:1.5em;
844 white-space:pre-wrap; word-wrap:break-word;
845 overflow:visible;
846 background-color:#111111;
847 z-index: 1;
848 height:auto; bottom:auto;
849 border-bottom: 1px solid #444444;
850 }
851
852 #kiwi.theme_cli #toolbar .app_tools { width:200px; padding-left:10px; color:#D4D4D4; }
853 #kiwi.theme_cli #toolbar .app_tools ul li {
854 font-size:26px;
855 -webkit-transition: all .3s ease;
856 -moz-transition: all .3s ease;
857 transition: all .3s ease;
858 margin-left:10px;
859 }
860 #kiwi.theme_cli #toolbar .app_tools ul li:hover { color:#88C56A; }
861 #kiwi.theme_cli #toolbar .app_tools img { }
862
863 #kiwi.theme_cli #toolbar .panellist li {
864 line-height: 1.4em;
865 vertical-align: middle;
866
867 border: 1px solid #333;
868 background-color: #111;
869 }
870
871 #kiwi.theme_cli #toolbar .panellist .alert_highlight { font-weight:bold; }
872 #kiwi.theme_cli #toolbar .panellist .alert_activity { font-weight:normal; }
873 #kiwi.theme_cli #toolbar .panellist .alert_action { font-weight:normal; }
874
875 #kiwi.theme_cli #toolbar .panellist .active { padding-right:23px; }
876 #kiwi.theme_cli #toolbar .panellist li .part {
877 background:url('../img/redcross.png'); width:14px; height:14px;
878 }
879 #kiwi.theme_cli #toolbar .panellist li .part:after { content:""; }
880
881 #kiwi.theme_cli #toolbar .panellist li.server span { background:url(../img/server_tab.png) no-repeat; padding-left:23px; }
882
883 /* Tab texts are within a span */
884 #kiwi.theme_cli #toolbar .panellist li span { line-height:20px; vertical-align:middle; display:inline-block; }
885
886 #kiwi.theme_cli #toolbar .panellist li .activity { display:inline; margin-left:0.5em; font-style:italic; font-size:0.8em; }
887 #kiwi.theme_cli #toolbar .panellist li .activity:before { content:"("; }
888 #kiwi.theme_cli #toolbar .panellist li .activity:after { content:")"; }
889
890
891 #kiwi.theme_cli #memberlists { background:#222222; }
892 #kiwi.theme_cli #memberlists ul li { padding: 0.2em 1em; }
893 #kiwi.theme_cli #memberlists ul li a.nick { color:#6d6d6d; }
894 #kiwi.theme_cli #memberlists ul li:hover {
895 border-left: 5px solid #88C56A;
896 -webkit-transition: 0.2s ease;
897 -moz-transition: 0.2s ease;
898 -ms-transition: 0.2s ease;
899 -o-transition: 0.2s ease;
900 transition: 0.2s ease;
901 }
902
903 #kiwi.theme_cli #memberlists ul li .userbox { margin:0 1em 0 1em; padding-bottom:0.4em; font-size:.9em; }
904 #kiwi.theme_cli #memberlists ul li .userbox a { display:block; text-decoration:none; margin-bottom:2px; }
905 #kiwi.theme_cli #memberlists ul li .userbox a i { font-size:1.1em; margin-right:5px; }
906 #kiwi.theme_cli #memberlists ul li .userbox .divider-horizontal { display:none; }
907
908
909 #kiwi.theme_cli .messages .msg > div { color:#6d6d6d; font-family: Inconsolata, Consolas, 'courier new', monospace; }
910 #kiwi.theme_cli .messages .msg { border: none; }
911 #kiwi.theme_cli .messages .msg .time { display:inline; margin-right:1em; color:#777; }
912 #kiwi.theme_cli .messages .msg .nick { display:inline; margin-right:1em; }
913 #kiwi.theme_cli .messages .msg .nick:before { content:"<"; }
914 #kiwi.theme_cli .messages .msg .nick:after { content:">"; }
915 #kiwi.theme_cli .messages .msg .text { white-space:pre-wrap; word-wrap:break-word; }
916
917 #kiwi.theme_cli .messages .msg.action .nick { display:none; }
918 #kiwi.theme_cli .messages .msg.action .text { color:#009900; border-left:none; font-style:italic; }
919 #kiwi.theme_cli .messages .msg.action.join { color:#009900; }
920 #kiwi.theme_cli .messages .msg.action.part .text { color:#900; }
921 #kiwi.theme_cli .messages .msg.action.quit .text { color:#900; }
922 #kiwi.theme_cli .messages .msg.action.kick .text { color:#900; }
923 #kiwi.theme_cli .messages .msg.status .nick { display:none; }
924 #kiwi.theme_cli .messages .msg.status .text { color:#990000; border-left:none; font-weight:bold; }
925 #kiwi.theme_cli .messages .msg.topic .nick { display:none; }
926 #kiwi.theme_cli .messages .msg.topic .text { color:#009900; font-style: italic; border-left:none; }
927 /*#kiwi.theme_cli .messages .msg.motd .nick { display:none; }*/
928 #kiwi.theme_cli .messages .msg.motd { border:none; }
929 #kiwi.theme_cli .messages .msg.motd .text { color:#666; }
930 #kiwi.theme_cli .messages .msg.whois .nick { font-weight:normal; }
931 #kiwi.theme_cli .messages .msg.whois .text { padding-left:1em; border-left:1px dashed #999; }
932 #kiwi.theme_cli .messages .msg.error .text {
933 border:1px solid #A33F3F; background-color:#D28A8A;
934 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
935 }
936
937 #kiwi.theme_cli .messages .msg.global_nick_highlight { background:#111111; }
938
939
940
941 #kiwi.theme_cli .messages .msg .media { margin-left:0.5em; }
942 #kiwi.theme_cli .messages .msg .media .media_close { font-size:0.9em; }
943 #kiwi.theme_cli .messages .msg .media .media_content { margin:10px 0 0 6em; overflow:hidden; }
944 #kiwi.theme_cli .messages .msg .media .media_content img { padding:3px; border:1px solid gray; }
945 #kiwi.theme_cli .messages .msg .media .media_content > .content {
946 background: white;
947 overflow: hidden;
948 padding: 10px;
949 border: #DDD 1px solid;
950 border-top-color: #EEE;
951 border-bottom-color: #BBB;
952 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
953 -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.15);
954 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
955 border-radius: 5px;
956 float: left;
957 }
958
959 #kiwi.theme_cli .messages .msg .media.twitter .media_content > .content {
960 background: transparent;
961 border:none;
962 overflow: hidden;
963 box-shadow: none;
964 padding: 0;
965 }
966 #kiwi.theme_cli .messages .msg .media.reddit .thumbnail_nsfw {
967 display: inline-block;
968 float: left;
969 }
970 #kiwi.theme_cli .messages .msg .media.reddit .thumbnail { float:left; margin-right: 0.5em; }
971
972
973
974 /* The server select dialog */
975 #kiwi.theme_cli .server_select { width:730px; padding:3em 0 2em 0; margin: 0 auto; }
976 #kiwi.theme_cli .server_select .more { display: none; width:270px; margin:0 auto; }
977 #kiwi.theme_cli .server_select table tr td { padding:5px; }
978 #kiwi.theme_cli .server_select button { float:right; padding:3px 7px; margin-top:10px; }
979 #kiwi.theme_cli .server_select input { padding:3px 7px; width:150px; }
980 #kiwi.theme_cli .server_select label { width:5em; padding-top:3px }
981 #kiwi.theme_cli .server_select br { clear:both; }
982 #kiwi.theme_cli .server_select .basic input, .server_select .basic button { font-size:1em; padding:0.5em 1em; }
983 #kiwi.theme_cli .server_select .basic input { width:170px; }
984 #kiwi.theme_cli .server_select .basic label { font-size:1.3em; margin-top:4px; }
985 #kiwi.theme_cli .server_select .basic tr.have_pass { font-size:0.8em; }
986 #kiwi.theme_cli .server_select .basic tr.channel td { padding-top:1em; }
987 #kiwi.theme_cli .server_select .basic { border-bottom: 1px dashed gray; margin-bottom:1em; }
988 #kiwi.theme_cli .server_select .basic .show_more { display: block; width:116px; margin:10px 0 0 0; font-size:0.8em; background: url(../img/more.png) no-repeat right 7px; }
989 #kiwi.theme_cli .server_select.single_server .basic { border:none; }
990 #kiwi.theme_cli .server_select .status { text-align: center; font-weight: bold; padding:1em; }
991 #kiwi.theme_cli .server_select .status.ok { }
992 #kiwi.theme_cli .server_select .status.error {
993 border:1px solid #A33F3F; background-color:#D28A8A;
994 padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
995 }
996
997
998 #kiwi.theme_cli .server_select .kiwi_logo { text-align: center; display:block; }
999 #kiwi.theme_cli .server_select .kiwi_logo h1 {
1000 font-size:20px;
1001 line-height:48px; vertical-align: middle;
1002 color: #555555;
1003 }
1004 #kiwi.theme_cli .server_select .kiwi_logo img { }
1005
1006
1007 #kiwi.theme_cli .divider-verticle {
1008 border-left: 1px solid #303030;
1009 border-right: 1px solid #1B1B1B;
1010 }
1011
1012 #kiwi.theme_cli .divider-horizontal {
1013 border-top: 1px solid #303030;
1014 border-bottom: 1px solid #1B1B1B;
1015 }
1016
1017
1018
1019 #kiwi.theme_cli.chanlist_treeview #panels { left:200px; }
1020 #kiwi.theme_cli.chanlist_treeview #toolbar { position:static; }
1021 #kiwi.theme_cli.chanlist_treeview #toolbar .app_tools { float:none; }
1022 #kiwi.theme_cli.chanlist_treeview #toolbar > div { margin-left:200px; }
1023 #kiwi.theme_cli.chanlist_treeview #toolbar #tabs { position:absolute; left:0px; bottom:0px; top:0px; margin:0; width:200px; background:#1B1B1B; overflow-y:auto; }
1024 #kiwi.theme_cli.chanlist_treeview #tabs ul li { display:block; float:none; }
1025 #kiwi.theme_cli.chanlist_treeview #tabs ul li .activity { float:right; }
1026 #kiwi.theme_cli.chanlist_treeview #tabs ul li.active { padding-left:1em; }