From a3644638aaf0418598196a870204e0b632a4c8ad Mon Sep 17 00:00:00 2001 From: Thomas Bruederli <thomas@roundcube.net> Date: Fri, 17 Apr 2015 06:28:40 -0400 Subject: [PATCH] Allow preference sections to define CSS class names --- skins/classic/common.css | 349 ++++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 253 insertions(+), 96 deletions(-) diff --git a/skins/classic/common.css b/skins/classic/common.css index ddcf53a..6d5a333 100644 --- a/skins/classic/common.css +++ b/skins/classic/common.css @@ -20,10 +20,14 @@ margin: 10px; } -select, input, textarea +select, input, textarea, button { - font-size: 12px; + font-size: inherit; font-family: inherit; +} + +html.mozilla select { + padding: 2px 1px; } th @@ -152,6 +156,11 @@ color: #999999; } +.voice +{ + display: none; +} + /* fixes vertical alignment of checkboxes and labels */ label input, label span @@ -251,6 +260,7 @@ body > #message div.notice, body > #messagebody .part-notice, +body > #mainscreen #messagebody .part-notice, #message-objects div.notice { background: url(images/display/icons.png) 6px 3px no-repeat; @@ -277,11 +287,19 @@ } body > #message div.loading, +body > #message div.uploading, #message-objects div.loading { background: url(images/display/loading.gif) 6px 3px no-repeat; background-color: #EBEBEB; border: 1px solid #CCCCCC; +} + +body > #message div.voice +{ + position: absolute; + top: -1000px; + clip: rect(0 0 0 0); } body > #message a @@ -606,9 +624,13 @@ height: 16px; } +.popup label > input { + margin-left: 10px; +} /***** common table settings ******/ +table.records-table thead tr th, table.records-table thead tr td { height: 20px; @@ -619,6 +641,7 @@ background: url(images/listheader.gif) top left repeat-x #CCC; font-size: 11px; font-weight: bold; + text-align: left; } table.records-table tbody tr td @@ -629,7 +652,8 @@ white-space: nowrap; border-bottom: 1px solid #EBEBEB; overflow: hidden; - text-align: left; + text-align: left; + outline: none; } table.records-table tr @@ -661,18 +685,21 @@ ul.treelist li div.treetoggle { position: absolute; - left: 8px !important; - left: -16px; - top: 1px; + left: 8px; + top: 2px; width: 14px; height: 16px; cursor: pointer; } -ul.treelist li ul li div.treetoggle +ul.treelist ul li div.treetoggle { - left: 28px !important; - left: 4px; + left: 25px; +} + +ul.treelist ul ul li div.treetoggle +{ + left: 42px; } ul.treelist li div.collapsed @@ -684,7 +711,6 @@ { background: url(images/icons/expanded.png) bottom right no-repeat; } - ul.treelist, ul.treelist li ul @@ -706,6 +732,7 @@ font-size: 11px; border-bottom: 1px solid #EBEBEB; white-space: nowrap; + overflow: hidden; } ul.treelist li a @@ -716,6 +743,7 @@ padding-top: 2px; padding-bottom: 2px; height: 16px; + line-height: 16px; text-decoration: none; white-space: nowrap; } @@ -735,7 +763,8 @@ border-bottom: 0; } -ul.treelist li.selected > a +ul.treelist li.selected > a, +ul.treelist li.selected > div a { color: #FFF; font-weight: bold; @@ -745,6 +774,154 @@ ul.treelist li.droptarget { background-color: #FFFFA6; +} + +/***** folders list *****/ + +.folderlist li ul li:last-child +{ + border-bottom: 0 none; +} + +.folderlist li.inbox a +{ + background-position: 5px -18px; +} + +.folderlist li.drafts a +{ + background-position: 5px -36px; +} + +.folderlist li.sent a +{ + background-position: 5px -53px; +} + +.folderlist li.junk a +{ + background-position: 5px -72px; +} + +.folderlist li.trash a +{ + background-position: 5px -180px; +} + +.folderlist li.trash.empty a +{ + background-position: 5px -90px; +} + +.folderlist li a +{ + cursor: default; + display: block; + position: relative; + padding-left: 25px; + padding-top: 2px; + padding-bottom: 2px; + text-decoration: none; + height: 15px; + background: url(images/icons/folders.png) 5px 1px no-repeat; +} + +.folderlist li.virtual > a +{ + color: #666; +} + +.folderlist li.selected, +.folderlist li.droptarget li.selected +{ + background-color: #929292; +} + +.folderlist li.selected > a, +.folderlist li.droptarget li.selected a +{ + color: #FFF; + font-weight: bold; +} + +.folderlist li.droptarget +{ + background-color: #FFFFA6; +} + +/* styles for nested folders */ +.folderlist ul { + list-style: none; + padding: 0; + margin: 0; + border-top: 1px solid #EBEBEB; + background-color: #FFF; + font-weight: normal; +} + +.folderlist li.mailbox ul li a { + padding-left: 40px; /* 24 + 1 x 16 */ + background-position: 20px 1px; /* 4 + 1 x 16 */ +} +.folderlist li.mailbox ul li div.treetoggle { + left: 23px !important; +} + +.folderlist li.mailbox ul ul li.mailbox a { + padding-left: 56px; /* 2x */ + background-position: 36px 1px; +} +.folderlist li.mailbox ul ul li div.treetoggle { + left: 39px !important; +} + +.folderlist li.mailbox ul ul ul li.mailbox a { + padding-left: 72px; /* 3x */ + background-position: 52px 1px; +} +.folderlist li.mailbox ul ul ul li div.treetoggle { + left: 55px !important; +} + +.folderlist li.mailbox ul ul ul ul li.mailbox a { + padding-left: 88px; /* 4x */ + background-position: 68px 1px; +} +.folderlist li.mailbox ul ul ul ul li div.treetoggle { + left: 71px !important; +} + +/* indent folders on levels > 4 */ +.folderlist li.mailbox ul ul ul ul ul li { + padding-left: 16px; +} +.folderlist li.mailbox ul ul ul ul ul li div.treetoggle { + left: 87px !important; +} + +.folderlist li.mailbox ul li.drafts a +{ + background-position: 21px -36px; +} + +.folderlist li.mailbox ul li.sent a +{ + background-position: 21px -53px; +} + +.folderlist li.mailbox ul li.junk a +{ + background-position: 21px -72px; +} + +.folderlist li.mailbox ul li.trash a +{ + background-position: 21px -180px; +} + +.folderlist li.mailbox ul li.trash.empty a +{ + background-position: 21px -90px; } @@ -841,6 +1018,25 @@ width: 97%; } +.listsearchbox +{ + border-bottom: solid 1px #ddd; + padding: 2px 4px 1px; + display: none; + background-color: #f2f2f2; +} + +.listsearchbox a.iconbutton.reset +{ + background: url(images/icons/reset.gif) no-repeat 0 0; + width: 13px; + height: 13px; + text-indent: 50000px; + position: absolute; + top: 3px; + left: 165px; + overflow: hidden; +} /***** roundcube webmail pre-defined classes *****/ @@ -1072,6 +1268,17 @@ margin: 1px 4px 1px; } +#searchmenu ul.toolbarmenu li label +{ + padding: 2px 0; + color: black; +} + +#searchmenu ul.toolbarmenu li label.comment +{ + color: #999; +} + /*** folder selector ***/ @@ -1222,6 +1429,35 @@ .quota_text_mid { color: #666; } .quota_text_low { color: #666; } +table.quota-info { + border-spacing: 0; + border-collapse: collapse; + table-layout: fixed; + margin: 2px; +} + +table.quota-info td, +table.quota-info th { + border: 1px solid #999; + padding: 2px 3px; + text-align: center; + min-width: 80px; + color: #333; + font-size: 11px; +} + +table.quota-info th { + font-weight: bold; + background-color: #ddd; +} + +table.quota-info td.name { + text-align: left; +} + +table.quota-info td.root { + font-style: italic; +} /********** TinyMCE styles **********/ .mce-btn-small button @@ -1240,89 +1476,18 @@ padding: 6px 8px !important; } -.mce-tinymce, +.mce-tinymce +{ + border-radius: 0 !important; +{ + .mce-panel.mce-toolbar-grp { border: 0 !important; } -#image-selector-list -{ - position: absolute; - top: 0; - left: 0; - right: 152px; - height: 100%; - overflow-x: hidden; - overflow-y: auto; -} - -#image-selector-form -{ - position: absolute; - top: 0; - bottom: 0; - right: 0; - width: 150px; - border: 0; - border: 1px solid #FFF; - border-left: 1px solid #DDD; +#image-selector-form.droptarget { background: url(images/filedrop.png) center bottom no-repeat; - text-align: center; - padding-top: 10px; -} - -#image-upload-button -{ - width: 80%; - height: 30px; -} - -#image-upload-button span -{ - position: absolute; - width: 100%; - text-align: center; - line-height: 30px; -} - -#image-selector-list li -{ - line-height: 80px; - padding: 2px 0 2px 3px; - cursor: pointer; - overflow: hidden; - text-overflow: ellipsis; -} - -#image-selector-list li:hover -{ - background-color: #F0F0F0; -} - -#image-selector-list ul li img -{ - vertical-align: middle; - max-height: 80px; -} - -#image-selector-list ul li span.name -{ - vertical-align: middle; - font-weight: bold; - padding-left: 10px; - line-height: 80px; - vertical-align: middle; -} - -#image-selector-list ul li span.img -{ - width: 80px; - text-align: center; - display: inline-block; - overflow: hidden; - line-height: 80px; - vertical-align: middle; } #image-selector-form.droptarget.hover @@ -1331,12 +1496,4 @@ box-shadow: 0 0 5px 0 #999; -moz-box-shadow: 0 0 5px 0 #999; -o-box-shadow: 0 0 5px 0 #999; -} - -div.mce-abs-end div.hint -{ - line-height: 50px; - padding-left: 10px; - color: #999; - text-shadow: 0 1px 1px #FFF; } -- Gitblit v1.9.1