skins/larry/ie7hacks.css | ●●●●● patch | view | raw | blame | history | |
skins/larry/images/buttons.png | patch | view | raw | blame | history | |
skins/larry/includes/header.html | ●●●●● patch | view | raw | blame | history | |
skins/larry/styles.css | ●●●●● patch | view | raw | blame | history | |
skins/larry/ui.js | ●●●●● patch | view | raw | blame | history |
skins/larry/ie7hacks.css
@@ -17,6 +17,14 @@ height: expression((parseInt(document.documentElement.clientHeight)-150)+'px'); } .minimal #mainscreen { height: expression((parseInt(document.documentElement.clientHeight)-82)+'px'); } .minimal #mainscreen.offset { height: expression((parseInt(document.documentElement.clientHeight)-120)+'px'); } input.button { display: inline; font-size: 90%; @@ -29,7 +37,8 @@ .boxfooter .listbutton .inner, .attachmentslist li a.delete, .attachmentslist li a.cancelupload, .previewheader .iconlink { .previewheader .iconlink, .minimal #taskbar .button-inner { /* workaround for text-indent which also offsets the background image */ text-indent: 0; font-size: 0; @@ -183,3 +192,16 @@ padding: 0 1px 0 0; } .minimal #topline { width: 100%; height: 18px; box-sizing: border-box; } .minimal #taskbar a:hover .tooltip { right: 34px; top: 1px; } skins/larry/images/buttons.pngskins/larry/includes/header.html
@@ -26,6 +26,8 @@ <roundcube:button command="addressbook" label="addressbook" class="button-addressbook" classSel="button-addressbook button-selected" innerClass="button-inner" /> <roundcube:container name="taskbar" id="taskbar" /> <roundcube:button command="settings" label="settings" class="button-settings" classSel="button-settings button-selected" innerClass="button-inner" /> <roundcube:button command="logout" label="logout" class="button-logout" classSel="button-logout" innerClass="button-inner" /> <span class="minmodetoggle"></span> </div> <roundcube:object name="logo" src="/images/roundcube_logo.png" id="toplogo" border="0" alt="Logo" onclick="rcmail.command('switch-task','mail');return false;" /> </div> skins/larry/styles.css
@@ -570,8 +570,138 @@ color: #fff; } #taskbar .button-logout { display: none; } #taskbar a.button-logout span.button-inner { background-position: -2px -1791px; } #taskbar a.button-logout:hover span.button-inner { background-position: -2px -1829px; } /*** minimal version of the page header ***/ .minimal #topline { position: fixed; top: -18px; background: #444; z-index: 5000; width: 100%; height: 22px; -moz-box-sizing: border-box; box-sizing: border-box; } .minimal #topline:hover { top: 0px; opacity: 0.94; filter: alpha(opacity=94); -webkit-transition: top 0.3s ease-in-out; -moz-transition: top 0.3s ease-in-out; -o-transition: top 0.3s ease-in-out; transition: top 0.3s ease-in-out; } .minimal #topline a.button-logout { display: none; } .minimal #topline span.username { display: inline-block; padding-top: 2px; } .minimal #topnav { position: relative; top: 4px; height: 42px; } .minimal #taskbar { height: ; } .minimal #taskbar a { position: relative; padding: 10px 10px 0 6px; height: 32px; } .minimal #taskbar .button-logout { display: inline-block; } .minimal #taskbar .button-inner { top: -4px; padding: 0; height: 24px !important; width: 27px; text-indent: -5000px; } #taskbar .tooltip { display: none; } .minimal #taskbar .tooltip { position: absolute; top: -500px; right: 2px; display: inline-block; padding: 2px 8px 3px 8px; background: #444; background: -moz-linear-gradient(top, #444 0%, #333 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444), color-stop(100%,#333)); background: -o-linear-gradient(top, #444 0%, #333 100%); background: -ms-linear-gradient(top, #444 0%, #333 100%); background: linear-gradient(top, #444 0%, #333 100%); color: #eee; font-weight: bold; white-space: nowrap; border: 1px solid #777; box-shadow: 0 1px 5px 0 #333; -moz-box-shadow: 0 1px 5px 0 #333; -webkit-box-shadow: 0 1px 5px 0 #333; -o-box-shadow: 0 1px 5px 0 #333; z-index: 200; white-space: nowrap; text-shadow: 0px 1px 1px #000; } .minimal #taskbar .tooltip:after { content: ""; position: absolute; top: -4px; right: 15px; border-style: solid; border-width: 0 4px 4px; border-color: #888 transparent; /* reduce the damage in FF3.0 */ display: block; width: 0; z-index: 251; } .ie8 .minimal #taskbar .tooltip:after { top: -6px; } .minimal #taskbar a:hover .tooltip { display: block; top: 39px; } /*** taskbar ***/ #taskbar { position: relative; padding-right: 18px; } #taskbar a { display: inline-block; @@ -630,6 +760,22 @@ background-position: 0 -168px; } #taskbar .minmodetoggle { position: absolute; top: 0; right: 0; display: block; width: 19px; height: 46px; cursor: pointer; background: url(images/buttons.png) -35px -1778px no-repeat; } .minimal #taskbar .minmodetoggle { height: 42px; background-position: -35px -1820px; } #mainscreen { position: absolute; top: 88px; @@ -643,13 +789,21 @@ } #mainscreen.offset { top: 130px; top: 132px; } #mainscreen .offset { margin-top: 42px; } .minimal #mainscreen { top: 62px; } .minimal #mainscreen.offset { top: 102px; } .uibox { border: 1px solid #a3a3a3; border-radius: 4px; skins/larry/ui.js
@@ -43,6 +43,15 @@ this.hide_header_row = hide_header_row; // set minimal mode on small screens (don't wait for document.ready) if (window.$ && document.body) { var minmode = rcmail.get_cookie('minimalmode'); if (parseInt(minmode) || (minmode === null && $(window).height() < 850)) { $(document.body).addClass('minimal'); } } /** * */ @@ -59,6 +68,17 @@ { rcmail.addEventListener('message', message_displayed); /*** prepare minmode functions ***/ $('#taskbar a').each(function(i,elem){ $(elem).append('<span class="tooltip">' + $('.button-inner', this).html() + '</span>') }); $('#taskbar .minmodetoggle').click(function(e){ var ismin = $(document.body).toggleClass('minimal').hasClass('minimal'); rcmail.set_cookie('minimalmode', ismin?1:0); $(window).resize(); }); /*** mail task ***/ if (rcmail.env.task == 'mail') { rcmail.addEventListener('menu-open', show_listoptions);