From be72a0f931373fcb4cbb3203307f4460e9759592 Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Thu, 28 Jun 2012 19:37:54 +0200 Subject: Better style for preview header toggle --- skins/larry/iehacks.css | 4 +++ skins/larry/mail.css | 54 ++++++++++++++++++++----------- skins/larry/svggradient.php | 3 +- skins/larry/svggradients.css | 4 +++ skins/larry/templates/messagepreview.html | 2 +- 5 files changed, 46 insertions(+), 21 deletions(-) (limited to 'skins/larry') diff --git a/skins/larry/iehacks.css b/skins/larry/iehacks.css index 38d68acdd..9d0d782f9 100644 --- a/skins/larry/iehacks.css +++ b/skins/larry/iehacks.css @@ -143,6 +143,10 @@ ul.toolbarmenu li a.active:hover, filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e9e9e9', GradientType=0); } +#previewheaderstoggle { + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbfbfb', endColorstr='#e9e9e9', GradientType=1); +} + #composeoptionsbox { border-top: 1px solid #999; } diff --git a/skins/larry/mail.css b/skins/larry/mail.css index 4d53d9290..ff389fa27 100644 --- a/skins/larry/mail.css +++ b/skins/larry/mail.css @@ -715,29 +715,47 @@ h3.subject { display: none; } +#preview-allheaders td.header-title, #preview-shortheaders td.header-title { - padding-right: 0; + padding-left: 0; } #preview-shortheaders td.header { - padding-right: 12px; + padding-right: 18px; } #previewheaderstoggle { - width: 16px; - height: 16px; - padding: 0; - margin-top: 5px; - position: absolute; - outline: none; + display: block; + position: absolute; + top: 0; + left: 0; + bottom: 0; + width: 18px; + padding: 0; + outline: none; + background: #f2f2f2; + background: -moz-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); + background: -webkit-gradient(linear, left top, right top, color-stop(0,#fbfbfb), color-stop(100%,#e9e9e9)); + background: -o-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); + background: -ms-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); + background: linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); + border-right: 1px solid #dfdfdf; } -#previewheaderstoggle.iconlink.add { - background-position: -32px -227px; +#previewheaderstoggle .iconlink { + display: inline-block; + position: absolute; + top: 8px; + left: 0; + width: 18px; + height: 16px; + background: url(images/buttons.png) -27px -242px no-repeat; } -#previewheaderstoggle.iconlink.remove { - background-position: -32px -242px; +#previewheaderstoggle.remove .iconlink { + top: auto; + bottom: 5px; + background-position: -5px -242px; } div.more-headers { @@ -774,17 +792,15 @@ div.hide-headers { } #messagepreviewheader { - margin: 0 8px; - padding-bottom: 8px; + position: relative; + height: auto; + margin: 0 8px 0 0; + padding: 0 0 6px 26px; border-bottom: 2px solid #f0f0f0; } -#messagepreviewheader .headers-table { - margin-left: 8px; -} - #messagepreviewheader h3.subject { - padding-left: 0; + padding: 8px 8px 2px 0; } #messagepreviewheader #countcontrols, diff --git a/skins/larry/svggradient.php b/skins/larry/svggradient.php index 75705ed30..c54bdec17 100644 --- a/skins/larry/svggradient.php +++ b/skins/larry/svggradient.php @@ -18,6 +18,7 @@ header("Pragma: "); $svg_stops = ''; $color_stops = explode(';', preg_replace('/[^a-f0-9,;%]/i', '', $_GET['c'])); +$gradient_coords = !empty($_GET['h']) ? 'x1="0%" y1="0%" x2="100%" y2="0%"' : 'x1="0%" y1="0%" x2="0%" y2="100%"'; $last = count($color_stops) - 1; foreach ($color_stops as $i => $stop) { list($color, $offset) = explode(',', $stop); @@ -32,7 +33,7 @@ foreach ($color_stops as $i => $stop) { ?> - + spreadMethod="pad"> diff --git a/skins/larry/svggradients.css b/skins/larry/svggradients.css index ba596e39f..7e64bed14 100644 --- a/skins/larry/svggradients.css +++ b/skins/larry/svggradients.css @@ -137,6 +137,10 @@ ul.toolbarmenu li a.active:hover, background-image: url(svggradient.php?c=ffffff;e9e9e9); } +#previewheaderstoggle { + background-image: url(svggradient.php?c=fbfbfb;e9e9e9&h=1); +} + /*** jqueryui theme ***/ diff --git a/skins/larry/templates/messagepreview.html b/skins/larry/templates/messagepreview.html index cd9c2349a..fbca9715d 100644 --- a/skins/larry/templates/messagepreview.html +++ b/skins/larry/templates/messagepreview.html @@ -9,7 +9,7 @@

- + -- cgit v1.2.3