From 6c4c5b1975d2b4fd5a6e8a40b3e90a4a14a2c322 Mon Sep 17 00:00:00 2001 From: alecpl <alec@alec.pl> Date: Mon, 14 Sep 2009 08:25:40 -0400 Subject: [PATCH] - small css improvement --- skins/default/mail.css | 279 ++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 223 insertions(+), 56 deletions(-) diff --git a/skins/default/mail.css b/skins/default/mail.css index 84d4395..a095fd1 100644 --- a/skins/default/mail.css +++ b/skins/default/mail.css @@ -5,17 +5,131 @@ { position: absolute; top: 47px; - left: 200px; - right: 200px; + left: 205px; + right: 10px; height: 35px; + min-width: 650px; white-space: nowrap; /* border: 1px solid #cccccc; */ } -#messagetoolbar a +#messagetoolbar > a { + display: block; + float: left; padding-right: 10px; } + +#messagetoolbar a.button, +#messagetoolbar a.buttonPas { + display: block; + float: left; + width: 32px; + height: 32px; + padding: 0; + margin-right: 10px; + overflow: hidden; + background: url('images/mail_toolbar.png') 0 0 no-repeat transparent; + opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */ +} + +#messagetoolbar a.buttonPas { + opacity: 0.35; +} + +#messagetoolbar a.checkmailSel { + background-position: 0 -32px; +} + +#messagetoolbar a.back { + background-position: -32px 0; +} + +#messagetoolbar a.backSel { + background-position: -32px -32px; +} + +#messagetoolbar a.compose { + background-position: -64px 0; +} + +#messagetoolbar a.composeSel { + background-position: -64px -32px; +} + +#messagetoolbar a.reply { + background-position: -96px 0; +} + +#messagetoolbar a.replySel { + background-position: -96px -32px; +} + +#messagetoolbar a.replyAll { + background-position: -128px 0; +} + +#messagetoolbar a.replyAllSel { + background-position: -128px -32px; +} + +#messagetoolbar a.forward { + background-position: -160px 0; +} + +#messagetoolbar a.forwardSel { + background-position: -160px -32px; +} + +#messagetoolbar a.delete { + background-position: -192px 0; +} + +#messagetoolbar a.deleteSel { + background-position: -192px -32px; +} + +#messagetoolbar a.markmessage { + background-position: -256px 0; +} + +#messagetoolbar a.messagemenu { + width: 36px; + background-position: -288px 0; +} + +#messagetoolbar a.spellcheck { + background-position: -386px 0; +} + +#messagetoolbar a.spellcheckSel { + background-position: -386px -32px; +} + +#messagetoolbar a.attach { + background-position: -354px 0; +} + +#messagetoolbar a.attachSel { + background-position: -354px -32px; +} + +#messagetoolbar a.savedraft { + background-position: -322px 0; +} + +#messagetoolbar a.savedraftSel { + background-position: -322px -32px; +} + +#messagetoolbar a.send { + background-position: -418px 0; +} + +#messagetoolbar a.sendSel { + background-position: -418px -32px; +} + #messagetoolbar select, #compose-container select @@ -28,8 +142,9 @@ #messagetoolbar select.mboxlist { - position: absolute; - top: 8px; + position: relative; + margin: 0 8px; + top: 6px; } #messagetoolbar select.mboxlist option @@ -136,6 +251,7 @@ #messagemenu li a { background: url('images/messageactions.png') no-repeat 1px 0; + background-position: 0px 20px; } #messagemenu li a.printlink @@ -156,6 +272,11 @@ #messagemenu li a.openlink { background-position: 1px -53px; +} + +#messagemenu li a.editlink +{ + background-position: 1px -71px; } #markmessagemenu a.readlink @@ -180,10 +301,10 @@ #searchfilter { + white-space: nowrap; position: absolute; - right: 18px; - top: 8px; - text-align: right; + right: 190px; + vertical-align: middle; } #searchfilter label @@ -223,8 +344,7 @@ text-decoration: underline; } -#listcontrols, -#mailboxcontrols +#listcontrols { padding-right: 2em; } @@ -232,10 +352,10 @@ #messagecountbar { position: absolute; - bottom: 16px; - right: 20px; + bottom: 0px; + right: 0px; width: 300px; - height: 20px; + height: 16px; text-align: right; white-space: nowrap; } @@ -246,13 +366,22 @@ color: #333333; } -#mainscreen +#mainscreen { position: absolute; top: 85px; right: 20px; - bottom: 40px; + bottom: 16px; left: 20px; +} + +#mailleftcontainer +{ + position: absolute; + top: 0px; + left: 0px; + bottom: 0px; + width: 195px; } #mailrightcontainer @@ -262,6 +391,15 @@ left: 170px; bottom: 0px; right: 0px; +} + +#mailrightcontent +{ + position: absolute; + top: 0px; + left: 0px; + right: 0px; + bottom: 20px; } #messagepartcontainer @@ -282,6 +420,8 @@ border: 1px solid #999999; background-color: #F9F9F9; overflow: auto; + overflow-y: auto; + overflow-x: hidden; } #mailpreviewframe @@ -358,8 +498,8 @@ position: absolute; top: 0px; left: 0px; - width: 160px; - bottom: 0px; + width: 100%; + bottom: 20px; border: 1px solid #999; background-color: #F9F9F9; overflow: auto; @@ -489,14 +629,13 @@ font-weight: normal; } - #mailfooter { position: absolute; - left: 20px; - right: 20px; - bottom: 18px; - height: 20px; + left: 0px; + bottom: 0px; + height: 16px; + width: 100%; } #mailfooter table tr td @@ -505,13 +644,35 @@ vertical-align: bottom; } -#mailboxcontrols, +#mailboxcontrols +{ + position: absolute; + left: 0px; + bottom: 0px; + height: 16px; + width: auto; + font-size: 11px; +} + #listcontrols, #countcontrols, #quotabox { white-space: nowrap; font-size: 11px; +} + +#countcontrols +{ + min-width: 25em; +} + +#countcontrols a.button, +#countcontrols a.buttonPas, +#messagecountbar a.button, +#messagecountbar a.buttonPas +{ + float: right; } @@ -532,7 +693,7 @@ #messagelist thead tr td { - height: 20px; + height: 19px; padding-top: 0px; padding-bottom: 0px; padding-left: 2px; @@ -579,6 +740,7 @@ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; + -o-text-overflow: ellipsis; border-bottom: 1px solid #EBEBEB; cursor: default; } @@ -603,10 +765,18 @@ vertical-align: middle; } -#messagelist tr td.icon, -#messagelist tr td.flag +#messagelist thead tr td.icon, +#messagelist thead tr td.flag { - width: 16px; + width: 22px; + padding: 0; + text-align: center; +} + +#messagelist tbody tr td.icon, +#messagelist tbody tr td.flag +{ + padding: 2px 3px 2px 3px; vertical-align: middle; cursor: pointer; } @@ -621,6 +791,7 @@ { overflow: hidden; vertical-align: middle; + width: 99%; } #messagelist tr td.size @@ -700,13 +871,6 @@ color: #CCCCCC; } -/* safari hacks \*/ -html>body*#messagelist[id$="messagelist"]:not([class="none"]) { width: 99.8%; } -html>body*#messagelist[id$="messagelist"]:not([class="none"]) tr td.flag, -html>body*#messagelist[id$="messagelist"]:not([class="none"]) tr td.icon { width: 20px; } -html>body*input[type$="file"]:not([class="none"]) { background-color: transparent; border: 0; } -/**/ - #quotadisplay { color: #666666; @@ -727,12 +891,13 @@ { position: absolute; top: 0px; - left: 170px; + left: 180px; right: 0px; - bottom: 0px; + bottom: 20px; border: 1px solid #999; background-color: #FFF; overflow: auto; + z-index: 1; } #printmessageframe @@ -801,8 +966,17 @@ color: #666666; text-align: left; padding-right: 10px; - vertical-align: center; text-align: center; + padding: 2px 6px 4px 6px; + border-bottom: 0; +} + +table.headers-table tr td.more-headers +{ + cursor: pointer; + width: 100%; + height: 8px; + border-bottom: 0; } #attachment-list @@ -877,10 +1051,13 @@ padding: 0px; font-family: monospace; white-space: -moz-pre-wrap !important; - white-space: -o-pre-wrap !important; white-space: pre-wrap !important; white-space: pre; - word-wrap: break-word; /* IE (and Safari) */ +} + +div.message-part span.sig +{ + color: #666666; } div.message-part blockquote @@ -964,7 +1141,7 @@ { position: absolute; top: 90px; - left: 190px; + left: 205px; right: 25px; bottom: 30px; margin: 0px; @@ -1044,7 +1221,7 @@ position: absolute; top: 100px; left: 20px; - width: 160px; + width: 170px; } #compose-attachments ul @@ -1077,8 +1254,12 @@ #attachment-title { + color: #666666; + font-weight: bold; + font-size: 11px; background: url(images/icons/attachment.png) top left no-repeat; - padding: 0px 0px 3px 22px; + padding: 0px 0px 3px 18px; + margin-left: 3px; } #attachment-form @@ -1101,20 +1282,6 @@ #attachment-form div.buttons { margin-top: 4px; -} - -table.headers-table tr td.more-headers -{ - cursor: pointer; - width: 100%; - height: 8px; - border-bottom: 0; -} - -table.headers-table tr td.all -{ - padding: 2px 6px 4px 6px; - border-bottom: 0; } td.show-headers -- Gitblit v1.9.1