Mercurial > hg > rc2

comparison skins/larry/mail.css @ 8:bf99236cc5cd

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
try to recover from upgrade fail
author Charlie Root
date Sat, 29 Dec 2018 07:07:34 -0500
parents 4681f974d28b
children
comparison
equal deleted inserted replaced
7:65fd7d441cf1 8:bf99236cc5cd
1 /** 1 /**
2 * Roundcube webmail styles for the Email section 2 * Roundcube webmail styles for the Email section
3 * 3 *
4 * Copyright (c) 2012, The Roundcube Dev Team 4 * Copyright (c) 2012-2017, The Roundcube Dev Team
5 * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com 5 * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
6 * 6 *
7 * The contents are subject to the Creative Commons Attribution-ShareAlike 7 * The contents are subject to the Creative Commons Attribution-ShareAlike
8 * License. It is allowed to copy, distribute, transmit and to adapt the work 8 * License. It is allowed to copy, distribute, transmit and to adapt the work
9 * by keeping credits to the original autors in the README file. 9 * by keeping credits to the original autors in the README file.
14 position: absolute; 14 position: absolute;
15 top: 0; 15 top: 0;
16 left: 0; 16 left: 0;
17 width: 200px; 17 width: 200px;
18 bottom: 0; 18 bottom: 0;
19 z-index: 2; 19 z-index: 1; /* fixes scrolling in Edge (#5750) */
20 } 20 }
21 21
22 #mailview-right { 22 #mailview-right {
23 position: absolute; 23 position: absolute;
24 top: 0; 24 top: 0;
25 left: 212px; 25 left: 212px;
26 right: 0; 26 right: 0;
27 bottom: 0; 27 bottom: 0;
28 z-index: 3;
29 } 28 }
30 29
31 #mailview-right.fullwidth { 30 #mailview-right.fullwidth {
32 left: 0; 31 left: 0;
33 } 32 }
64 position: absolute; 63 position: absolute;
65 top: 0; 64 top: 0;
66 left: 0; 65 left: 0;
67 width: 100%; 66 width: 100%;
68 bottom: 0; 67 bottom: 0;
68 outline: none;
69 } 69 }
70 70
71 #messagelistcontainer { 71 #messagelistcontainer {
72 top: 0; 72 top: 0;
73 bottom: 30px; 73 bottom: 30px;
84 position: absolute; 84 position: absolute;
85 bottom: 0; 85 bottom: 0;
86 left: 0; 86 left: 0;
87 right: 0; 87 right: 0;
88 height: 22px; 88 height: 22px;
89 padding: 4px 6px; 89 padding: 5px 6px 3px;
90 border-top: 1px solid #ddd; 90 border-top: 1px solid #ddd;
91 background: #ebebeb; 91 background: #eaeaea;
92 background: -moz-linear-gradient(top, #ebebeb 0%, #c6c6c6 100%);
93 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ebebeb), color-stop(100%,#c6c6c6));
94 background: -o-linear-gradient(top, #ebebeb 0%, #c6c6c6 100%);
95 background: -ms-linear-gradient(top, #ebebeb 0%, #c6c6c6 100%);
96 background: linear-gradient(to bottom, #ebebeb 0%, #c6c6c6 100%);
97 border-radius: 0 0 4px 4px; 92 border-radius: 0 0 4px 4px;
98 white-space: nowrap; 93 white-space: nowrap;
99 } 94 }
100 95
101 #messagelistfooter.rightalign { 96 #messagelistfooter.rightalign {
162 top: 3px; 157 top: 3px;
163 right: 6px; 158 right: 6px;
164 min-width: 1.8em; 159 min-width: 1.8em;
165 line-height: 15px; 160 line-height: 15px;
166 padding: 2px 4px; 161 padding: 2px 4px;
167 background: #82acb5; 162 background: #6a939f;
168 background: -moz-linear-gradient(top, #82acb5 0%, #6a939f 100%);
169 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82acb5), color-stop(100%,#6a939f));
170 background: -o-linear-gradient(top, #82acb5 0%, #6a939f 100%);
171 background: -ms-linear-gradient(top, #82acb5 0%, #6a939f 100%);
172 background: linear-gradient(to bottom, #82acb5 0%, #6a939f 100%);
173 box-shadow: inset 0 1px 1px 0 #536d72;
174 -webkit-box-shadow: inset 0 1px 1px 0 #536d72;
175 border-radius: 9px; 163 border-radius: 9px;
176 color: #fff; 164 color: #fff;
177 text-align: center; 165 text-align: center;
178 font-weight: bold; 166 font-weight: bold;
179 text-shadow: none; 167 text-shadow: none;
180 } 168 }
181 169
182 .folderlist li.mailbox.selected > a .unreadcount { 170 .folderlist li.mailbox.selected > a .unreadcount {
183 background: #005d76; 171 background: #005d76;
184 background: -moz-linear-gradient(top, #005d76 0%, #004558 100%);
185 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#005d76), color-stop(100%,#004558));
186 background: -o-linear-gradient(top, #005d76 0%, #004558 100%);
187 background: -ms-linear-gradient(top, #005d76 0%, #004558 100%);
188 background: linear-gradient(to bottom, #005d76 0%, #004558 100%);
189 box-shadow: inset 0 1px 1px 0 #003645;
190 -webkit-box-shadow: inset 0 1px 1px 0 #003645;
191 } 172 }
192 173
193 .folderlist li.mailbox.recent > a .unreadcount { 174 .folderlist li.mailbox.recent > a .unreadcount {
194 background: #017cb4; 175 background: #006ca4;
195 background: -moz-linear-gradient(top, #017cb4 0%, #006ca4 100%);
196 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#017cb4), color-stop(100%,#006ca4));
197 background: -o-linear-gradient(top, #017cb4 0%, #006ca4 100%);
198 background: -ms-linear-gradient(top, #017cb4 0%, #006ca4 100%);
199 background: linear-gradient(to bottom, #017cb4 0%, #006ca4 100%);
200 box-shadow: inset 0 1px 1px 0 #005080;
201 -webkit-box-shadow: inset 0 1px 1px 0 #005080;
202 } 176 }
203 177
204 #searchfilter { 178 #searchfilter {
205 position: absolute; 179 position: absolute;
206 right: 256px; 180 right: 256px;
222 position: absolute; 196 position: absolute;
223 top: -6px; 197 top: -6px;
224 left: 0; 198 left: 0;
225 height: 40px; 199 height: 40px;
226 white-space: nowrap; 200 white-space: nowrap;
227 z-index: 10;
228 } 201 }
229 202
230 #messagetoolbar.fullwidth { 203 #messagetoolbar.fullwidth {
231 right: 0; 204 right: 0;
232 } 205 }
235 position: absolute; 208 position: absolute;
236 right: 0; 209 right: 0;
237 top: 0; 210 top: 0;
238 } 211 }
239 212
240 #mailpreviewtoggle { 213 #s_interval {
241 display: block; 214 margin: 3px 8px;
242 position: absolute; 215 }
243 top: 7px;
244 right: 4px;
245 width: 20px;
246 height: 18px;
247 background: url(images/buttons.png?v=51d4.15699) -3px -458px no-repeat;
248 }
249
250 #mailpreviewtoggle.enabled {
251 background-position: -28px -458px;
252 }
253
254 216
255 /*** message list ***/ 217 /*** message list ***/
256 218
257 table.messagelist { 219 table.messagelist {
258 z-index: 1; 220 z-index: 1;
315 277
316 .messagelist tr.message { 278 .messagelist tr.message {
317 /* background-color: #fff; */ 279 /* background-color: #fff; */
318 } 280 }
319 281
320 .messagelist tr.thread.expanded td { 282 .messagelist tr.thread.expanded:not(.selected) td {
321 background-color: #ededed; 283 background-color: #ededed;
322 } 284 }
323 285
324 .messagelist tr.unread { 286 .messagelist tr.unread {
325 font-weight: bold; 287 font-weight: bold;
334 296
335 .messagelist thead tr th.sortedASC a, 297 .messagelist thead tr th.sortedASC a,
336 .messagelist thead tr th.sortedDESC a { 298 .messagelist thead tr th.sortedDESC a {
337 color: #004458; 299 color: #004458;
338 text-decoration: underline; 300 text-decoration: underline;
339 background-image: url(images/listicons.png?v=1877.13442); 301 background-image: url(images/listicons.png?v=c458.10409);
340 background-repeat: no-repeat; 302 background-repeat: no-repeat;
341 background-position: right -912px; 303 background-position: right -912px;
342 } 304 }
343 305
344 .messagelist thead tr th.sortedASC a { 306 .messagelist thead tr th.sortedASC a {
374 } 336 }
375 337
376 .messagelist tr td div.collapsed, 338 .messagelist tr td div.collapsed,
377 .messagelist tr td div.expanded, 339 .messagelist tr td div.expanded,
378 .messagelist tr > .threads .listmenu, 340 .messagelist tr > .threads .listmenu,
379 .messagelist tr > .attachment span.attachment, 341 .messagelist tr .attachment span.attachment,
380 .messagelist tr > .attachment span.report, 342 .messagelist tr .attachment span.report,
343 .messagelist tr .attachment span.encrypted,
381 .messagelist tr > .priority span.priority, 344 .messagelist tr > .priority span.priority,
382 .messagelist tr > .priority span.prio1, 345 .messagelist tr > .priority span.prio1,
383 .messagelist tr > .priority span.prio2, 346 .messagelist tr > .priority span.prio2,
384 .messagelist tr > .priority span.prio3, 347 .messagelist tr > .priority span.prio3,
385 .messagelist tr > .priority span.prio4, 348 .messagelist tr > .priority span.prio4,
386 .messagelist tr > .priority span.prio5, 349 .messagelist tr > .priority span.prio5,
387 .messagelist tr > .flag span.flagged, 350 .messagelist tr .flag span.flagged,
388 .messagelist tr > .flag span.unflagged, 351 .messagelist tr .flag span.unflagged,
389 .messagelist tr > .flag span.unflagged:hover, 352 .messagelist tr .flag span.unflagged:hover,
390 .messagelist tr > .status span.status, 353 .messagelist tr > .status span.status,
391 .messagelist tr > .status span.msgicon, 354 .messagelist tr > .status span.msgicon,
392 .messagelist tr > .status span.deleted, 355 .messagelist tr > .status span.deleted,
393 .messagelist tr > .status span.unread, 356 .messagelist tr > .status span.unread,
394 .messagelist tr > .status span.unreadchildren, 357 .messagelist tr > .status span.unreadchildren,
401 display: inline-block; 364 display: inline-block;
402 vertical-align: middle; 365 vertical-align: middle;
403 height: 18px; 366 height: 18px;
404 width: 20px; 367 width: 20px;
405 padding: 0; 368 padding: 0;
406 background: url(images/listicons.png?v=1877.13442) -100px 0 no-repeat; 369 background: url(images/listicons.png?v=c458.10409) -100px 0 no-repeat;
407 } 370 }
408 371
409 .messagelist tbody tr td.attachment span.attachment { 372 .messagelist tbody tr .attachment span.attachment {
410 background-position: 0 -996px; 373 background-position: 0 -996px;
411 } 374 }
412 375
413 .messagelist thead tr th.attachment span.attachment { 376 .messagelist thead tr .attachment span.attachment {
414 background-position: -24px -996px; 377 background-position: -24px -996px;
415 } 378 }
416 379
417 .messagelist tbody tr td.attachment span.report { 380 .messagelist tbody tr .attachment span.report {
418 background-position: -24px -1116px; 381 background-position: -24px -1116px;
382 }
383
384 .messagelist tbody tr .attachment span.encrypted {
385 background-position: 0 -2272px;
419 } 386 }
420 387
421 .messagelist thead tr th.priority span.priority { 388 .messagelist thead tr th.priority span.priority {
422 background-position: -25px -1845px; 389 background-position: -25px -1845px;
423 } 390 }
424 391
425 .messagelist tr td.priority span.prio5 { 392 .messagelist tr td.priority span.prio5 {
426 background-position: 0 -1905px; 393 background-position: -2px -1905px;
427 } 394 }
428 395
429 .messagelist tr td.priority span.prio4 { 396 .messagelist tr td.priority span.prio4 {
430 background-position: 0 -1885px; 397 background-position: -2px -1885px;
431 } 398 }
432 399
433 .messagelist tr td.priority span.prio2 { 400 .messagelist tr td.priority span.prio2 {
434 background-position: 0 -1865px; 401 background-position: -2px -1865px;
435 } 402 }
436 403
437 .messagelist tr td.priority span.prio1 { 404 .messagelist tr td.priority span.prio1 {
438 background-position: 0 -1845px; 405 background-position: -2px -1845px;
439 } 406 }
440 407
441 .messagelist tbody tr td.flag span.flagged { 408 /* thread parent message with flagged children */
409 .messagelist tbody tr.flaggedroot .flag span {
410 background-position: -23px -1076px;
411 }
412
413 .messagelist tbody tr .flag span.flagged {
442 background-position: 0 -1036px; 414 background-position: 0 -1036px;
443 } 415 }
444 416
445 .messagelist thead tr th.flag span.flagged { 417 .messagelist thead tr th.flag span.flagged {
446 background-position: -22px -1037px; 418 background-position: -22px -1037px;
448 420
449 .messagelist tr:hover td.status span.msgicon { 421 .messagelist tr:hover td.status span.msgicon {
450 background-position: -23px -1057px; 422 background-position: -23px -1057px;
451 } 423 }
452 424
453 .messagelist tr:hover td.flag span.unflagged { 425 .messagelist tr:hover .flag span.unflagged {
454 background-position: -23px -1076px; 426 background-position: -23px -1076px;
455 } 427 }
456 428
457 .messagelist tr td.subject span.msgicon, 429 .messagelist tr td.subject span.msgicon,
458 .messagelist tr td.subject span.unreadchildren { 430 .messagelist tr td.subject span.unreadchildren {
585 #messageheader, 557 #messageheader,
586 #composeheaders { 558 #composeheaders {
587 position: relative; 559 position: relative;
588 padding: 3px 0; 560 padding: 3px 0;
589 background: #f9f9f9; 561 background: #f9f9f9;
590 background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%);
591 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#f0f0f0));
592 background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%);
593 background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%);
594 background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
595 border-bottom: 1px solid #dfdfdf; 562 border-bottom: 1px solid #dfdfdf;
596 } 563 }
597 564
598 #mailview-right #messageheader { 565 #mailview-right #messageheader {
599 border-radius: 4px 4px 0 0; 566 border-radius: 4px 4px 0 0;
625 text-overflow: ellipsis; 592 text-overflow: ellipsis;
626 } 593 }
627 594
628 .headers-table td { 595 .headers-table td {
629 color: #666; 596 color: #666;
630 padding: 2px 8px; 597 padding: 1px 8px;
631 } 598 }
632 599
633 .headers-table td.header, 600 .headers-table td.header,
634 .ui-dialog-content.popup span.adr { 601 .ui-dialog-content.popup span.adr {
635 font-weight: bold; 602 font-weight: bold;
650 text-decoration: underline; 617 text-decoration: underline;
651 } 618 }
652 619
653 .headers-table td.subject { 620 .headers-table td.subject {
654 color: #333; 621 color: #333;
655 font-size: 110%;
656 font-weight: bold; 622 font-weight: bold;
657 } 623 }
658 624
659 .headers-table td.header span, 625 .headers-table td.header span,
660 .ui-dialog-content.popup span.adr { 626 .ui-dialog-content.popup span.adr {
698 left: 0; 664 left: 0;
699 bottom: 0; 665 bottom: 0;
700 width: 18px; 666 width: 18px;
701 padding: 0; 667 padding: 0;
702 outline: none; 668 outline: none;
703 background: #f2f2f2; 669 background: #e9e9e9;
704 background: -moz-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%);
705 background: -webkit-gradient(linear, left top, right top, color-stop(0,#fbfbfb), color-stop(100%,#e9e9e9));
706 background: -o-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%);
707 background: -ms-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%);
708 background: linear-gradient(left, #fbfbfb 0, #e9e9e9 100%);
709 border-right: 1px solid #dfdfdf; 670 border-right: 1px solid #dfdfdf;
710 border-radius: 3px 0 0 0; /* for Opera */ 671 border-radius: 3px 0 0 0; /* for Opera */
711 } 672 }
712 673
713 .moreheaderstoggle:focus { 674 .moreheaderstoggle:focus {
714 background: #f2f2f2; 675 background: #66bcd9;
715 background: -moz-linear-gradient(left, #66bcd9 0, #49b3d2 100%); 676 border-right-color: #66bcd9;
716 background: -webkit-gradient(linear, left top, right top, color-stop(0,#66bcd9), color-stop(100%,#49b3d2));
717 background: -o-linear-gradient(left, #66bcd9 0, #49b3d2 100%);
718 background: -ms-linear-gradient(left, #66bcd9 0, #49b3d2 100%);
719 background: linear-gradient(left, #66bcd9 0, #49b3d2 100%);
720 border-right-color: #149cc5;
721 } 677 }
722 678
723 .moreheaderstoggle .iconlink { 679 .moreheaderstoggle .iconlink {
724 display: inline-block; 680 display: inline-block;
725 position: absolute; 681 position: absolute;
726 top: 8px; 682 top: 8px;
727 left: 0; 683 left: 0;
728 width: 18px; 684 width: 18px;
729 height: 16px; 685 height: 16px;
730 background: url(images/buttons.png?v=51d4.15699) -27px -242px no-repeat; 686 background: url(images/buttons.png?v=d70c.9130) -27px -242px no-repeat;
731 } 687 }
732 688
733 .moreheaderstoggle.remove .iconlink { 689 .moreheaderstoggle.remove .iconlink {
734 top: auto; 690 top: auto;
735 bottom: 5px; 691 bottom: 5px;
745 top: -12px; 701 top: -12px;
746 right: 10px; 702 right: 10px;
747 width: 12px; 703 width: 12px;
748 height: 10px; 704 height: 10px;
749 cursor: pointer; 705 cursor: pointer;
750 background: url(images/buttons.png?v=51d4.15699) center -1579px no-repeat; 706 background: url(images/buttons.png?v=d70c.9130) center -1579px no-repeat;
751 } 707 }
752 708
753 div.hide-headers { 709 div.hide-headers {
754 background-position: center -1590px; 710 background-position: center -1590px;
755 } 711 }
760 padding: 0; 716 padding: 0;
761 height: 180px; 717 height: 180px;
762 border: 1px solid #ccc; 718 border: 1px solid #ccc;
763 border-radius: 4px; 719 border-radius: 4px;
764 background: #fdfdfd; 720 background: #fdfdfd;
765 box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1);
766 -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1);
767 } 721 }
768 722
769 #headers-source { 723 #headers-source {
770 display: none; 724 display: none;
771 position: absolute; 725 position: absolute;
800 top: 11px; 754 top: 11px;
801 left: 30px; 755 left: 30px;
802 width: 32px; 756 width: 32px;
803 height: 32px; 757 height: 32px;
804 overflow: hidden; 758 overflow: hidden;
805 background: url(images/contactpic_32px.png?v=6be9.274) center center no-repeat #fff; 759 background: url(images/contactpic_32px.png?v=ee80.246) center center no-repeat #fff;
806 border-radius: 3px; 760 border-radius: 3px;
807 } 761 }
808 762
809 #messageheader.previewheader #contactphoto img { 763 #messageheader.previewheader #contactphoto img {
810 width: 32px; 764 width: 32px;
859 margin-right: 252px; 813 margin-right: 252px;
860 } 814 }
861 815
862 #messagecontent .rightcol, 816 #messagecontent .rightcol,
863 #messagepreview .rightcol { 817 #messagepreview .rightcol {
864 float: right; 818 position: absolute;
865 /* 819 right: 8px;
866 position: absolute;
867 top: 10px;
868 right: 10px;
869 height: 90%;
870 */
871 width: 230px; 820 width: 230px;
872 margin: 8px;
873 min-height: 200px; 821 min-height: 200px;
874 background: #f0f0f0; 822 background: #f0f0f0;
875 padding: 8px; 823 padding: 8px;
876 border-radius: 4px; 824 border-radius: 4px;
825 z-index: 1;
826 }
827
828 #messagecontent .rightcol {
829 margin-top: 8px;
877 } 830 }
878 831
879 #messagebody { 832 #messagebody {
880 position: relative; 833 position: relative;
881 margin: 8px; 834 margin: 8px;
835 }
836
837 #messagebody.mailvelope {
838 margin: 0;
882 } 839 }
883 840
884 #message-objects div, 841 #message-objects div,
885 #messagebody span.part-notice { 842 #messagebody span.part-notice {
886 margin: 8px; 843 margin: 8px;
956 div.message-partheaders .headers-table { 913 div.message-partheaders .headers-table {
957 width: 100%; 914 width: 100%;
958 } 915 }
959 916
960 div.message-partheaders .headers-table td.header-title { 917 div.message-partheaders .headers-table td.header-title {
961 width: auto; 918 width: 1%;
962 padding-left: 0; 919 padding-left: 0;
920 vertical-align: top;
963 } 921 }
964 922
965 div.message-partheaders .headers-table td.header { 923 div.message-partheaders .headers-table td.header {
966 width: 88%; 924 width: 99%;
967 } 925 }
968 926
969 #messagebody > hr { 927 #messagebody > hr {
970 color: #fff; 928 color: #fff;
971 background: #fff; 929 background: #fff;
1091 border-bottom: 4px solid #c7e3ef; 1049 border-bottom: 4px solid #c7e3ef;
1092 } 1050 }
1093 1051
1094 #compose-contacts .scroller { 1052 #compose-contacts .scroller {
1095 top: 65px; 1053 top: 65px;
1096 border-top: 1px solid #fff;
1097 } 1054 }
1098 1055
1099 #contacts-table { 1056 #contacts-table {
1100 table-layout: fixed; 1057 table-layout: fixed;
1101 } 1058 }
1115 margin-left: 0.5em; 1072 margin-left: 0.5em;
1116 } 1073 }
1117 1074
1118 #compose-contacts li a, 1075 #compose-contacts li a,
1119 #contacts-table td { 1076 #contacts-table td {
1120 background-image: url(images/listicons.png?v=1877.13442); 1077 background-image: url(images/listicons.png?v=c458.10409);
1121 background-position: -100px 0; 1078 background-position: -100px 0;
1122 background-repeat: no-repeat; 1079 background-repeat: no-repeat;
1123 overflow: hidden; 1080 overflow: hidden;
1124 text-overflow: ellipsis; 1081 text-overflow: ellipsis;
1125 } 1082 }
1153 #compose-contacts li.addressbook.selected a { 1110 #compose-contacts li.addressbook.selected a {
1154 background-position: 6px -791px; 1111 background-position: 6px -791px;
1155 } 1112 }
1156 1113
1157 #contacts-table td.contactgroup { 1114 #contacts-table td.contactgroup {
1158 background-position: 6px -1555px; 1115 background-position: 6px -1553px;
1159 } 1116 }
1160 1117
1161 #contacts-table tr.selected td.contactgroup { 1118 #contacts-table tr.selected td.contactgroup {
1162 background-position: 6px -1579px; 1119 background-position: 6px -1577px;
1163 } 1120 }
1164 1121
1165 #contacts-table td.contact { 1122 #contacts-table td.contact {
1166 background-position: 6px -1603px; 1123 background-position: 6px -1601px;
1167 } 1124 }
1168 1125
1169 #contacts-table tr.selected td.contact { 1126 #contacts-table tr.selected td.contact {
1170 background-position: 6px -1627px; 1127 background-position: 6px -1625px;
1171 } 1128 }
1172 1129
1173 #compose-content { 1130 #compose-content {
1174 position: absolute; 1131 position: absolute;
1175 top: 0; 1132 top: 0;
1254 #composeoptions { 1211 #composeoptions {
1255 display: none; 1212 display: none;
1256 padding: 2px 0 0 8px; 1213 padding: 2px 0 0 8px;
1257 white-space: normal; 1214 white-space: normal;
1258 border-top: 1px solid #dfdfdf; 1215 border-top: 1px solid #dfdfdf;
1259 box-shadow: inset 0 1px 0 0 #fff;
1260 -webkit-box-shadow: inset 0 1px 0 0 #fff;
1261 } 1216 }
1262 1217
1263 .composeoption { 1218 .composeoption {
1264 color: #666; 1219 color: #666;
1265 padding-right: 22px; 1220 padding-right: 22px;
1294 border-radius: 0 0 0 4px; 1249 border-radius: 0 0 0 4px;
1295 } 1250 }
1296 1251
1297 #composebodycontainer.buttons { 1252 #composebodycontainer.buttons {
1298 bottom: 42px; 1253 bottom: 42px;
1254 }
1255
1256 #composebodycontainer.mailvelope {
1257 right: 0;
1258 z-index: 10;
1259 }
1260
1261 #composebodycontainer.mailvelope > iframe[scrolling='no'] {
1262 position: relative;
1263 top: -12px;
1299 } 1264 }
1300 1265
1301 #composebody { 1266 #composebody {
1302 position: absolute; 1267 position: absolute;
1303 top: 0; 1268 top: 0;
1309 padding: 4px; 1274 padding: 4px;
1310 resize: none; 1275 resize: none;
1311 font-family: monospace; 1276 font-family: monospace;
1312 font-size: 9pt; 1277 font-size: 9pt;
1313 outline: none; 1278 outline: none;
1314 box-shadow: inset 0 0 2px 1px rgba(0,0,0, 0.1);
1315 -webkit-box-shadow: inset 0 0 2px 1px rgba(0,0,0, 0.1);
1316 } 1279 }
1317 1280
1318 #composebody:active, 1281 #composebody:active,
1319 #composebody:focus { 1282 #composebody:focus {
1320 box-shadow: inset 0 0 3px 2px rgba(71,135,177, 0.9); 1283 box-shadow: inset 0 0 3px 2px rgba(71,135,177, 0.9);
1321 -webkit-box-shadow: inset 0 0 3px 2px rgba(71,135,177, 0.9);
1322 } 1284 }
1323 1285
1324 #compose-attachments { 1286 #compose-attachments {
1325 position: absolute; 1287 position: absolute;
1326 right: 0; 1288 right: 0;
1334 padding: 8px; 1296 padding: 8px;
1335 overflow: auto; 1297 overflow: auto;
1336 } 1298 }
1337 1299
1338 #compose-attachments.droptarget { 1300 #compose-attachments.droptarget {
1339 background-image: url(images/filedrop.png?v=ba79.421); 1301 background-image: url(images/filedrop.png?v=be5d.415);
1340 background-position: center bottom; 1302 background-position: center bottom;
1341 background-repeat: no-repeat; 1303 background-repeat: no-repeat;
1342 } 1304 }
1343 1305
1344 #compose-attachments.droptarget.hover, 1306 #compose-attachments.droptarget.hover,
1345 #compose-attachments.droptarget.active { 1307 #compose-attachments.droptarget.active {
1346 border-color: #019bc6; 1308 border-color: #017db4;
1347 box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5); 1309 box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
1348 -webkit-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
1349 } 1310 }
1350 1311
1351 #compose-attachments.droptarget.hover { 1312 #compose-attachments.droptarget.hover {
1352 background-color: #d9ecf4; 1313 background-color: #d9ecf4;
1353 box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); 1314 box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
1354 -webkit-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9); 1315 }
1316
1317 #compose-attachments .attachment-size {
1318 color: #888;
1319 }
1320
1321 #compose-attachments .hint {
1322 color: #666;
1323 margin: 0 0 8px;
1355 } 1324 }
1356 1325
1357 #composeview-bottom .formbuttons.floating { 1326 #composeview-bottom .formbuttons.floating {
1358 position: absolute; 1327 position: absolute;
1359 width: auto; 1328 width: auto;
1382 } 1351 }
1383 1352
1384 #uploadform form div { 1353 #uploadform form div {
1385 margin: 4px 0; 1354 margin: 4px 0;
1386 } 1355 }
1356
1357
1358 /**** Styles for widescreen (3-column) view ****/
1359
1360 .widescreen #mailview-top {
1361 bottom: 0;
1362 width: 400px;
1363 height: auto;
1364 }
1365
1366 .widescreen #mailview-bottom {
1367 left: 412px;
1368 top:0;
1369 border: 1px solid #b2b8bf;
1370 }
1371
1372 #messagelistheader,
1373 .widescreen #messagelistfooter #countcontrols,
1374 .widescreen .messagelist > thead,
1375 .widescreen .messagelist .branch,
1376 .widescreen table.fixedcopy {
1377 display: none;
1378 }
1379
1380 .widescreen #messagelistcontainer {
1381 top: 34px;
1382 overflow-x: hidden;
1383 }
1384
1385 .widescreen #messagelistheader {
1386 display: block;
1387 position: absolute;
1388 top: 0;
1389 left: 0;
1390 right: 0;
1391 height: 34px;
1392 padding: 6px 6px;
1393 background: #efefef;
1394 border-radius: 4px 4px 0 0;
1395 white-space: nowrap;
1396 border-bottom: 1px solid #dfdfdf;
1397 -webkit-box-sizing: border-box;
1398 -moz-box-sizing: border-box;
1399 box-sizing: border-box;
1400 }
1401
1402 .widescreen #messagelistheader .listmenu {
1403 margin-right: 8px;
1404 vertical-align: middle;
1405 line-height: 24px;
1406 width: 28px;
1407 padding: 0;
1408 text-indent: -5000px;
1409 overflow: hidden;
1410 display: inline-block;
1411 background: url(images/listicons.png?v=c458.10409) 0 -2328px no-repeat;
1412 }
1413
1414 .widescreen #messagelistheader .listmenu:focus {
1415 background-color: rgba(128,128,128,0.55);
1416 outline: none;
1417 }
1418
1419 .widescreen #countcontrols {
1420 line-height: 24px;
1421 display: inline;
1422 min-width: 0;
1423 }
1424
1425 .widescreen #countcontrols span {
1426 padding: 0;
1427 }
1428
1429 .widescreen .pagenavbuttons {
1430 position: absolute;
1431 top: 4px;
1432 right: 6px;
1433 }
1434
1435 .widescreen .pagenavbuttons a.button {
1436 background: none;
1437 border: 0;
1438 padding: 2px;
1439 margin: 0;
1440 height: 20px;
1441 }
1442
1443 .widescreen .pagenavbuttons a.button.pressed {
1444 background: inherit;
1445 }
1446
1447 .widescreen a.listmenu:focus,
1448 .widescreen .pagenav a.button:focus {
1449 border-color: #017db6;
1450 outline: none;
1451 }
1452
1453 .widescreen .messagelist td {
1454 border-left: 0;
1455 vertical-align: top;
1456 padding: 3px 2px !important;
1457 }
1458
1459 .widescreen .messagelist td.subject {
1460 width: 99%;
1461 white-space: wrap;
1462 position: relative; /* for span.date positioning in Firefox */
1463 }
1464
1465 .widescreen .messagelist td.threads {
1466 width: 20px;
1467 vertical-align: bottom;
1468 }
1469
1470 .widescreen .messagelist td.threads div {
1471 padding-bottom: 1px;
1472 }
1473
1474 .widescreen .messagelist td.flags {
1475 width: 22px;
1476 }
1477
1478 .widescreen .messagelist td.subject span {
1479 line-height: 20px;
1480 }
1481
1482 .widescreen .messagelist td.subject span.date {
1483 right: 2px;
1484 top: 3px;
1485 position: absolute;
1486 color: #666;
1487 }
1488
1489 .widescreen .messagelist td.subject span.fromto {
1490 padding-left: 22px;
1491 display: block;
1492 margin-right: 10em;
1493 overflow: hidden;
1494 text-overflow: ellipsis;
1495 color: #666;
1496 }
1497
1498 .widescreen .messagelist tr.flagged td.subject span.date,
1499 .widescreen .messagelist tr.flagged td.subject span.fromto {
1500 color: #ff5c33;
1501 }
1502
1503 .widescreen .messagelist tr.deleted td.subject span.date,
1504 .widescreen .messagelist tr.deleted td.subject span.fromto {
1505 color: #ccc;
1506 }
1507
1508 .widescreen .messagelist td.subject span.subject {
1509 clear: both;
1510 display: block;
1511 font-size: 12px;
1512 overflow: hidden;
1513 text-overflow: ellipsis;
1514 }
1515
1516 .widescreen .messagelist td.flags span {
1517 width: 20px;
1518 height: 20px;
1519 display: block;
1520 margin-left: 1px;
1521 }
1522
1523 .widescreen .messagelist td.flags span.flag {
1524 cursor: pointer;
1525 }
1526
1527 .widescreen .messagelist tr td.subject span.msgicon,
1528 .widescreen .messagelist tr td.subject span.unreadchildren {
1529 width: 20px;
1530 height: 20px;
1531 }
1532
1533 /* move attachments list to the bottom on narrow mail preview page */
1534 @media screen and (max-width: 800px) {
1535 #messagepreview .leftcol {
1536 margin-right: 0;
1537 }
1538 #messagepreview .rightcol {
1539 min-height: 0;
1540 width: auto;
1541 right: 0;
1542 position: relative;
1543 border-radius: 0;
1544 border-bottom: 1px solid #dfdfdf;
1545 background-color: #f9f9f9;
1546 padding: 5px;
1547 }
1548 ul.attachmentslist,
1549 ul.attachmentslist > li,
1550 div.rightcol > div > a.button {
1551 vertical-align: middle;
1552 display: inline-block;
1553 margin-top: 0;
1554 }
1555 }