FlatQQMail

Flat Style For QQMail

当前为 2020-08-02 提交的版本,查看 最新版本

  1. @charset "UTF-8";
  2. /* ==UserStyle==
  3. @name FlatQQMail
  4. @name:zh QQ 邮箱个性化样式
  5. @namespace github.com/benzbrake/FlatQQMail
  6. @version 2.0.1
  7. @description Flat Style For QQMail
  8. @author Ryan
  9. @var text login-background "Login Page Background" url(https://area.sinaapp.com/bingImg?daysAgo=2)
  10. @var text left-panel-width "Left Sidebar Width" 190px
  11. ==/UserStyle== */
  12. @namespace url(http://www.w3.org/1999/xhtml);
  13. @-moz-document domain("mail.qq.com") {
  14. html {
  15. --main-color: #0078d4;
  16. --main-text-color: #fff;
  17. --navbar-height: 60px;
  18. --search-background: rgba(255, 255, 255, .7);
  19. --search-hover-background: #fff;
  20. --search-border-color: #c7e0f4;
  21. --left-panel-background: #f3f2f1;
  22. --left-panel-hover: #edebe9;
  23. --left-panel-active: #c7e0f4;
  24. --left-panel-active-text-color: #005a9e;
  25. --left-panel-text-color: #323130;
  26. --left-panel-border-color: #edebe9;
  27. --toolbar-background: #f3f2f1;
  28. --toolbar-height: 44px;
  29. --toolbar-border-color: #edebe9;
  30. --panel-background-color: #C7E0F4;
  31. --panel-border-color: #edebe9;
  32. --panel-text-color: #323130;
  33. --panel-white-background-color: #fff;
  34. --panel-white-border-color: #d0d0d0;
  35. --panel-gray-background-color: #faf9f8;
  36. --btn-background: #f3f2f1;
  37. --btn-hover-background: #edebe9;
  38. --btn-text-color: #004578;
  39. --btn-border-color: #edebe9;
  40. --btn-primary-background: #0078d4;
  41. --btn-primary-text-color: #fff;
  42. --btn-primary-hover-background: #005a9e;
  43. --btn-secondary-background: #eff6fc;
  44. --btn-secondary-hover-background: #deecf9;
  45. --btn-secondary-text-color: #005a9e;
  46. --link-color: #2672ec;
  47. --icon-search: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAv0lEQVQ4jc2SwQ2DMAxFGYEROEb6z1JG6AgdgREYgQ0YoSMwQkbICIzACPTi9IAIoKqH+hTF/vb3/26av4sYYwuMQAZWYJY03AJL6h2UzWyS1JvZBGxADiF0VXAIoQNWM5tijO0BqwykagOfuOzBuwGbpP6wQaF9seICjNXklVgu6KuWTHcYVGvcurWmtKTB3XicUcxAlhR34I+9ZwyL0qn47u9yUNlduD4qM3v6SjMwFkb+V7fyThStvm7w83gDIMhQYknIEDsAAAAASUVORK5CYII=);
  48. --icon-wireless: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAtUlEQVQ4jd2SYQ3FIAyEkYCESZgEJCBhEiYBB0hAwiRMwiRMAhK+/XjH0nRvAt5rQtJej2tzEML/BLC84LOrI5AfJKB7EZGbwxKfmC24A7vyavAGbEasKN+A0wp0IOugKSMfApNqy4tjfUQowKFph/BTmyRt2tQHSF6g6mLSml29rkubE8jBFIs3SOTRG0Znw5u+mViA+GJiNSYe1sTbIPdklec/uI32f2Edk61wcKFNVo//cFxsZm+SzPAjvgAAAABJRU5ErkJggg==);
  49. --icon-star: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA80lEQVQ4jbWSwW2FMBBEpwRKoARKSAkpgRJ8wbtHOnAJlEAJlLASHp8pwSWQAyR8fj5OgpS92NJq386MDfxr6dzC090b7lIDYYZyRZeaG9s5QGMPYYCk8Y/DVm/brYazCsoVanVZrqeDMEA5QblAY38AYw9hhqQRGnvo3J6BygXKCcIAT/fSs5/f4el2mEGYj+a2eflVWF1qoFwgDOeGMECYi5DL4cPKAKFdAj5tFjecvD3VTwqhc3tS4Kx6Alj5Z3o6KAc4q76CVa7b3ertfHje7xLTuIeUoZzQpWYPbthBVv6VGt+gHF763PIJ0Lm9BtyoD2Y3oxhUL8HuAAAAAElFTkSuQmCC);
  50. --icon-unstar: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAvElEQVQ4jbWSwQ2DMBAEtwRKSAmUkBIoISX4g++edEAJlEAJLsESrN+UQAnJA4JCgsEgZaX92No5++6Av8n4DEoHpYPx2XmA9hWUz9nN+erCcQEIR6i/pYfX1d+Qeu+5dygdhH5VedsDJLSwXfEB4HAQ2vYiCe0FwFdjp5GlhYV+e7QpkGgYAGxXHAIsTXwalub4C30VB6Q0U0K7A6BfbZ+whrD+6UFU2j3mRXIoQ76clyGHspnuukcccEEvoT4gV5LOlygAAAAASUVORK5CYII=);
  51. --icon-edit: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAv0lEQVRIie2UYQ3DIBBGK6ESKgEJSJgUJOBgEpAwCZNQCUhAwtsfyAgpHLsmy5LuS/jV63t3XNNl+ecbAQywA14qtIADvHBM9c4GRN7pS5rCXu5N5x4I1fM0EgCEyWupOy+SBNwkQX/EY3iJq69OLQDWvNA6EdikxkTBKbgkmIEDq0qQ4Y8GvjdwJ+7vSDADl6aXBCJcLcjdi/AzAlvBn6MlagUmS8Zfh1bwSX5KEJF/1+0Js4JSqEkCrGb6i+cFOBKaSL4ZmCkAAAAASUVORK5CYII=);
  52. --icon-receive: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAi0lEQVRIie3UXQ2AIBSGYSMQgQhGMAJRjGAjIxjBCEYgwuuFsjkm7Bx+7nhvle/Z1DlNI2nATr4TMDWApHIkLCSumXdc2qECShA1IG0AA6gDAKuX5eMzcHUBgAXw2fOlAODCeHMAWL/jcS2ALTWeBCRF51xyNLqx+E/J85LVT0AVz2fquwEvYrsCf92tlzD9U+HLQgAAAABJRU5ErkJggg==);
  53. --icon-contacts: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABOElEQVRIid2UsW2GMBCF/xE8AiN4BEZgBIoM4AkiNmAERmAEyr9kgBQoSpGSOtWXIs/KCWyC/9AklpB83Pm9e3dn327/fgEOaICgr7oSvAZW9itcBQ4wA15KamDU//a3BJOydwe+SvYu5ifwSll2GX8jfyM7xP1ZgtoCJPzOJgB0uWRyBP6ozkZhK3ssVRAzHDL+sCnRUjy+wCCQevPfq8GTIZuKwI2KOSoRUCfwVX16Bt4fmaI48wF4MRfsQ4C9/E/AXb7xLLg3maP6LsAb8Kp9XKvpQ69zeTV8zXcsQTgKVmxMpDUkaSWm5kUTwffT4WUvyZFVA3dTc4LASfEgu02qUCZzCbg52wOr9j7ut0ELmYt1gqCV+ioqSgUB9A8SxMfP9sFtgy4jyAX1pQ02Z53Ol93oP7E+AVmOV2PqRK2HAAAAAElFTkSuQmCC);
  54. --icon-profile: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA8ElEQVQ4ja1SwQ3DIAy8ETJCR+gIGSEjdAQ+BT+7QUfICBkhIyDB8c4IHYE+aNJQHKmVaskSNvh82Af81YzvILGHDYPqEnsY3+nF13SGcIFwhkuT6sIZwgxL0wIIZ/1CY8kM8ad30vEOYYbj/Q3oT4UNH1UeQGETLp8MalSXJki8QWJfqO8KhKMOUMcLrulczvEG4XgMULpk2DBUjxx9mT6X5u5LgMc2+Z++YMMAR7/tvKw4b3EDsK6m6p6mWkScN4YNgKWp1iixV4V0yKAklzapmPFdmc1eSGtXYX5JdlTdpUkVVmU2DJBwOfRVG/+yJ+El7HPQij/5AAAAAElFTkSuQmCC);
  55. --icon-read: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAyElEQVQ4jcWSQbHDMAxEDaEQCiEQCiEQCqEQetPs08EQPoRAKARDKIRAcC/K1PObuL5VMzpJet6VnFIncs6nXr0bwBVYgQpchwfN7AIUYHX3LOkekAJMXbnunuPVR9sMTMACVHfPH9Yauauk2xdbT6BKmtvCH1BGlxYKl/+AZbOxB9pqbf8HwMzOIfG5s4MSNqdDwPZSSKyS5rjKChQzO3cVtJLjIjWGl9bWECCllCTd9nYyDDiKI0CRNI9kfKo3oPE7nNtJfx8v4dADOEfYAroAAAAASUVORK5CYII=);
  56. --icon-unread: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAuUlEQVQ4jd2SvRGDMAyFNYJHyAiMwAgp8aPxCGzCCBmBHiJ7BEbwCC4goiRNSCD8hbukybtToyd9eoWI/kPCKITRH6mOcRkDemH4tkS0d6wtEQnDC6OfAG5XfRZGaKok3ltuGWYGICJqqiQeYO/LjwN+8BYB04g6e/k6E4Yfp1sFEBEFZ5RY1MJpLpzmYlF3LjmNZzYBz77VTqx2wRk18z4BbOn7gKWYawrOqCnAanf0E4VRHE39G90BhIreKURRbZ0AAAAASUVORK5CYII=);
  57. --icon-open: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAjUlEQVQ4jc2Syw2AIBBEpyRLoARLsAQvwh7phBIsgR5gqcMS9IAaMYJwY5I5AHmPTwD6CXkNxRuI96QAQGw+55NE2IDclDTKRRyzzQuI9xv4iuT5hG274Ia9hnRjm+AJA8ASBqiw1gnecDFvQQ6uukJp5yoBeZE9dvMjtgnYQLqxWPI6IzgX/nr92G5yAGUcu9jyutmAAAAAAElFTkSuQmCC);
  58. --icon-remark: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA20lEQVQ4jc2RwW2EMBBFXwmU4BK2hC2BEijBl2XmSAdbgkugBEoYyYzPlEAJycEskSICUSJFmaOl/8bzPvy/idag84D6hLihviBlRPx5HX6UG+oL6hM631ELqAX63KKeEF/R+X4cVguoL/S5PV0gvvIotwOAJ3QeLn+puUPKeARYUAsA9B7rCblDc7dtrg6iNYiv54DqYNhkJvrc7lvVwleAhObuFyds5DPIq6VDiUC9299QT/tbtGZ3cNXSB8inKvDV/eYkWnMdBhB/Ir4iZfx+6DNAPf0s/NfzDiRljNr0+6LkAAAAAElFTkSuQmCC);
  59. --icon-archive: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAnUlEQVQ4jWNgoBooOC/AUHG5gaHiynyCuOC8AKYBEM33GcqvrsePr7xnKL/Sj2lA+ZXz2CUw1PUzlF95jypYetWAoeLKf4aKyw7EefXKf4aK8wrozv9PlP8h+D+qayGCRPgfORyurkc1AEWAAMBQjywA8QpuTNiASwl4MUEDKPYCWQaUX+kn6HdMPB9hQOlVA4J+R8elVw2IdjFNAQA/HvRDaCX5CQAAAABJRU5ErkJggg==);
  60. --icon-print: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAqklEQVQ4ja2Syw2EMAxEpwRKoARK2BIohUtid0EJlJASKCFS1j5TAiVkL/shLCRBwtI7+mWiMXD7DL7549IyyQqWeMBUFrBvwRLfkgUsy044VwrUwWgHox1s6NMkvq1LQOITPgKjXY3Ag5+PBFJXL8iRFQAAyQhSd8pprTb02cUtNvRHL69gmcEyFb/BEtMkg2++PZOMmWM6qfMnuMD+HrZdlyB1mRoruHNe5u4hWjZlUXgAAAAASUVORK5CYII=);
  61. --icon-more: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAR0lEQVQ4jWNgGAWDEZRfOc9QcdkBQ7zisgND+ZXzDAXnBQgZ0M9QceU/iiEQze8Zyq/0E+sKhCEka0Y3hCzNyIaQrXkUEA0ARk4rJRXvtL4AAAAASUVORK5CYII=);
  62. --icon-less: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAS0lEQVQ4jWNgGAU0BqVXDRhKrxqQr7n8ynuG8ivvSTcEprniyn6Giiv7STMEWXPBeQEGBgYG0gyB2QrTjC5OEBScF8DQjCw3CqgPABPcMBAhyIGPAAAAAElFTkSuQmCC);
  63. --icon-ok: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAxklEQVQ4jbWTQQ3DMAxFP4RCKIRCKIRCGARf6uRYBoMwCIVQCJES51wIgbDdtqZxs2jSLPkUvW9/2wH+EuQ6zHEAC8GGBTaMINe1wTaMMOJg5VmkkXsdZiEYSSr8EXEXlV3/Fa52YuXRBL/T9WeBvVIxgf2UFWE/nQWO0A4rWw77W24xLLnA8dFIArkOJq5gIcxxKOfjb+cONnXaKqxZYCF1Zfpsdv2wrg6oyDDWbuFaxEgCC+lwaWfLrJi4lrtvieZP9GO8ALgCKoREiWXrAAAAAElFTkSuQmCC);
  64. }
  65.  
  66. body {
  67. padding: 0;
  68. }
  69.  
  70. /** Set Font Size */
  71. body,
  72. td,
  73. input,
  74. button,
  75. select,
  76. .f_size {
  77. font-size: 14px;
  78. }
  79.  
  80. /** Remove border radius */
  81. * {
  82. border-radius: 0 !important;
  83. }
  84.  
  85. /** Remove horizontal scroll bar */
  86. html {
  87. overflow-x: hidden;
  88. }
  89.  
  90. a,
  91. a:link {
  92. outline: 0;
  93. color: var(--link-color);
  94. text-decoration: none;
  95. }
  96.  
  97. img[src^="/cgi-bin/readtemplate"] {
  98. display: none;
  99. }
  100.  
  101. /** Error Message */
  102. .errmsg {
  103. background: var(--panel-background-color);
  104. color: var(--panel-text-color);
  105. }
  106.  
  107. .btn_gray {
  108. /** Reset Gray Button Style */
  109. color: var(--btn-text-color) !important;
  110. background: var(--btn-background);
  111. border-color: transparent;
  112. border-radius: 2px;
  113. transition: all 0.156s linear;
  114. cursor: pointer;
  115. }
  116.  
  117. .btn_gray:hover,
  118. .btn_gray:active,
  119. .btn_gray:focus {
  120. /** Reset Gray Button hover/active/focus Style */
  121. background: var(--btn-hover-background);
  122. border-color: var(--btn-border-color);
  123. box-shadow: unset;
  124. }
  125.  
  126. #composeExitAlert_QMDialog_btn_not_exit:hover {
  127. border-color: red;
  128. background-color: red;
  129. color: white !important;
  130. }
  131.  
  132. #composeExitAlert_QMDialog_btn_exit_save:hover {
  133. border-color: var(--btn-primary-background);
  134. background: var(--btn-primary-background);
  135. color: var(--btn-primary-text-color) !important;
  136. }
  137.  
  138. input.txt,
  139. input.txt2,
  140. textarea.txt,
  141. .txt,
  142. .qm_txt {
  143. border: 1px solid var(--panel-white-border-color);
  144. }
  145.  
  146. .dialog_operate {
  147. background: var(--panel-white-background-color);
  148. }
  149.  
  150. /** Navbar */
  151. #topDataTd {
  152. background-color: var(--main-color);
  153. color: var(--main-text-color);
  154. height: var(--navbar-height);
  155. }
  156. #topDataTd a,
  157. #topDataTd a:link,
  158. #topDataTd .addrtitle {
  159. color: var(--main-text-color);
  160. }
  161. #topDataTd a.imglogo {
  162. /** Mail Logo */
  163. display: flex;
  164. align-items: center;
  165. width: 135px !important;
  166. }
  167. #topDataTd a.imglogo img {
  168. /** Mail Logo Image */
  169. background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEJFODBCNEZDQkQ0MTFFNEE1RTZCQ0U1NDAxRUI5RUIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEJFODBCNTBDQkQ0MTFFNEE1RTZCQ0U1NDAxRUI5RUIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowQkU4MEI0RENCRDQxMUU0QTVFNkJDRTU0MDFFQjlFQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowQkU4MEI0RUNCRDQxMUU0QTVFNkJDRTU0MDFFQjlFQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgR8ts0AAACOSURBVHja7NjBCQIxEAXQjHiNdmIDNmUDnmxgm9oGtpPdFDDi0ZtgDm58cwkEEngMfyCJzCwj1KEMUiAgICAgICAgICAgu6tjj0u21t5eZ+f7Eq91fVw+2j/VGjoC8qMVPT4f4jZ/dT6nq4507YipJewyYmqZWsIOMlJGdAQEBAQEBAQEBAQE5J8hTwEGAJxNPE8HR8BNAAAAAElFTkSuQmCC);
  170. background-repeat: no-repeat;
  171. background-position: center;
  172. width: 30px;
  173. height: 30px;
  174. margin-left: 10px;
  175. }
  176. #topDataTd a.imglogo:after {
  177. /** Mail Logo Text */
  178. content: "QQMail";
  179. color: var(--main-text-color);
  180. font-size: 20px;
  181. margin-left: 10px;
  182. }
  183. #topDataTd #logotips {
  184. /** Logo Wrapper */
  185. flex: 1;
  186. display: flex;
  187. width: calc(100% - 380px);
  188. /** Clear Z-index */
  189. z-index: unset;
  190. }
  191. #topDataTd #logotips .switch {
  192. margin: 5px 0 5px auto;
  193. /** Tips Icon */
  194. }
  195. #topDataTd #logotips .switch .left {
  196. margin-top: 5px !important;
  197. }
  198. #topDataTd #logotips .switch span.addrtitle {
  199. color: var(--main-text-color);
  200. margin-top: 4px;
  201. display: block;
  202. }
  203. #topDataTd #logotips .switch .icon_securityCenterTip {
  204. position: relative;
  205. background: orange;
  206. border-radius: 50% !important;
  207. }
  208. #topDataTd #logotips .switch .icon_securityCenterTip::before {
  209. content: "";
  210. width: 4px;
  211. height: 4px;
  212. background: #fff;
  213. display: block;
  214. border-radius: 50%;
  215. left: 4px;
  216. position: absolute;
  217. top: 2px;
  218. }
  219. #topDataTd #logotips .switch .icon_securityCenterTip::after {
  220. content: "";
  221. display: block;
  222. height: 5px;
  223. background: #fff;
  224. width: 2px;
  225. position: absolute;
  226. left: 5px;
  227. bottom: 2px;
  228. }
  229. #topDataTd .topdata {
  230. /** Navbar Wrapper */
  231. width: 100%;
  232. height: var(--navbar-height);
  233. display: flex;
  234. flex-direction: row-reverse;
  235. }
  236. #topDataTd .topdata .topbg {
  237. /** Search Wrapper */
  238. background: transparent;
  239. width: 425px;
  240. height: var(--navbar-height) !important;
  241. float: none;
  242. position: relative;
  243. }
  244. #topDataTd .topdata .topbg .search_subject {
  245. position: absolute;
  246. margin: 10px;
  247. height: 40px;
  248. right: 0;
  249. top: 0;
  250. width: 170px;
  251. display: flex;
  252. align-items: center;
  253. }
  254. #topDataTd .topdata .topbg .search_subject .smartsearch {
  255. margin: 0;
  256. height: 30px;
  257. line-height: 30px;
  258. background: var(--search-background);
  259. border-color: var(--search-border-color);
  260. border-radius: 3px !important;
  261. box-shadow: unset;
  262. padding: 0;
  263. /** Search Icon */
  264. }
  265. #topDataTd .topdata .topbg .search_subject .smartsearch #subject {
  266. background: transparent;
  267. padding: 0 21px;
  268. height: 30px;
  269. width: 120px !important;
  270. transition: background 0.156s;
  271. line-height: 30px;
  272. border: 0;
  273. }
  274. #topDataTd .topdata .topbg .search_subject .smartsearch #subject:focus {
  275. background: var(--search-hover-background);
  276. }
  277. #topDataTd .topdata .topbg .search_subject .smartsearch #searchIcon,
  278. #topDataTd .topdata .topbg .search_subject .smartsearch #subjectsearchLogo {
  279. top: 8px;
  280. }
  281. #topDataTd .topdata .topbg .search_subject .smartsearch #searchIcon {
  282. background: var(--icon-search);
  283. }
  284. #topDataTd .topdata .topbg .setinfo {
  285. position: absolute;
  286. bottom: 10px;
  287. margin: unset;
  288. left: 0;
  289. z-index: 9;
  290. }
  291. #topDataTd .topdata .topbg .setinfo #sendToMobileIcon {
  292. width: 16px;
  293. height: 16px;
  294. background-position: unset;
  295. background: var(--icon-wireless) !important;
  296. }
  297. #topDataTd #setAliasTiprlt .newtips .arrowup {
  298. background: transparent;
  299. width: 0;
  300. border-left: 5px solid transparent;
  301. border-right: 5px solid transparent;
  302. border-bottom: 9px solid var(--panel-border-color);
  303. height: 0;
  304. margin-bottom: 0;
  305. top: -2px;
  306. }
  307. #topDataTd #setAliasTiprlt .newtips .contentcontainer,
  308. #topDataTd #setAliasTiprlt .newtips .content {
  309. background: var(--panel-background-color);
  310. }
  311.  
  312. .bodybgbt {
  313. position: static;
  314. left: 0;
  315. top: 0;
  316. width: var(--left-panel-width);
  317. }
  318.  
  319. #leftPanel {
  320. position: static;
  321. left: 0;
  322. top: 0;
  323. width: var(--left-panel-width);
  324. /** Move Leftpanel Compose Div to Navbar and Compact */
  325. /** Compact #navMidBar */
  326. }
  327. #leftPanel #navBarDiv {
  328. max-width: 500px;
  329. position: absolute;
  330. top: 0;
  331. left: 150px;
  332. height: 60px;
  333. }
  334. #leftPanel #navBarDiv .navbar {
  335. display: flex;
  336. background: transparent;
  337. height: 60px;
  338. width: auto;
  339. }
  340. #leftPanel #navBarDiv .navbar li {
  341. color: var(--main-text-color);
  342. height: 100% !important;
  343. margin: 0;
  344. padding: 0;
  345. display: block;
  346. position: relative;
  347. }
  348. #leftPanel #navBarDiv .navbar li input {
  349. margin: 0;
  350. padding: 0;
  351. height: 24px;
  352. width: 24px;
  353. position: absolute;
  354. float: none;
  355. left: 15px;
  356. top: 17px;
  357. z-index: -1;
  358. }
  359. #leftPanel #navBarDiv .navbar li input.composebtn {
  360. background: var(--icon-edit);
  361. }
  362. #leftPanel #navBarDiv .navbar li input.checkbtn {
  363. background: var(--icon-receive);
  364. }
  365. #leftPanel #navBarDiv .navbar li input.addrbtn {
  366. background: var(--icon-contacts);
  367. }
  368. #leftPanel #navBarDiv .navbar li a {
  369. margin: 0;
  370. padding: 0 10px 0 40px;
  371. color: var(--header-text-color);
  372. height: 60px !important;
  373. line-height: 60px;
  374. transition: background 0.156s;
  375. }
  376. #leftPanel #navBarDiv .navbar li a:hover,
  377. #leftPanel #navBarDiv .navbar li a:focus {
  378. background: rgba(0, 0, 0, 0.3);
  379. }
  380. #leftPanel #navMidBar {
  381. width: var(--left-panel-width);
  382. top: 60px;
  383. bottom: 0;
  384. background: var(--left-panel-background);
  385. box-sizing: border-box;
  386. border-right: 2px solid var(--left-panel-border-color);
  387. }
  388. #leftPanel #navMidBar .folderDiv {
  389. margin: 10px 0;
  390. }
  391. #leftPanel #navMidBar .folderDiv #OutFolder li {
  392. padding: 0;
  393. margin: 0;
  394. height: auto;
  395. position: relative;
  396. transition: all 0.156s linear;
  397. }
  398. #leftPanel #navMidBar .folderDiv #OutFolder li a {
  399. padding: 5px;
  400. padding-left: 28px;
  401. line-height: 22px;
  402. display: block;
  403. }
  404. #leftPanel #navMidBar .folderDiv #OutFolder li a:link,
  405. #leftPanel #navMidBar .folderDiv #OutFolder li a:visited {
  406. color: var(--left-panel-text-color);
  407. }
  408. #leftPanel #navMidBar .folderDiv #OutFolder li a:hover {
  409. background-color: transparent;
  410. }
  411. #leftPanel #navMidBar .folderDiv #OutFolder li .empty_link {
  412. color: var(--btn-primary-text-color) !important;
  413. background: var(--btn-primary-background);
  414. border-radius: 2px;
  415. transition: background-color 0.156s ease;
  416. margin: 0;
  417. padding: 4px 8px;
  418. position: absolute;
  419. right: 10px;
  420. top: 0;
  421. }
  422. #leftPanel #navMidBar .folderDiv #OutFolder li .empty_link:hover {
  423. background: var(--btn-primary-hover-background);
  424. }
  425. #leftPanel #navMidBar .folderDiv #OutFolder li:hover {
  426. background: var(--left-panel-hover);
  427. }
  428. #leftPanel #navMidBar .folderDiv #OutFolder li.fn,
  429. #leftPanel #navMidBar .folderDiv #OutFolder .fn_list {
  430. background: var(--left-panel-active) !important;
  431. }
  432. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep {
  433. display: flex;
  434. flex-direction: column;
  435. }
  436. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep span {
  437. margin: 0;
  438. padding: 0;
  439. }
  440. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a {
  441. transition: all 0.156s linear;
  442. }
  443. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:hover,
  444. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:active,
  445. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep a:focus {
  446. background: var(--left-panel-hover);
  447. }
  448. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:hover,
  449. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:active,
  450. #leftPanel #navMidBar .folderDiv #OutFolder #my_note li.fs_sep:focus {
  451. background: transparent;
  452. }
  453. #leftPanel #navMidBar .folderDiv #OutFolder .nolinkbg {
  454. /** Hide | */
  455. display: none !important;
  456. }
  457. #leftPanel #navMidBar .folderDiv #OutFolder .icon_folderlist_star {
  458. background: var(--icon-unstar);
  459. width: 16px;
  460. height: 16px;
  461. margin: 2px;
  462. }
  463. #leftPanel #navBottomTd {
  464. display: none;
  465. }
  466.  
  467. #sepLineTd {
  468. display: none;
  469. }
  470.  
  471. .pInfoItem .itemHead {
  472. white-space: nowrap;
  473. }
  474.  
  475. /** Main Frame*/
  476. #mainFrameContainer {
  477. top: 60px;
  478. left: 190px;
  479. }
  480.  
  481. .tbody {
  482. padding: 0;
  483. margin: 0;
  484. }
  485.  
  486. /* Title */
  487. .txt_title {
  488. margin: 0 !important;
  489. padding: 10px;
  490. }
  491.  
  492. /* Toolbar */
  493. .toolbgline {
  494. background: var(--toolbar-background);
  495. position: fixed !important;
  496. top: 0;
  497. left: 0;
  498. right: 0;
  499. height: var(--toolbar-height);
  500. padding: 0;
  501. z-index: 9 !important;
  502. border: 2px solid var(--toolbar-border-color);
  503. border-width: 0 2px 2px 0;
  504. }
  505. .toolbgline .btn_sepline {
  506. display: none;
  507. }
  508. .toolbgline .left {
  509. /** filter .btn_back */
  510. margin: 10px;
  511. }
  512.  
  513. .toolheight .right,
  514. .toolheight .qm_right {
  515. padding: 13px !important;
  516. margin: 0 !important;
  517. }
  518.  
  519. /* Make Bottom toolbar not fixed */
  520. .list_btline ~ .toolbgline {
  521. position: static !important;
  522. padding: 0;
  523. }
  524.  
  525. #tips {
  526. padding: 10px;
  527. }
  528.  
  529. /* Mail List */
  530. table.O2 {
  531. border: 0px;
  532. padding: 10px;
  533. }
  534. table.O2 td {
  535. background: transparent;
  536. border: 0px;
  537. background-color: unset;
  538. }
  539.  
  540. .talk {
  541. margin: 0;
  542. padding: 10px;
  543. }
  544.  
  545. table.M,
  546. table.F {
  547. padding: 10px;
  548. border: 0;
  549. box-shadow: unset;
  550. }
  551.  
  552. /** Replace Icons */
  553. .Rr {
  554. background: var(--icon-read) 0 0 no-repeat;
  555. }
  556.  
  557. .Ru {
  558. background: var(--icon-unread) 0 0 no-repeat;
  559. }
  560.  
  561. table.i td.fs1 div {
  562. width: 16px;
  563. height: 16px;
  564. background: var(--icon-unstar) 0 0 no-repeat;
  565. }
  566.  
  567. table.i td.fg div {
  568. width: 16px;
  569. height: 16px;
  570. background: var(--icon-star) 0 0 no-repeat;
  571. }
  572.  
  573. input.s1bg,
  574. .ico_profileTips,
  575. .ico_profile_verified {
  576. width: 16px;
  577. height: 16px;
  578. background: var(--icon-profile) 0 0 no-repeat;
  579. }
  580.  
  581. .qm_ico_reopen {
  582. width: 16px;
  583. height: 16px;
  584. background: var(--icon-open) 0 0 no-repeat;
  585. }
  586.  
  587. .qm_ico_remarkoff {
  588. width: 16px;
  589. height: 16px;
  590. background: var(--icon-remark) 0 0 no-repeat;
  591. }
  592.  
  593. .qm_ico_addFilter {
  594. width: 16px;
  595. height: 16px;
  596. background: var(--icon-archive) 0 0 no-repeat;
  597. }
  598.  
  599. .qm_ico_print {
  600. width: 16px;
  601. height: 16px;
  602. background: var(--icon-print) 0 0 no-repeat;
  603. }
  604.  
  605. .qm_ico_quickdown {
  606. background: var(--icon-more) 0 0 no-repeat;
  607. }
  608.  
  609. .qm_ico_quickup {
  610. background: var(--icon-less) 0 0 no-repeat;
  611. }
  612.  
  613. .mailList_sendIcon_Succeed {
  614. width: 16px;
  615. height: 16px;
  616. background: var(--icon-ok) 0 0 no-repeat;
  617. }
  618.  
  619. .selbar_bt {
  620. padding: 10px !important;
  621. background: var(--panel-white-background-color);
  622. }
  623. .selbar_bt a {
  624. padding: 5px;
  625. transition: all 0.156s linear;
  626. color: var(--btn-text-color);
  627. background-color: var(--btn-background);
  628. }
  629. .selbar_bt a:hover,
  630. .selbar_bt a:focus,
  631. .selbar_bt a:active {
  632. background-color: var(--btn-hover-background);
  633. }
  634.  
  635. #qqmail_mailcontainer {
  636. margin-top: var(--toolbar-height);
  637. position: relative;
  638. }
  639. #qqmail_mailcontainer .txt_title {
  640. display: none;
  641. }
  642. #qqmail_mailcontainer .settingtable {
  643. border-color: var(--toolbar-border-color);
  644. background: var(--toolbar-background);
  645. }
  646. #qqmail_mailcontainer .mail_list_thumb_form {
  647. background: var(--panel-white-background-color);
  648. }
  649. #qqmail_mailcontainer .qm_con_fold,
  650. #qqmail_mailcontainer .qm_con_expand {
  651. margin: 0;
  652. }
  653. #qqmail_mailcontainer .toarea {
  654. margin: 0;
  655. padding: 0;
  656. }
  657. #qqmail_mailcontainer #tips_bar ~ div:first-child {
  658. display: none;
  659. }
  660.  
  661. body[module=qmReadMail] {
  662. margin: 0 !important;
  663. padding: 0 !important;
  664. }
  665. body[module=qmReadMail] #qqmail_mailcontainer {
  666. margin-top: 0;
  667. background: var(--panel-gray-background-color);
  668. }
  669. body[module=qmReadMail] #qqmail_mailcontainer > div {
  670. /* Clear z-index */
  671. z-index: unset !important;
  672. }
  673. body[module=qmReadMail] #qqmail_mailcontainer #mainmail {
  674. margin-bottom: 0 !important;
  675. padding-bottom: 10px;
  676. }
  677. body[module=qmReadMail] #qqmail_mailcontainer #mainmail #nextmail_top {
  678. margin: 15px;
  679. }
  680. body[module=qmReadMail] #qqmail_mailcontainer .toolbgline .left {
  681. margin: 10px 5px;
  682. padding: 0 12px;
  683. }
  684. body[module=qmReadMail] #qqmail_mailcontainer .settingtable {
  685. background: var(--panel-white-background-color);
  686. border: 0px;
  687. padding-left: 4px !important;
  688. padding: 4px !important;
  689. }
  690. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo {
  691. background: var(--panel-white-background-color);
  692. border: 1px solid var(--panel-white-border-color);
  693. border-bottom: 0;
  694. margin: 104px 10px 0;
  695. padding: 10px;
  696. }
  697. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo > table {
  698. margin-left: 50px;
  699. }
  700. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo .readmail_subject {
  701. /** Mail Subject */
  702. position: absolute;
  703. top: -59px;
  704. left: 0px;
  705. width: 100%;
  706. height: 24px;
  707. line-height: 24px;
  708. background: var(--panel-gray-background-color);
  709. padding: 17px 12px !important;
  710. margin-left: -11px;
  711. }
  712. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo .readmail_subject #subject {
  713. font-size: 17px;
  714. }
  715. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo > #subjectTip ~ table {
  716. height: auto !important;
  717. }
  718. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 {
  719. /** User Avatar */
  720. position: absolute;
  721. left: 11px;
  722. top: 13px;
  723. padding: 0 !important;
  724. width: 45px;
  725. height: 45px;
  726. overflow: hidden;
  727. }
  728. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 > div {
  729. width: 42px !important;
  730. height: 42px !important;
  731. }
  732. body[module=qmReadMail] #qqmail_mailcontainer .readmailinfo #senderInfo2 > div #qqiconimg {
  733. margin: 0 !important;
  734. }
  735. body[module=qmReadMail] #qqmail_mailcontainer #contentDiv {
  736. /** Mail Content */
  737. background: var(--panel-white-background-color);
  738. border: 1px solid var(--panel-white-border-color);
  739. border-top: 0;
  740. padding: 10px !important;
  741. margin: 0 10px;
  742. overflow: hidden;
  743. /** Fix attachmet style */
  744. }
  745. body[module=qmReadMail] #qqmail_mailcontainer #attachment {
  746. /** Mail Attachment */
  747. margin: 10px 10px 0;
  748. }
  749. body[module=qmReadMail] #qqmail_mailcontainer #pageEnd {
  750. margin: 10px;
  751. background: var(--panel-white-background-color);
  752. border: 1px solid var(--panel-white-border-color);
  753. }
  754.  
  755. body.netdisk_multi {
  756. padding: 0 !important;
  757. }
  758. body.netdisk_multi .readmailinfo {
  759. background: var(--panel-gray-background-color);
  760. width: 100%;
  761. overflow: hidden;
  762. padding-right: 10px;
  763. }
  764. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child {
  765. margin: 0 10px;
  766. display: block;
  767. border: 1px solid transparent;
  768. box-sizing: border-box;
  769. border-bottom-color: var(--panel-white-border-color);
  770. }
  771. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable {
  772. width: 100%;
  773. height: 24px;
  774. line-height: 24px;
  775. background: var(--panel-gray-background-color) !important;
  776. padding: 17px 0px !important;
  777. }
  778. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable > .qm_left {
  779. padding-bottom: 0 !important;
  780. line-height: 17px;
  781. }
  782. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:first-child > td.settingtable > .qm_left .sub_title {
  783. font-size: 17px !important;
  784. }
  785. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) {
  786. display: block;
  787. background: var(--panel-white-background-color);
  788. margin: 0 10px;
  789. padding: 10px 0 0 10px;
  790. border: 1px solid var(--panel-white-border-color) !important;
  791. width: calc(100% - 20px);
  792. border-width: 0 1px !important;
  793. box-sizing: border-box;
  794. }
  795. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) td {
  796. margin: 0 !important;
  797. padding: 0px !important;
  798. }
  799. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow {
  800. margin: 0px;
  801. padding-left: 0;
  802. padding-bottom: 0;
  803. }
  804. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow ~ tr {
  805. padding: 0;
  806. margin: 0;
  807. }
  808. body.netdisk_multi .readmailinfo .rmg_mailinfo > tbody > tr:not(:first-child) #attchshow ~ tr > td {
  809. padding-top: 10px !important;
  810. }
  811. body.netdisk_multi .readmailinfo:not(:first-child) {
  812. border: 0px;
  813. padding: 0 !important;
  814. }
  815. body.netdisk_multi .readmailinfo:not(:first-child) #quickreply {
  816. margin: 0 10px;
  817. background: var(--panel-white-background-color);
  818. border: 1px solid var(--panel-white-border-color);
  819. border-width: 0 1px;
  820. padding: 0 10px;
  821. }
  822.  
  823. #frm[action="/cgi-bin/compose_send"] {
  824. background: var(--panel-gray-background-color);
  825. }
  826. #frm[action="/cgi-bin/compose_send"] #sendtimepadding {
  827. background: var(--panel-white-background-color);
  828. border: 2px solid var(--panel-white-border-color) !important;
  829. margin: 10px;
  830. }
  831. #frm[action="/cgi-bin/compose_send"] #sendtimepadding .div_txt {
  832. border: 0px;
  833. background: transparent;
  834. padding: 0;
  835. height: 39px;
  836. line-height: 39px;
  837. margin: -3px 0 0 0;
  838. }
  839. #frm[action="/cgi-bin/compose_send"] #sendtimepadding .content_title {
  840. padding-top: 0px !important;
  841. }
  842. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightArea {
  843. margin: 0 !important;
  844. border: 1px solid var(--panel-white-border-color);
  845. border-bottom: 0;
  846. }
  847. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp {
  848. border-left: 1px solid var(--panel-white-border-color);
  849. margin-left: -1px !important;
  850. width: 15px !important;
  851. padding-left: 5px;
  852. }
  853. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div {
  854. margin-top: 0 !important;
  855. }
  856. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div > div:first-child {
  857. display: none !important;
  858. }
  859. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div #addrsDiv {
  860. margin-top: -1px;
  861. }
  862. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div table.i {
  863. border: 1px solid #ccc;
  864. margin-top: -1px !important;
  865. margin-bottom: -1px !important;
  866. margin-left: 0px !important;
  867. }
  868. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div table.i td:first-child > div {
  869. padding: 0 !important;
  870. min-width: 62px !important;
  871. margin: 5px;
  872. }
  873. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div table.i td:first-child > div a,
  874. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div table.i td:first-child > div span {
  875. display: inline-block;
  876. padding: 5px 10px !important;
  877. background: var(--btn-secondary-background);
  878. color: var(--btn-secondary-text-color);
  879. margin: 0;
  880. }
  881. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #rightAreaBtnWarp ~ div table.i td [clss=f_family] {
  882. display: none !important;
  883. }
  884. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #addrQzone ~ table.i tr:first-child {
  885. display: none;
  886. }
  887. #frm[action="/cgi-bin/compose_send"] #sendtimepadding .addr_base {
  888. height: 17px;
  889. margin: 1px;
  890. line-height: 16px;
  891. padding: 10px;
  892. }
  893. #frm[action="/cgi-bin/compose_send"] #sendtimepadding .addr_text {
  894. float: none !important;
  895. height: 40px;
  896. margin: 0;
  897. line-height: 40px;
  898. }
  899. #frm[action="/cgi-bin/compose_send"] #sendtimepadding .addr_text input {
  900. height: 39px;
  901. padding: 0;
  902. line-height: 39px;
  903. }
  904. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #addrOper {
  905. padding: 10px;
  906. border: 1px solid var(--panel-white-border-color);
  907. }
  908. #frm[action="/cgi-bin/compose_send"] #sendtimepadding #addrOper .input_title {
  909. margin: 0 0 0 65px;
  910. }
  911. #frm[action="/cgi-bin/compose_send"] #sendtimepadding > .input_title {
  912. padding: 10px 10px 10px 75px !important;
  913. margin: 0;
  914. border-left: 1px solid var(--panel-white-border-color);
  915. }
  916. #frm[action="/cgi-bin/compose_send"] #QMEditorArea {
  917. margin-left: -73px;
  918. margin-top: -2px;
  919. margin-bottom: -2px;
  920. border: 1px solid var(--panel-white-border-color);
  921. border-right: 0;
  922. }
  923.  
  924. .qmEditorBase {
  925. border: 0px;
  926. }
  927.  
  928. .qmEditorIfrmEditArea {
  929. border: 0px;
  930. }
  931.  
  932. .qmEditorContent {
  933. height: unset !important;
  934. }
  935.  
  936. .qmEditorToolBarDiv {
  937. border-bottom: 0px;
  938. }
  939.  
  940. .composetab {
  941. background: var(--panel-white-background-color);
  942. height: 39px;
  943. width: 100%;
  944. display: block;
  945. }
  946. .composetab tr td {
  947. padding: 0 !important;
  948. }
  949. .composetab .composetab_img {
  950. display: none;
  951. }
  952. .composetab .composetab_unsel {
  953. background: var(--panel-white-background-color);
  954. overflow: hidden;
  955. height: 39px;
  956. }
  957. .composetab .composetab_unsel a {
  958. color: var(--panel-text-color);
  959. font-weight: 400;
  960. display: block;
  961. padding: 10px !important;
  962. margin: 0px;
  963. transition: all 0.2s linear 0s;
  964. width: auto;
  965. }
  966. .composetab .composetab_unsel a:hover {
  967. text-decoration: none;
  968. background: var(--btn-hover-background);
  969. }
  970. .composetab .composetab_sel {
  971. background: var(--panel-white-background-color);
  972. height: 39px;
  973. position: relative;
  974. }
  975. .composetab .composetab_sel div {
  976. padding: 10px !important;
  977. margin: 0px;
  978. cursor: pointer;
  979. }
  980. .composetab .composetab_sel div:hover {
  981. background: var(--btn-hover-background);
  982. }
  983. .composetab .composetab_sel:after {
  984. content: "";
  985. display: block;
  986. border-bottom: 5px solid var(--main-color);
  987. position: absolute;
  988. width: 60px;
  989. bottom: 2px;
  990. left: 25px;
  991. transition: all 0.156s linear 0s;
  992. }
  993. .composetab .composetab_sel:hover:after {
  994. width: 70px;
  995. left: 20px;
  996. }
  997.  
  998. #toolbar .toolbg,
  999. #toolbar .toolbg1 {
  1000. background-color: var(--panel-background-color);
  1001. padding: 10px;
  1002. border: 2px solid var(--panel-border-color);
  1003. border-width: 2px 0 0 0;
  1004. }
  1005. #toolbar .toolbg .right,
  1006. #toolbar .toolbg1 .right {
  1007. margin: 0 !important;
  1008. }
  1009. #toolbar .toolbg .btn_space,
  1010. #toolbar .toolbg1 .btn_space {
  1011. height: 22px;
  1012. padding: 5px 10px;
  1013. margin-right: 10px;
  1014. cursor: pointer;
  1015. display: inline-block;
  1016. background-color: var(--btn-background);
  1017. }
  1018. #toolbar .toolbg .btn_space:hover,
  1019. #toolbar .toolbg1 .btn_space:hover {
  1020. background-color: var(--btn-hover-background);
  1021. }
  1022.  
  1023. /* Group Mail */
  1024. body#list #body_list {
  1025. margin-top: 50px;
  1026. }
  1027. body#list .mysidebar {
  1028. top: 39px !important;
  1029. }
  1030.  
  1031. #postop0,
  1032. .toolbgline.barspace4 {
  1033. display: none;
  1034. }
  1035.  
  1036. .settingtable,
  1037. .settingTitle .selected {
  1038. background: var(--panel-white-background-color);
  1039. }
  1040.  
  1041. .toolbgline.h22 {
  1042. /* Save Toolbar */
  1043. bottom: 0;
  1044. top: unset;
  1045. display: flex;
  1046. align-items: center;
  1047. padding-left: 10px;
  1048. border-top: 2px solid var(--toolbar-border-color);
  1049. }
  1050.  
  1051. body[onunload="changeStyle();"] .txt_title,
  1052. body.tbody .txt_title {
  1053. display: none;
  1054. }
  1055. }
  1056. @-moz-document regexp("https?:\\/\\/mail\\.qq\\.com\\/cgi-bin\\/frame_html\\?t=newwin_frame.*") {
  1057. #mainFrameContainer {
  1058. margin: 0;
  1059. top: 0;
  1060. left: 0;
  1061. }
  1062. }
  1063. @-moz-document regexp("https?:\\/\\/mail\\.qq\\.com\\/") {
  1064. body {
  1065. background: var(--login-background);
  1066. background-size: cover;
  1067. margin: 0;
  1068. position: absolute;
  1069. left: 0;
  1070. right: 0;
  1071. top: 0;
  1072. bottom: 0;
  1073. overflow: hidden;
  1074. }
  1075.  
  1076. .header,
  1077. .footer {
  1078. display: none;
  1079. }
  1080.  
  1081. .container {
  1082. position: absolute;
  1083. top: 0;
  1084. right: 0;
  1085. bottom: 0;
  1086. left: 0;
  1087. display: flex;
  1088. justify-content: center;
  1089. align-items: center;
  1090. background-color: rgba(0, 0, 0, 0.3);
  1091. }
  1092.  
  1093. .content_wrapper {
  1094. display: flex;
  1095. justify-content: center;
  1096. align-items: center;
  1097. }
  1098.  
  1099. .login_pictures {
  1100. display: none;
  1101. }
  1102. }
  1103. @-moz-document regexp("https?:\\/\\/mail\\.qq\\.com\\/cgi-bin\\/loginpage.*") {
  1104. body {
  1105. background: var(--login-background);
  1106. background-size: cover;
  1107. margin: 0;
  1108. position: absolute;
  1109. left: 0;
  1110. right: 0;
  1111. top: 0;
  1112. bottom: 0;
  1113. overflow: hidden;
  1114. }
  1115.  
  1116. .header,
  1117. .footer {
  1118. display: none;
  1119. }
  1120.  
  1121. .container {
  1122. height: 100%;
  1123. }
  1124.  
  1125. .content {
  1126. height: 100%;
  1127. display: flex;
  1128. justify-content: center;
  1129. align-items: center;
  1130. }
  1131. .content .logout_info {
  1132. padding: 20px;
  1133. background: rgba(255, 255, 255, 0.75);
  1134. border-radius: 5px !important;
  1135. }
  1136. .content .logout_ad {
  1137. display: none !important;
  1138. }
  1139. }
  1140.  
  1141. /*# sourceMappingURL=flatqqmail.css.map */