Fine tuning Larry styles + browser specific css quirks

pull/1/head
thomascube 13 years ago
parent 0b179e0847
commit 071c78c3a4

@ -121,14 +121,16 @@ function roundcube_browser()
else if (this.konq) else if (this.konq)
classname += ' konqueror'; classname += ' konqueror';
else if (this.safari) else if (this.safari)
classname += ' safari';
if (this.chrome)
classname += ' chrome'; classname += ' chrome';
else if (this.iphone) else if (this.chrome)
classname += ' chrome';
if (this.iphone)
classname += ' iphone'; classname += ' iphone';
else if (this.ipad) else if (this.ipad)
classname += ' ipad'; classname += ' ipad';
else if (this.safari || this.chrome)
classname += ' webkit';
if (document.documentElement) if (document.documentElement)
document.documentElement.className += classname; document.documentElement.className += classname;

@ -1,7 +1,7 @@
/** /**
* Roundcube webmail styles for the Address Book section * Roundcube webmail styles for the Address Book section
* *
* Copyright (c) 2011, The Roundcube Dev Team * Copyright (c) 2012, The Roundcube Dev Team
* Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
* *
* The contents are subject to the Creative Commons Attribution-ShareAlike * The contents are subject to the Creative Commons Attribution-ShareAlike

@ -1,7 +1,7 @@
/** /**
* Roundcube webmail styles for the Email section * Roundcube webmail styles for the Email section
* *
* Copyright (c) 2011, The Roundcube Dev Team * Copyright (c) 2012, The Roundcube Dev Team
* Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
* *
* The contents are subject to the Creative Commons Attribution-ShareAlike * The contents are subject to the Creative Commons Attribution-ShareAlike
@ -324,11 +324,11 @@ a.iconbutton.threadmode.selected {
padding: 2px 3px; padding: 2px 3px;
} }
.chrome #messagelist tr td.attachment, .webkit #messagelist tr td.attachment,
.chrome #messagelist tr td.threads, .webkit #messagelist tr td.threads,
.chrome #messagelist tr td.status, .webkit #messagelist tr td.status,
.chrome #messagelist tr td.flag, .webkit #messagelist tr td.flag,
.chrome #messagelist tr td.priority { .webkit #messagelist tr td.priority {
width: 26px; width: 26px;
} }
@ -336,7 +336,7 @@ a.iconbutton.threadmode.selected {
width: 26px; width: 26px;
} }
.chrome #messagelist tr td.threads { .webkit #messagelist tr td.threads {
width: 30px; width: 30px;
} }
@ -617,7 +617,7 @@ a.iconbutton.threadmode.selected {
#composeheaders { #composeheaders {
position: relative; position: relative;
padding: 3px 0; padding: 3px 0;
background: #fff; background: #f9f9f9;
background: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%); background: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e9e9e9)); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#e9e9e9));
background: -o-linear-gradient(top, #fff 0%, #e9e9e9 100%); background: -o-linear-gradient(top, #fff 0%, #e9e9e9 100%);
@ -711,7 +711,12 @@ h3.subject {
position: relative; position: relative;
color: #666; color: #666;
text-align: center; text-align: center;
background-color: #EBEBEB; background-color: #f9f9f9;
background: -moz-linear-gradient(top, #eaeaea 0%, #e9e9e9 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaeaea), color-stop(100%,#e9e9e9));
background: -o-linear-gradient(top, #eaeaea 0%, #e9e9e9 100%);
background: -ms-linear-gradient(top, #eaeaea 0%, #e9e9e9 100%);
background: linear-gradient(top, #eaeaea 0%, #e9e9e9 100%);
} }
div.more-headers { div.more-headers {
@ -947,6 +952,11 @@ div.message-part blockquote blockquote blockquote {
border-bottom: 4px solid #c7e3ef; border-bottom: 4px solid #c7e3ef;
} }
#compose-contacts .scroller {
top: 65px;
border-top: 1px solid #fff;
}
#contacts-table { #contacts-table {
table-layout: fixed; table-layout: fixed;
} }
@ -966,6 +976,10 @@ div.message-part blockquote blockquote blockquote {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
#contacts-table tr:first-child td {
border-top: 0;
}
#compose-contacts li.addressbook a { #compose-contacts li.addressbook a {
background-position: 6px -766px; background-position: 6px -766px;
} }

@ -1,7 +1,7 @@
/** /**
* Roundcube webmail styles for message printing * Roundcube webmail styles for message printing
* *
* Copyright (c) 2011, The Roundcube Dev Team * Copyright (c) 2012, The Roundcube Dev Team
* *
* The contents are subject to the Creative Commons Attribution-ShareAlike * The contents are subject to the Creative Commons Attribution-ShareAlike
* License. It is allowed to copy, distribute, transmit and to adapt the work * License. It is allowed to copy, distribute, transmit and to adapt the work

@ -1,7 +1,7 @@
/** /**
* Roundcube webmail styles for the Settings section * Roundcube webmail styles for the Settings section
* *
* Copyright (c) 2011, The Roundcube Dev Team * Copyright (c) 2012, The Roundcube Dev Team
* Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
* *
* The contents are subject to the Creative Commons Attribution-ShareAlike * The contents are subject to the Creative Commons Attribution-ShareAlike
@ -184,13 +184,24 @@
bottom: 0; bottom: 0;
} }
#subscription-table {
table-layout: fixed;
}
#subscription-table tr.root td { #subscription-table tr.root td {
font-size: 5%; font-size: 5%;
height: 5px; height: 5px;
padding: 2px; padding: 2px;
} }
#subscription-table td.name {
width: 85%;
overflow: hidden;
text-overflow: ellipsis;
}
#subscription-table td.subscribed { #subscription-table td.subscribed {
min-width: 30px;
padding: 3px 12px 3px 3px; padding: 3px 12px 3px 3px;
text-align: right; text-align: right;
} }
@ -199,8 +210,16 @@
width: 5em; width: 5em;
} }
.webkit #pluginlist td.version {
width: 6em;
}
#pluginlist td.license, #pluginlist td.license,
#pluginlist td.source { #pluginlist td.source {
width: 8em; width: 8em;
} }
.webkit #pluginlist td.license,
.webkit #pluginlist td.source {
width: 9em;
}

@ -1,7 +1,7 @@
/** /**
* Roundcube webmail styles for skin "Larry" * Roundcube webmail styles for skin "Larry"
* *
* Copyright (c) 2011, The Roundcube Dev Team * Copyright (c) 2012, The Roundcube Dev Team
* Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com
* *
* The contents are subject to the Creative Commons Attribution-ShareAlike * The contents are subject to the Creative Commons Attribution-ShareAlike
@ -20,6 +20,11 @@ body {
margin: 0; margin: 0;
} }
body.noscroll {
/* also avoids bounce effect in Chrome and Safari */
overflow: hidden;
}
a { a {
color: #0069a6; color: #0069a6;
} }
@ -238,7 +243,7 @@ input.button:active {
.pagenav.dark a.button { .pagenav.dark a.button {
font-weight: bold; font-weight: bold;
border-color: #e6e6e6; border-color: #e6e6e6;
background: #f7f7f7; background: #d8d8d8;
background: -moz-linear-gradient(top, #d8d8d8 0%, #bababa 100%); background: -moz-linear-gradient(top, #d8d8d8 0%, #bababa 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d8d8d8), color-stop(100%,#bababa)); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d8d8d8), color-stop(100%,#bababa));
background: -o-linear-gradient(top, #d8d8d8 0%, #bababa 100%); background: -o-linear-gradient(top, #d8d8d8 0%, #bababa 100%);
@ -352,6 +357,7 @@ a.iconlink {
display: inline-block; display: inline-block;
color: #888; color: #888;
text-decoration: none; text-decoration: none;
white-space: nowrap;
padding: 2px 8px 2px 20px; padding: 2px 8px 2px 20px;
background: url(images/buttons.png) -1000px 0 no-repeat; background: url(images/buttons.png) -1000px 0 no-repeat;
} }
@ -499,7 +505,7 @@ a.iconlink.upload {
height: 46px; height: 46px;
margin-bottom: 10px; margin-bottom: 10px;
padding: 0 0 0 10px; padding: 0 0 0 10px;
background: #3a3a3a; background: #111;
background: -moz-linear-gradient(top, rgba(64,64,64,1) 0%, rgba(6,6,6,1) 100%); background: -moz-linear-gradient(top, rgba(64,64,64,1) 0%, rgba(6,6,6,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(64,64,64,1)), color-stop(100%,rgba(6,6,6,1))); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(64,64,64,1)), color-stop(100%,rgba(6,6,6,1)));
background: -o-linear-gradient(top, rgba(64,64,64,1) 0%,rgba(6,6,6,1) 100%); background: -o-linear-gradient(top, rgba(64,64,64,1) 0%,rgba(6,6,6,1) 100%);
@ -736,6 +742,11 @@ a.iconlink.upload {
display: table-cell; display: table-cell;
padding-bottom: 5px; padding-bottom: 5px;
height: auto; height: auto;
min-height: 14px;
}
.webkit .listing tbody td {
height: 14px;
} }
.listbox .listitem.selected, .listbox .listitem.selected,
@ -922,7 +933,7 @@ table.records-table {
font-weight: bold; font-weight: bold;
background: #d6eaf3; background: #d6eaf3;
background: -moz-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); background: -moz-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0,#e3f2f6), color-stop(14px,#d6eaf3), color-stop(100%,#d6eaf3)); background: -webkit-gradient(linear, left top, right top, color-stop(0,#e3f2f6), color-stop(8%,#d6eaf3), color-stop(100%,#d6eaf3));
background: -o-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); background: -o-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%);
background: -ms-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px ,#d6eaf3 100%); background: -ms-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px ,#d6eaf3 100%);
background: linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); background: linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%);
@ -1485,6 +1496,10 @@ ul.toolbarmenu li a {
padding: 6px 10px 6px 10px; padding: 6px 10px 6px 10px;
} }
.googie_list td span {
padding: 3px 10px;
}
.googie_list td span, .googie_list td span,
ul.toolbarmenu li a.active { ul.toolbarmenu li a.active {
color: #fff; color: #fff;
@ -1676,16 +1691,18 @@ ul.toolbarmenu li span.conversation {
/* reduce the damage in FF3.0 */ /* reduce the damage in FF3.0 */
display: block; display: block;
width: 0; width: 0;
z-index: 251;
} }
._draglayercopy:before { .draglayercopy:before {
position: absolute; position: absolute;
bottom: -5px; bottom: -6px;
left: -6px; left: -6px;
content: " "; content: " ";
width: 15px; width: 16px;
height: 15px; height: 16px;
background: url(images/buttons.png) -8px -360px no-repeat; background: url(images/buttons.png) -7px -358px no-repeat;
z-index: 255;
} }
@ -1845,7 +1862,7 @@ ul.toolbarmenu li span.conversation {
.tabsbar .tablink.selected a { .tabsbar .tablink.selected a {
color: #004458; color: #004458;
background: #fff; background: #f6f6f6;
background: -moz-linear-gradient(top, #fff 40%, #efefef 100%); background: -moz-linear-gradient(top, #fff 40%, #efefef 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(40%,#fff), color-stop(100%,#efefef)); background: -webkit-gradient(linear, left top, left bottom, color-stop(40%,#fff), color-stop(100%,#efefef));
background: -o-linear-gradient(top, #fff 40%, #efefef 100%); background: -o-linear-gradient(top, #fff 40%, #efefef 100%);

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -5,7 +5,7 @@
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
<link rel="stylesheet" type="text/css" href="/googiespell.css" /> <link rel="stylesheet" type="text/css" href="/googiespell.css" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />
@ -16,8 +16,8 @@
<!-- inline address book --> <!-- inline address book -->
<div id="compose-contacts" class="uibox listbox"> <div id="compose-contacts" class="uibox listbox">
<h2 class="boxtitle"><roundcube:label name="contacts" /></h2> <h2 class="boxtitle"><roundcube:label name="contacts" /></h2>
<div class="scroller withfooter">
<roundcube:object name="adressbooks" id="directorylist" class="listing" /> <roundcube:object name="adressbooks" id="directorylist" class="listing" />
<div class="scroller withfooter">
<roundcube:object name="addresslist" id="contacts-table" class="listing" noheader="true" /> <roundcube:object name="addresslist" id="contacts-table" class="listing" noheader="true" />
</div> </div>
<div class="boxfooter"> <div class="boxfooter">

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -34,5 +34,19 @@
<roundcube:include file="/includes/footer.html" /> <roundcube:include file="/includes/footer.html" />
<roundcube:object name="preloader" images="
/images/ajaxloader.gif
/images/buttons.png
/images/addcontact.png
/images/filetypes.png
/images/listicons.png
/images/messages.png
/images/quota.png
/images/messageicons.png
/images/selector.png
/images/splitter.png
/images/watermark.jpg
" />
</body> </body>
</html> </html>

@ -10,9 +10,8 @@
#mailpreviewframe { display: block; } #mailpreviewframe { display: block; }
<roundcube:endif /> <roundcube:endif />
</style> </style>
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -4,7 +4,7 @@
<title><roundcube:object name="pagetitle" /></title> <title><roundcube:object name="pagetitle" /></title>
<roundcube:include file="/includes/links.html" /> <roundcube:include file="/includes/links.html" />
</head> </head>
<body> <body class="noscroll">
<roundcube:include file="/includes/header.html" /> <roundcube:include file="/includes/header.html" />

@ -82,7 +82,7 @@ function rcube_mail_ui()
$('#previewheaderstoggle').click(function(e){ toggle_preview_headers(this); return false }); $('#previewheaderstoggle').click(function(e){ toggle_preview_headers(this); return false });
} }
else if (rcmail.env.action == 'compose') { else if (rcmail.env.action == 'compose') {
rcmail.addEventListener('aftertoggle-editor', function(){ window.setTimeout(function(){ layout_composeview() }, 100); }); rcmail.addEventListener('aftertoggle-editor', function(){ window.setTimeout(function(){ layout_composeview() }, 200); });
rcmail.addEventListener('aftersend-attachment', show_uploadform); rcmail.addEventListener('aftersend-attachment', show_uploadform);
rcmail.addEventListener('add-recipient', function(p){ show_header_row(p.field, true); }); rcmail.addEventListener('add-recipient', function(p){ show_header_row(p.field, true); });
layout_composeview(); layout_composeview();
@ -95,7 +95,7 @@ function rcube_mail_ui()
}).css('cursor', 'pointer'); }).css('cursor', 'pointer');
new rcube_splitter({ id:'composesplitterv', p1:'#composeview-left', p2:'#composeview-right', new rcube_splitter({ id:'composesplitterv', p1:'#composeview-left', p2:'#composeview-right',
orientation:'v', relative:true, start:248, min:170, size:12 }).init(); orientation:'v', relative:true, start:248, min:170, size:12, render:layout_composeview }).init();
} }
else if (rcmail.env.action == 'list' || !rcmail.env.action) { else if (rcmail.env.action == 'list' || !rcmail.env.action) {
mailviewsplit = new rcube_splitter({ id:'mailviewsplitter', p1:'#mailview-top', p2:'#mailview-bottom', mailviewsplit = new rcube_splitter({ id:'mailviewsplitter', p1:'#mailview-top', p2:'#mailview-bottom',
@ -271,22 +271,26 @@ function rcube_mail_ui()
function layout_composeview() function layout_composeview()
{ {
var body = $('#composebody'), var body = $('#composebody'),
form = $('#compose-content'),
bottom = $('#composeview-bottom'), bottom = $('#composeview-bottom'),
w, h; w, h;
bottom.css('height', (bottom.parent().height() - bottom.position().top) + 'px'); bottom.css('height', (form.height() - bottom.position().top) + 'px');
w = body.parent().width() - 8; w = body.parent().width() - 6;
h = body.parent().height() - 36; h = body.parent().height() - 36;
body.width(w).height(h); body.width(w).height(h);
if (window.tinyMCE && tinyMCE.get('composebody')) { if (window.tinyMCE && tinyMCE.get('composebody')) {
$('#composebody_tbl').width((w+12)+'px').height('').css('margin-top', '1px'); $('#composebody_tbl').width((w+10)+'px').height('').css('margin-top', '1px');
$('#composebody_ifr').width((w+12)+'px').height((h-22)+'px'); $('#composebody_ifr').width((w+10)+'px').height((h-22)+'px');
} }
else { else {
$('#googie_edit_layer').height(h+'px'); $('#googie_edit_layer').height(h+'px');
} }
var abooks = $('#directorylist');
$('#compose-contacts .scroller').css('top', abooks.position().top + abooks.outerHeight());
} }

Loading…
Cancel
Save