3 Jappix - An open social platform
4 This is the page-engine CSS stylesheet for Jappix
6 -------------------------------------------------
10 Last revision: 31/08/11
15 background-color: #f4f4f4;
23 -moz-border-radius: 3px;
24 -webkit-border-radius: 3px;
29 background: -moz-linear-gradient(top, #e8f1f3, #dee8ea);
30 background: -webkit-gradient(linear, left top, left bottom, from(#e8f1f3), to(#dee8ea));
31 border-bottom: 1px solid #d0d0d0;
39 border-top-right-radius: 3px;
40 border-top-left-radius: 3px;
41 -moz-border-radius-topright: 3px;
42 -moz-border-radius-topleft: 3px;
43 -webkit-border-top-right-radius: 3px;
44 -webkit-border-top-left-radius: 3px;
47 #page-engine .top .avatar-container {
55 #page-engine .top .avatar {
60 #page-engine .top .name {
65 #page-engine p.bc-name {
70 #page-engine p.bc-infos {
79 #page-engine .page-engine-chan[data-type=groupchat] p.bc-infos {
83 #page-engine p.bc-infos span.show {
87 #page-engine p.bc-infos a {
88 text-decoration: underline;
91 #page-engine div.bc-pep {
95 #page-engine div.bc-pep a {
102 #page-engine div.bc-pep a:hover {
106 #page-engine div.bc-pep a[href]:hover {
110 #page-engine .content,
118 box-shadow: inset 0 3px 10px #e8e8e8;
119 -moz-box-shadow: inset 0 3px 10px #e8e8e8;
120 -webkit-box-shadow: inset 0 3px 10px #e8e8e8;
123 #page-engine .content {
125 padding: 12px 14px 0;
128 #page-engine .content a {
129 text-decoration: underline;
132 #page-engine .page-engine-chan {
136 #page-engine .chat .content,
137 #page-engine .chat .list {
141 #page-engine .chat .content {
142 padding-bottom: 24px;
145 #page-engine .groupchat-content {
146 padding-bottom: 16px !important;
147 right: 191px !important;
151 border-left: 1px solid #c8c8c8;
157 #page-engine .list .role {
162 #page-engine .list .title {
168 #page-engine .list .user {
170 background: -moz-linear-gradient(top, #eff2f2, #ecefef);
171 background: -webkit-gradient(linear, left top, left bottom, from(#eff2f2), to(#ecefef));
172 border-color: #c8c8c8;
181 #page-engine .list .user:hover {
186 #page-engine .list .user:active {
190 #page-engine .list .user.myself {
191 background-color: #eff2f2;
195 #page-engine .list .user .name {
199 margin: 7px 0 7px 3px;
203 #page-engine .list .user .avatar-container {
210 #page-engine .list .user .avatar {
215 #page-engine .one-group,
216 #archives .one-group {
217 border-bottom: 1px dotted #d0d0d0;
222 #page-engine .one-line,
224 #page-engine .one-group b.name,
225 #archives .one-group b.name {
227 word-wrap: break-word;
230 #page-engine .one-group b.name,
231 #archives .one-group b.name {
236 #page-engine .one-group b.name.me,
237 #archives .one-group b.name.me {
241 #page-engine .one-group b.name.him,
242 #archives .one-group b.name.him {
246 #page-engine .one-group span.date,
247 #archives .one-group span.date {
252 #page-engine .one-group .avatar-container,
253 #archives .one-group .avatar-container {
261 #page-engine .one-group .avatar,
262 #archives .one-group .avatar {
267 #page-engine b.name.talk-images {
268 background-position: 50px -99px;
272 #page-engine .user-message,
273 #archives .user-message {
277 #page-engine .system-message {
278 color: #053805 !important;
279 margin-bottom: 3px !important;
280 padding-left: 0 !important;
283 #page-engine .system-message a {
284 color: #053805 !important;
287 #page-engine .system-message p.help b {
289 text-decoration: underline;
293 #page-engine .system-message p.help em {
295 text-decoration: underline;
300 #page-engine .my-nick {
304 #page-engine .old-message {
305 font-size: 11px !important;
306 margin-bottom: 1px !important;
309 #page-engine .chatstate {
310 background-color: rgb(234,234,234);
311 background-color: rgba(234,234,234,0.8);
313 padding: 3px 10px 2px 8px;
318 border-top-right-radius: 3px;
319 -moz-border-radius-topright: 3px;
320 -webkit-border-top-right-radius: 3px;
331 #page-engine .footer {
333 background: -moz-linear-gradient(top, #dee8ea, #e8f1f3);
334 background: -webkit-gradient(linear, left top, left bottom, from(#dee8ea), to(#e8f1f3));
335 border-color: #d0d0d0;
336 border-width: 1px 0 0;
346 #page-engine .chat .footer {
351 #page-engine .chat-tools-content {
358 #page-engine .tools-tooltip {
366 #page-engine .text .chat-tools-smileys {
370 #page-engine .text .chat-tools-file {
374 #page-engine .text .chat-tools-file.mini .bubble-file {
378 #page-engine .text .chat-tools-file.mini .tooltip-subitem {
383 #page-engine .text .chat-tools-file.mini .wait {
384 margin: -2px 0 0 -1px;
387 #page-engine .text .tools-smileys {
388 background-position: 0 -388px;
391 #page-engine .text .tools-style {
392 background-position: 0 -700px;
395 #page-engine .text .tools-file {
396 background-position: 0 -1956px;
399 #page-engine .text .tools-save {
400 background-position: 0 -719px;
403 #page-engine .text .tools-clear {
404 background-position: 0 -739px;
407 #page-engine .text .tools-infos,
408 #channel .top div.shortcuts a.profile {
409 background-position: 0 -758px;
412 #page-engine .text .tools-add,
413 #page-engine .text .tools-archives,
414 #page-engine .text .tools-mucadmin {
418 #page-engine .text .tools-mucadmin {
419 background-position: 0 -777px;
422 #page-engine .bubble-style label.bold {
426 #page-engine .bubble-style label.italic {
430 #page-engine .bubble-style label.underline {
431 text-decoration: underline;
434 #page-engine .bubble-style a.color {
444 -moz-border-radius: 3px;
445 -webkit-border-radius: 3px;
446 box-shadow: 0 0 5px black;
447 -moz-box-shadow: 0 0 5px black;
448 -webkit-box-shadow: 0 0 5px black;
451 #page-engine .bubble-style a.color:hover,
452 #page-engine .bubble-style a.color:focus {
456 #page-engine .bubble-style a.color.selected {
458 border-color: #ffb20d;
461 #page-engine .bubble-file .tooltip-subitem {
465 #page-engine .bubble-file input[type=file] {
469 #page-engine .bubble-file input[type=submit],
470 #page-engine .bubble-file input[type=reset] {
474 #page-engine .text .compose,
475 #page-engine .muc-ask {
480 #page-engine .text .compose {
486 #page-engine .muc-ask {
491 #page-engine .text textarea {
492 border: 1px solid #c8c8c8;
498 -moz-border-radius: 3px;
499 -webkit-border-radius: 3px;
500 border-top-right-radius: 0;
501 border-top-left-radius: 0;
502 -moz-border-radius-topright: 0;
503 -moz-border-radius-topleft: 0;
504 -webkit-border-top-right-radius: 0;
505 -webkit-border-top-left-radius: 0;
508 #page-engine .muc-ask {
509 background-color: #e8f1f3;
514 border-bottom-left-radius: 3px;
515 border-bottom-right-radius: 3px;
516 -moz-border-radius-bottomleft: 3px;
517 -moz-border-radius-bottomright: 3px;
518 -webkit-border-bottom-left-radius: 3px;
519 -webkit-border-bottom-right-radius: 3px;
522 #page-engine .muc-ask label {
524 margin: 23px 10px 0 16px;
528 #page-engine .muc-ask input {
530 margin: 19px 10px 0 10px;
534 #page-engine .tooltip {
543 #page-engine .tooltip a {
545 text-decoration: underline;
548 #page-engine .tooltip-subitem {
549 background-color: rgb(0,0,0);
550 background-color: rgba(0,0,0,0.8);
554 text-shadow: 0 1px 1px black;
556 -moz-border-radius: 5px;
557 -webkit-border-radius: 5px;
560 #page-engine .tooltip-subarrow {
561 background-position: 0 -251px;
568 #page-engine .tooltip .tooltip-top {
573 #page-engine .tooltip label {
579 #page-engine .tooltip label input[type=checkbox] {
584 #page-engine .tooltip label.select {
588 #page-engine .tooltip input,
589 #page-engine .tooltip select {
593 #page-engine .tooltip select {
597 #page-engine .tooltip .tooltip-actionlog:hover,
598 #page-engine .tooltip .tooltip-actionlog:focus {
600 text-decoration: underline;