From b1f4b2cb5d369755ac9a3bc4cfe9a13e0e7d7eb4 Mon Sep 17 00:00:00 2001 From: Hadi Nategh Date: Fri, 24 May 2019 16:11:30 +0200 Subject: [PATCH] WIP framework new style --- api/js/framework/fw_desktop.js | 7 +- api/src/Framework.php | 56 ++- api/src/Framework/Ajax.php | 24 +- pixelegg/css/mobile.css | 447 +++++++----------- pixelegg/css/monochrome.css | 447 +++++++----------- pixelegg/css/pixelegg.css | 479 ++++++++------------ pixelegg/css/pixelegg.less | 32 +- pixelegg/head.tpl | 26 +- pixelegg/js/fw_pixelegg.js | 7 +- pixelegg/less/layout_messages.less | 3 - pixelegg/less/layout_raster_buttons.less | 219 +++------ pixelegg/less/layout_raster_header.less | 77 +++- pixelegg/less/layout_raster_main.less | 226 ++++----- pixelegg/less/layout_raster_scrollarea.less | 1 - pixelegg/less/layout_raster_sidebar.less | 115 ++--- pixelegg/mobile/fw_mobile.css | 447 +++++++----------- 16 files changed, 1071 insertions(+), 1542 deletions(-) diff --git a/api/js/framework/fw_desktop.js b/api/js/framework/fw_desktop.js index cc3074bad4..6034f778a5 100644 --- a/api/js/framework/fw_desktop.js +++ b/api/js/framework/fw_desktop.js @@ -188,7 +188,7 @@ this.scrollAreaUi = new egw_fw_ui_scrollarea(this.sidemenuDiv); // Create toggleSidebar menu - this.toggleSidebarUi = new egw_fw_ui_toggleSidebar(this.sidemenuDiv, this._toggleSidebarCallback,this); + this.toggleSidebarUi = new egw_fw_ui_toggleSidebar('#egw_fw_basecontainer', this._toggleSidebarCallback,this); //Create the sidemenu, the tabs area and the splitter this.sidemenuUi = new desktop_ui_sidemenu(this.scrollAreaUi.contentDiv, @@ -458,6 +458,11 @@ { var toggleSidebar = egw.preference('toggleSidebar',this.activeApp.appName); this.toggleSidebarUi.set_toggle(toggleSidebar?toggleSidebar:"off", this._toggleSidebarCallback, this); + }, + + toggle_avatar_menu: function () + { + jQuery('#egw_fw_topmenu').toggle(); } }); })(window); diff --git a/api/src/Framework.php b/api/src/Framework.php index f44598437a..31ab2f4bcc 100644 --- a/api/src/Framework.php +++ b/api/src/Framework.php @@ -549,9 +549,6 @@ abstract class Framework extends Framework\Extra } $var['currentapp'] = $GLOBALS['egw_info']['flags']['currentapp']; - // current users for admins - $var['current_users'] = $this->_current_users(); - // quick add selectbox $var['quick_add'] = $this->_get_quick_add(); @@ -631,17 +628,52 @@ abstract class Framework extends Framework\Extra } /** - * Prepare the current users + * Returns user avatar menu * * @return string */ + protected static function _user_avatar_menu() + { + return ''; + } + + /** + * Returns logout menu + * + * @return string + */ + protected static function _logout_menu() + { + return ''; + } + + /** + * Returns print menu + * + * @return string + */ + protected static function _print_menu() + { + return ''; + } + + + /** + * Prepare the current users + * + * @return array + */ protected static function _current_users() { if( $GLOBALS['egw_info']['user']['apps']['admin'] && $GLOBALS['egw_info']['user']['preferences']['common']['show_currentusers']) { - $current_users = '' . - lang('Current users') . ': ' . $GLOBALS['egw']->session->session_count() . ''; - return $current_users; + return [ + 'name' => 'current_user', + 'title' => lang('Current users').':'.$GLOBALS['egw']->session->session_count(), + 'url' => self::link('/index.php','menuaction=admin.admin_accesslog.sessions') + ]; } } @@ -652,7 +684,7 @@ abstract class Framework extends Framework\Extra */ protected static function _get_quick_add() { - return ''; + return ''; } /** @@ -1109,6 +1141,8 @@ abstract class Framework extends Framework\Extra */ function topmenu(array $vars,array $apps) { + $this->_add_topmenu_info_item($this->_user_avatar_menu(), 'user_avatar'); + $this->_add_topmenu_info_item($this->_logout_menu(), 'logout'); if($GLOBALS['egw_info']['user']['apps']['home'] && isset($apps['home'])) { $this->_add_topmenu_item($apps['home']); @@ -1155,9 +1189,11 @@ abstract class Framework extends Framework\Extra { $this->_add_topmenu_info_item(self::_get_notification_bell(), 'notifications'); } - $this->_add_topmenu_info_item($vars['user_info'], 'user_info'); - $this->_add_topmenu_info_item($vars['current_users'], 'current_users'); + $this->_add_topmenu_info_item($this->_user_avatar_menu(), 'user_avatar'); + $this->_add_topmenu_item($this->_current_users()); $this->_add_topmenu_info_item($vars['quick_add'], 'quick_add'); + $this->_add_topmenu_info_item($this->_print_menu(), 'print_title'); + } /** diff --git a/api/src/Framework/Ajax.php b/api/src/Framework/Ajax.php index adf4735128..fd0ac6a35f 100755 --- a/api/src/Framework/Ajax.php +++ b/api/src/Framework/Ajax.php @@ -278,15 +278,6 @@ abstract class Ajax extends Api\Framework $this->tpl->set_var('sidebox_width', self::get_global_sidebar_width()); $this->tpl->set_var('sidebox_min_width', self::MIN_SIDEBAR_WIDTH); - if (!(Api\Header\UserAgent::mobile() || $GLOBALS['egw_info']['user']['preferences']['common']['theme'] == 'mobile')) - { - // logout button - $this->tpl->set_var('title_logout', lang("Logout")); - $this->tpl->set_var('link_logout', Egw::link('/logout.php')); - //Print button title - $this->tpl->set_var('title_print', lang("Print current view")); - } - // add framework div's $this->tpl->set_var($this->_get_footer()); $content .= $this->tpl->fp('out','framework'); @@ -355,22 +346,15 @@ abstract class Ajax extends Api\Framework { switch($app_data['name']) { - case 'logout': - if (Api\Header\UserAgent::mobile() || $GLOBALS['egw_info']['user']['preferences']['common']['theme'] == 'mobile') - { - - } - else - { - return; // no need for logout in topmenu on jdots - } - break; - case 'manual': $app_data['url'] = "javascript:callManual();"; break; default: + if (Api\Header\UserAgent::mobile() || $GLOBALS['egw_info']['user']['preferences']['common']['theme'] == 'mobile') + { + break; + } if (strpos($app_data['url'],'logout.php') === false && substr($app_data['url'], 0, 11) != 'javascript:') { $app_data['url'] = "javascript:egw_link_handler('".$app_data['url']."','". diff --git a/pixelegg/css/mobile.css b/pixelegg/css/mobile.css index 7a7e43775b..e34b64a452 100644 --- a/pixelegg/css/mobile.css +++ b/pixelegg/css/mobile.css @@ -3771,9 +3771,6 @@ div#egwpopup_message { background: #FFFFFF; } .egw_fw_ui_app_header_container { - border-width: 1px 0px 0px 0px; - border-style: solid; - border-color: #B4B4B4; height: auto; } .egw_fw_ui_app_header_container .egw_fw_ui_app_header { @@ -3936,6 +3933,8 @@ td.message span.message { #egw_fw_header { width: 100%; float: left; + position: absolute; + border-bottom: 1px solid silver; /* Logo EGW or Company - left top*/ /* ########################################################################################################################################### Topmenu / Home / Einstellungen / Zugriff / Kategorien usw.. @@ -3967,13 +3966,55 @@ td.message span.message { #egw_fw_header #egw_fw_topmenu_info_items { display: inline; } +#egw_fw_header #egw_fw_topmenu { + position: absolute; + display: none; + right: 5px; + width: 230px; + z-index: 1000; + top: 46px; + background: white; + box-shadow: 2px 3px 13px #666666; + -moz-box-shadow: 2px 3px 13px #666666; + -webkit-box-shadow: 2px 3px 13px #666666; + -khtml-box-shadow: 2px 3px 13px #666666; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items { + display: inline-block; + background: white; + float: right; + height: auto; + padding-left: 10px; + border-top: 1px solid silver; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item { + overflow: visible; + display: inline-block; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { + margin-top: 0; + font-size: 1em; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { + position: relative; + top: 0px; + padding-left: 3px; + display: inline-block; +} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items { - float: left; padding-top: 14px; - width: 70%; + width: 100%; + display: block; + float: right; + background: white; + height: auto; + z-index: 1000; + top: 45px; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul { - margin: 5px 2px; + width: 100%; + padding: 0px; + display: inline-grid; /*Home*/ /*home*/ /*Setup / Einstellungen*/ @@ -3983,52 +4024,27 @@ td.message span.message { /*help*/ /*Search*/ /*logout*/ + /*print*/ } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li { color: #FFFFFF; - /*.Button_size_square_32;*/ padding: 8px 10px; - /*.Complete_Button_normal;*/ - /*background-color: @gray_10;*/ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - -o-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border-top: #E6E6E6; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - background-color: inherit; + background: rgba(153, 204, 255, 0.4); color: #FFFFFF; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a { color: #000000; text-decoration: none; - height: 32px; - /*font-size: 1.1em;*/ font-size: 12px; line-height: 1.5em; display: inline-block; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { - /*color: @gray_10;*/ - border-color: #828282; text-decoration: none !important; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:before { - /*.img_filter_gray;*/ - /*-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);*/ - /*-webkit-filter: invert(100%);*/ -} -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child { - margin-left: 10px; -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child :before { border: none; } @@ -4082,6 +4098,12 @@ td.message span.message { padding-left: 20px; background-image: url(../images/topmenu_items/logout.svg); } +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_print { + background-repeat: no-repeat; + background-size: 16px; + padding-left: 20px; + background-image: url(../images/print.svg); +} /* ################################################### Slide Effekt ###################################################*/ @@ -4159,6 +4181,9 @@ td.message span.message { // ## ## # /* ##################################################################################################### */ +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { + padding-left: 235px; +} #egw_fw_main { padding: 0; width: auto; @@ -4174,19 +4199,17 @@ td.message span.message { background-color: transparent; float: left; width: 100%; - margin-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { margin: 0px 0 0 0; - padding: 1px 1px 0px 0px; + padding: 0px 150px 0px 60px; background-position: bottom; background-repeat: repeat-x; background-color: transparent; - height: 34px; + height: 39px; /*aktive Tabs*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { - /*float: left;*/ display: inline; width: 100%; text-align: center; @@ -4208,20 +4231,17 @@ td.message span.message { white-space: nowrap; text-overflow: ellipsis; margin: 0px 5px 0px 0px; - padding: 2px 5px 7px 2px; + padding: 0px 5px 0px 0px; cursor: pointer; - border-width: 1px 1px 0 1px; - border-style: solid; - border-color: #B4B4B4; background-repeat: repeat-x; - height: 24px; + height: 100%; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { - /*.background_color_20_gray ;*/ background-color: rgba(153, 204, 255, 0.4); + padding-bottom: 0px; + padding-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header h1 { - /*font-size: 100%;*/ font-size: 11px; line-height: 1em; margin: 0 15px 2px 2px; @@ -4243,59 +4263,22 @@ td.message span.message { filter: gray; /* IE 6-9 */ } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header object { - width: 16px; - height: 16px; - /*background-color: @gray_0;*/ - margin: 8px 1px 0 5px; - -webkit-border-top-right-radius: 5px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 5px; - -moz-border-radius-topright: 5px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 5px; - border-top-right-radius: 5px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 5px; - /*.background-clip(padding-box);*/ -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - border-bottom: 1px solid white !important; + border-left: 1px solid #bfc0bf; + border-right: 1px solid #bfc0bf; + border-bottom: 4px solid white !important; background-color: #ffffff; background-image: none !important; - padding-bottom: 8px; - /*aktive Objekte*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active:hover { background-color: #ffffff; + padding-top: 0px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active img.egw_fw_ui_tab_icon { display: inline-block; width: 16px; height: 16px; } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active object { - width: 24px; - height: 24px; - margin: 0px 1px 0 5px; - -webkit-border-top-right-radius: 2px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 2px; - -moz-border-radius-topright: 2px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 2px; - border-top-right-radius: 2px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 2px; - /*.background-clip(padding-box);*/ - background-color: #B4B4B4; -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button { right: 3px; top: 1px; @@ -4346,9 +4329,9 @@ td.message span.message { #egw_fw_sidebar { position: fixed; overflow: hidden; - top: 49px; + top: 38px; left: 0px; - bottom: 25px; + bottom: 0px; width: 225px; /*.background_color_5_gray;*/ /*#################################*/ @@ -4356,8 +4339,8 @@ td.message span.message { #egw_fw_sidebar #egw_fw_sidemenu { position: absolute; top: 1px; - bottom: 4px; - left: 4px; + bottom: 1px; + left: 0px; right: 8px; overflow: hidden; z-index: 0; @@ -4550,36 +4533,33 @@ td.message span.message { top: 40px; bottom: 3px; right: 0px; - border-top: 1px solid; border-left: 1px solid; border-color: #B4B4B4; } #egw_fw_sidebar #egw_fw_splitter:hover { border-color: #E6E6E6; } -#egw_fw_sidebar #egw_fw_toggler { +#egw_fw_basecontainer #egw_fw_toggler { display: block; - width: 30px; - height: 30px; - position: relative; + width: 44px; + height: 44px; + position: absolute; z-index: 1; - top: 8px; - margin-top: 0; - margin-bottom: -30px; - float: right; + margin-top: 0px; + left: 256px; } -#egw_fw_sidebar #egw_fw_toggler span { +#egw_fw_basecontainer #egw_fw_toggler span { background-color: transparent; position: relative; display: block; - width: 100%; + width: 35px; height: 5px; backface-visibility: hidden; border-radius: 2px; top: 11px; left: 10px; } -#egw_fw_sidebar #egw_fw_toggler span:before { +#egw_fw_basecontainer #egw_fw_toggler span:before { transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4589,20 +4569,20 @@ td.message span.message { -webkit-transform: rotate(145deg) translate(8px, -2px); background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_toggler span:after { +#egw_fw_basecontainer #egw_fw_toggler span:before, +#egw_fw_basecontainer #egw_fw_toggler span:after { content: ""; position: absolute; - left: 0; - top: -9px; - width: 10px; - height: 2px; + left: 0px; + top: 3px; + width: 35px; + height: 4px; background-color: #606060; backface-visibility: hidden; border-radius: 2px; } -#egw_fw_sidebar #egw_fw_toggler span:after { - top: 9px; +#egw_fw_basecontainer #egw_fw_toggler span:after { + top: 15px; transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4612,58 +4592,61 @@ td.message span.message { -webkit-transform: rotate(-145deg) translate(8px, 2px); background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { - top: -1px; +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { /* toggler button*/ - /*sidebar adjustments*/ } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler { - margin: 1px auto 4px; - float: none; - top: 5px; -} -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span { background-color: #b4b4b4; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; - left: 0; + left: 5px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; - width: 100%; + width: 35px; height: 5px; background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before { + top: 10px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { + top: 20px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_content { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu { + top: 1px; + /*sidebar adjustments*/ +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_content { display: none !important; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header_active { border-radius: 0 !important; width: auto !important; border: 0; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header { width: 50px; height: 35px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header h1 { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header h1 { visibility: hidden; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header img { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header img { margin: 4px auto 0px !important; padding: 0 !important; float: none !important; @@ -4866,9 +4849,6 @@ td.message span.message { #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { top: 7px !important; } -#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { - top: 1px; -} #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { position: fixed; top: 50px; @@ -4929,95 +4909,15 @@ td.message span.message { Created on : 23.07.2014, 13:25:11 Author : stefanreinhardt */ -/*################################################# - Add / Print / Logout / - - Name / Date -###################################################*/ -/*#egw_fw_topmenu_addons{}*/ -#egw_fw_logout { - background-image: url(../images/logout.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 1em; - margin-top: 0px; - z-index: 200; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - position: fixed; - right: 0px; -} -#egw_fw_logout:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_logout:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_logout:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print { - background-image: url(../images/print.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 5px; - margin-top: 0px; - position: fixed; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - right: 40px; - z-index: 200; -} -#egw_fw_print:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_print:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -/*################################################# -/* Second Line -/* e.g. Name / Datum / angemeldete User -###################################################*/ #egw_fw_topmenu_info_items { - position: fixed; + display: inline-block; + height: 45px; + position: absolute; + padding-right: 2px; + right: 0px; z-index: 1000; - bottom: 2px; - right: 5px; - padding-right: 20px; + background-color: #fbfbfb; /*Notification*/ - /*user info*/ /*current user info*/ /*current user info*/ /*time zone*/ @@ -5028,32 +4928,45 @@ td.message span.message { /* Opera and prob css3 final iteration */ } #egw_fw_topmenu_info_items .topmenu_info_item { - overflow: visible; + height: 45px; + width: 45px; + border-left: 1px solid #bfc0bf; + display: inline-block; + padding-left: 3px; + float: right; + background-size: 20px; + background-position: center center; + background-repeat: no-repeat; + cursor: pointer; +} +#egw_fw_topmenu_info_items .topmenu_info_item:hover { + background-color: rgba(153, 204, 255, 0.4); +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span { + height: 40px; + width: 40px; + display: inline-block; + border: none; + margin-top: 2px; + margin-left: 1px; +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span img { + width: 40px; +} +#egw_fw_topmenu_info_items #topmenu_info_logout { + background-image: url(../images/logout.svg); +} +#egw_fw_topmenu_info_items #topmenu_info_logout a { + width: 45px; + height: 45px; display: inline-block; } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { - /*float: right;*/ - margin-top: 0; - font-size: 1em; - padding-right: 5px; +#egw_fw_topmenu_info_items #topmenu_info_print_title { + background-image: url(../images/print.svg); } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { - position: relative; - top: 0px; - display: inline-block; - /*&:before {content: "";font-size: 1em;color: @egw_color_2_a;}*/ -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_topmenu_info_items #topmenu_info_user_info { +#egw_fw_topmenu_info_items #topmenu_info_print_title span { + width: 45px; + height: 45px; display: inline-block; } #egw_fw_topmenu_info_items form { @@ -5063,22 +4976,14 @@ td.message span.message { padding: 0px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add { - /*border: 1px solid rgba(0, 0, 0, 0.15);*/ - /*box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);*/ float: right; - padding: 0.5em; - position: fixed; - right: 80px; - top: 5px; background-image: url(../images/add.svg); background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 4px 4px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - width: 16px; - height: 16px; + background-size: 24px; + background-position: center; + width: 45px; + height: 45px; + padding-right: 3px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before { content: " "; @@ -5087,35 +4992,25 @@ td.message span.message { line-height: 0.6em; background-color: white; } -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container { position: fixed; - right: 15px !important; - top: 40px; + right: 93px !important; + top: 47px; width: 160px !important; background: #FFFFFF; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before { content: ''; position: absolute; - bottom: 50%; + bottom: 51%; left: 42%; width: 0; - height: 0; - border-left: 15px solid transparent; + height: 0px; + border-left: 14px solid transparent; border-right: 15px solid transparent; border-bottom: 12px solid #aaa; margin-bottom: 12px; - margin-left: 0px; + margin-left: 1px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after { content: ''; @@ -5132,6 +5027,14 @@ td.message span.message { #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-single span { display: none; } +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container a.chzn-single.chzn-default { + border: 1px solid #bfc0bf; + border-radius: 0px; +} +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-drop { + border-radius: 0px; + margin-top: -2px; +} #egw_fw_topmenu_info_items #topmenu_info_quick_add select#quick_add_selectbox { visibility: hidden; } diff --git a/pixelegg/css/monochrome.css b/pixelegg/css/monochrome.css index 6f16257ee5..4eeeb20e29 100644 --- a/pixelegg/css/monochrome.css +++ b/pixelegg/css/monochrome.css @@ -3760,9 +3760,6 @@ div#egwpopup_message { background: #FFFFFF; } .egw_fw_ui_app_header_container { - border-width: 1px 0px 0px 0px; - border-style: solid; - border-color: #B4B4B4; height: auto; } .egw_fw_ui_app_header_container .egw_fw_ui_app_header { @@ -3925,6 +3922,8 @@ td.message span.message { #egw_fw_header { width: 100%; float: left; + position: absolute; + border-bottom: 1px solid silver; /* Logo EGW or Company - left top*/ /* ########################################################################################################################################### Topmenu / Home / Einstellungen / Zugriff / Kategorien usw.. @@ -3956,13 +3955,55 @@ td.message span.message { #egw_fw_header #egw_fw_topmenu_info_items { display: inline; } +#egw_fw_header #egw_fw_topmenu { + position: absolute; + display: none; + right: 5px; + width: 230px; + z-index: 1000; + top: 46px; + background: white; + box-shadow: 2px 3px 13px #666666; + -moz-box-shadow: 2px 3px 13px #666666; + -webkit-box-shadow: 2px 3px 13px #666666; + -khtml-box-shadow: 2px 3px 13px #666666; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items { + display: inline-block; + background: white; + float: right; + height: auto; + padding-left: 10px; + border-top: 1px solid silver; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item { + overflow: visible; + display: inline-block; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { + margin-top: 0; + font-size: 1em; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { + position: relative; + top: 0px; + padding-left: 3px; + display: inline-block; +} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items { - float: left; padding-top: 14px; - width: 70%; + width: 100%; + display: block; + float: right; + background: white; + height: auto; + z-index: 1000; + top: 45px; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul { - margin: 5px 2px; + width: 100%; + padding: 0px; + display: inline-grid; /*Home*/ /*home*/ /*Setup / Einstellungen*/ @@ -3972,52 +4013,27 @@ td.message span.message { /*help*/ /*Search*/ /*logout*/ + /*print*/ } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li { color: #FFFFFF; - /*.Button_size_square_32;*/ padding: 8px 10px; - /*.Complete_Button_normal;*/ - /*background-color: @gray_10;*/ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - -o-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border-top: #E6E6E6; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - background-color: inherit; + background: rgba(153, 204, 255, 0.4); color: #FFFFFF; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a { color: #000000; text-decoration: none; - height: 32px; - /*font-size: 1.1em;*/ font-size: 12px; line-height: 1.5em; display: inline-block; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { - /*color: @gray_10;*/ - border-color: #828282; text-decoration: none !important; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:before { - /*.img_filter_gray;*/ - /*-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);*/ - /*-webkit-filter: invert(100%);*/ -} -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child { - margin-left: 10px; -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child :before { border: none; } @@ -4071,6 +4087,12 @@ td.message span.message { padding-left: 20px; background-image: url(../images/topmenu_items/logout.svg); } +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_print { + background-repeat: no-repeat; + background-size: 16px; + padding-left: 20px; + background-image: url(../images/print.svg); +} /* ################################################### Slide Effekt ###################################################*/ @@ -4148,6 +4170,9 @@ td.message span.message { // ## ## # /* ##################################################################################################### */ +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { + padding-left: 235px; +} #egw_fw_main { padding: 0; width: auto; @@ -4163,19 +4188,17 @@ td.message span.message { background-color: transparent; float: left; width: 100%; - margin-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { margin: 0px 0 0 0; - padding: 1px 1px 0px 0px; + padding: 0px 150px 0px 60px; background-position: bottom; background-repeat: repeat-x; background-color: transparent; - height: 34px; + height: 39px; /*aktive Tabs*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { - /*float: left;*/ display: inline; width: 100%; text-align: center; @@ -4197,20 +4220,17 @@ td.message span.message { white-space: nowrap; text-overflow: ellipsis; margin: 0px 5px 0px 0px; - padding: 2px 5px 7px 2px; + padding: 0px 5px 0px 0px; cursor: pointer; - border-width: 1px 1px 0 1px; - border-style: solid; - border-color: #B4B4B4; background-repeat: repeat-x; - height: 24px; + height: 100%; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { - /*.background_color_20_gray ;*/ background-color: rgba(153, 204, 255, 0.4); + padding-bottom: 0px; + padding-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header h1 { - /*font-size: 100%;*/ font-size: 11px; line-height: 1em; margin: 0 15px 2px 2px; @@ -4232,59 +4252,22 @@ td.message span.message { filter: gray; /* IE 6-9 */ } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header object { - width: 16px; - height: 16px; - /*background-color: @gray_0;*/ - margin: 8px 1px 0 5px; - -webkit-border-top-right-radius: 5px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 5px; - -moz-border-radius-topright: 5px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 5px; - border-top-right-radius: 5px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 5px; - /*.background-clip(padding-box);*/ -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - border-bottom: 1px solid white !important; + border-left: 1px solid #bfc0bf; + border-right: 1px solid #bfc0bf; + border-bottom: 4px solid white !important; background-color: #ffffff; background-image: none !important; - padding-bottom: 8px; - /*aktive Objekte*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active:hover { background-color: #ffffff; + padding-top: 0px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active img.egw_fw_ui_tab_icon { display: inline-block; width: 16px; height: 16px; } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active object { - width: 24px; - height: 24px; - margin: 0px 1px 0 5px; - -webkit-border-top-right-radius: 2px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 2px; - -moz-border-radius-topright: 2px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 2px; - border-top-right-radius: 2px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 2px; - /*.background-clip(padding-box);*/ - background-color: #B4B4B4; -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button { right: 3px; top: 1px; @@ -4335,9 +4318,9 @@ td.message span.message { #egw_fw_sidebar { position: fixed; overflow: hidden; - top: 49px; + top: 38px; left: 0px; - bottom: 25px; + bottom: 0px; width: 225px; /*.background_color_5_gray;*/ /*#################################*/ @@ -4345,8 +4328,8 @@ td.message span.message { #egw_fw_sidebar #egw_fw_sidemenu { position: absolute; top: 1px; - bottom: 4px; - left: 4px; + bottom: 1px; + left: 0px; right: 8px; overflow: hidden; z-index: 0; @@ -4539,36 +4522,33 @@ td.message span.message { top: 40px; bottom: 3px; right: 0px; - border-top: 1px solid; border-left: 1px solid; border-color: #B4B4B4; } #egw_fw_sidebar #egw_fw_splitter:hover { border-color: #E6E6E6; } -#egw_fw_sidebar #egw_fw_toggler { +#egw_fw_basecontainer #egw_fw_toggler { display: block; - width: 30px; - height: 30px; - position: relative; + width: 44px; + height: 44px; + position: absolute; z-index: 1; - top: 8px; - margin-top: 0; - margin-bottom: -30px; - float: right; + margin-top: 0px; + left: 256px; } -#egw_fw_sidebar #egw_fw_toggler span { +#egw_fw_basecontainer #egw_fw_toggler span { background-color: transparent; position: relative; display: block; - width: 100%; + width: 35px; height: 5px; backface-visibility: hidden; border-radius: 2px; top: 11px; left: 10px; } -#egw_fw_sidebar #egw_fw_toggler span:before { +#egw_fw_basecontainer #egw_fw_toggler span:before { transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4578,20 +4558,20 @@ td.message span.message { -webkit-transform: rotate(145deg) translate(8px, -2px); background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_toggler span:after { +#egw_fw_basecontainer #egw_fw_toggler span:before, +#egw_fw_basecontainer #egw_fw_toggler span:after { content: ""; position: absolute; - left: 0; - top: -9px; - width: 10px; - height: 2px; + left: 0px; + top: 3px; + width: 35px; + height: 4px; background-color: #606060; backface-visibility: hidden; border-radius: 2px; } -#egw_fw_sidebar #egw_fw_toggler span:after { - top: 9px; +#egw_fw_basecontainer #egw_fw_toggler span:after { + top: 15px; transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4601,58 +4581,61 @@ td.message span.message { -webkit-transform: rotate(-145deg) translate(8px, 2px); background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { - top: -1px; +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { /* toggler button*/ - /*sidebar adjustments*/ } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler { - margin: 1px auto 4px; - float: none; - top: 5px; -} -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span { background-color: #b4b4b4; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; - left: 0; + left: 5px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; - width: 100%; + width: 35px; height: 5px; background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before { + top: 10px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { + top: 20px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_content { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu { + top: 1px; + /*sidebar adjustments*/ +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_content { display: none !important; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header_active { border-radius: 0 !important; width: auto !important; border: 0; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header { width: 50px; height: 35px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header h1 { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header h1 { visibility: hidden; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header img { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header img { margin: 4px auto 0px !important; padding: 0 !important; float: none !important; @@ -4855,9 +4838,6 @@ td.message span.message { #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { top: 7px !important; } -#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { - top: 1px; -} #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { position: fixed; top: 50px; @@ -4918,95 +4898,15 @@ td.message span.message { Created on : 23.07.2014, 13:25:11 Author : stefanreinhardt */ -/*################################################# - Add / Print / Logout / - - Name / Date -###################################################*/ -/*#egw_fw_topmenu_addons{}*/ -#egw_fw_logout { - background-image: url(../images/logout.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 1em; - margin-top: 0px; - z-index: 200; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - position: fixed; - right: 0px; -} -#egw_fw_logout:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_logout:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_logout:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print { - background-image: url(../images/print.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 5px; - margin-top: 0px; - position: fixed; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - right: 40px; - z-index: 200; -} -#egw_fw_print:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_print:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -/*################################################# -/* Second Line -/* e.g. Name / Datum / angemeldete User -###################################################*/ #egw_fw_topmenu_info_items { - position: fixed; + display: inline-block; + height: 45px; + position: absolute; + padding-right: 2px; + right: 0px; z-index: 1000; - bottom: 2px; - right: 5px; - padding-right: 20px; + background-color: #fbfbfb; /*Notification*/ - /*user info*/ /*current user info*/ /*current user info*/ /*time zone*/ @@ -5017,32 +4917,45 @@ td.message span.message { /* Opera and prob css3 final iteration */ } #egw_fw_topmenu_info_items .topmenu_info_item { - overflow: visible; + height: 45px; + width: 45px; + border-left: 1px solid #bfc0bf; + display: inline-block; + padding-left: 3px; + float: right; + background-size: 20px; + background-position: center center; + background-repeat: no-repeat; + cursor: pointer; +} +#egw_fw_topmenu_info_items .topmenu_info_item:hover { + background-color: rgba(153, 204, 255, 0.4); +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span { + height: 40px; + width: 40px; + display: inline-block; + border: none; + margin-top: 2px; + margin-left: 1px; +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span img { + width: 40px; +} +#egw_fw_topmenu_info_items #topmenu_info_logout { + background-image: url(../images/logout.svg); +} +#egw_fw_topmenu_info_items #topmenu_info_logout a { + width: 45px; + height: 45px; display: inline-block; } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { - /*float: right;*/ - margin-top: 0; - font-size: 1em; - padding-right: 5px; +#egw_fw_topmenu_info_items #topmenu_info_print_title { + background-image: url(../images/print.svg); } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { - position: relative; - top: 0px; - display: inline-block; - /*&:before {content: "";font-size: 1em;color: @egw_color_2_a;}*/ -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_topmenu_info_items #topmenu_info_user_info { +#egw_fw_topmenu_info_items #topmenu_info_print_title span { + width: 45px; + height: 45px; display: inline-block; } #egw_fw_topmenu_info_items form { @@ -5052,22 +4965,14 @@ td.message span.message { padding: 0px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add { - /*border: 1px solid rgba(0, 0, 0, 0.15);*/ - /*box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);*/ float: right; - padding: 0.5em; - position: fixed; - right: 80px; - top: 5px; background-image: url(../images/add.svg); background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 4px 4px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - width: 16px; - height: 16px; + background-size: 24px; + background-position: center; + width: 45px; + height: 45px; + padding-right: 3px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before { content: " "; @@ -5076,35 +4981,25 @@ td.message span.message { line-height: 0.6em; background-color: white; } -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container { position: fixed; - right: 15px !important; - top: 40px; + right: 93px !important; + top: 47px; width: 160px !important; background: #FFFFFF; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before { content: ''; position: absolute; - bottom: 50%; + bottom: 51%; left: 42%; width: 0; - height: 0; - border-left: 15px solid transparent; + height: 0px; + border-left: 14px solid transparent; border-right: 15px solid transparent; border-bottom: 12px solid #aaa; margin-bottom: 12px; - margin-left: 0px; + margin-left: 1px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after { content: ''; @@ -5121,6 +5016,14 @@ td.message span.message { #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-single span { display: none; } +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container a.chzn-single.chzn-default { + border: 1px solid #bfc0bf; + border-radius: 0px; +} +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-drop { + border-radius: 0px; + margin-top: -2px; +} #egw_fw_topmenu_info_items #topmenu_info_quick_add select#quick_add_selectbox { visibility: hidden; } diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css index 49ca2fd843..789e40bd8a 100644 --- a/pixelegg/css/pixelegg.css +++ b/pixelegg/css/pixelegg.css @@ -3771,9 +3771,6 @@ div#egwpopup_message { background: #FFFFFF; } .egw_fw_ui_app_header_container { - border-width: 1px 0px 0px 0px; - border-style: solid; - border-color: #B4B4B4; height: auto; } .egw_fw_ui_app_header_container .egw_fw_ui_app_header { @@ -3936,6 +3933,8 @@ td.message span.message { #egw_fw_header { width: 100%; float: left; + position: absolute; + border-bottom: 1px solid silver; /* Logo EGW or Company - left top*/ /* ########################################################################################################################################### Topmenu / Home / Einstellungen / Zugriff / Kategorien usw.. @@ -3967,13 +3966,55 @@ td.message span.message { #egw_fw_header #egw_fw_topmenu_info_items { display: inline; } +#egw_fw_header #egw_fw_topmenu { + position: absolute; + display: none; + right: 5px; + width: 230px; + z-index: 1000; + top: 46px; + background: white; + box-shadow: 2px 3px 13px #666666; + -moz-box-shadow: 2px 3px 13px #666666; + -webkit-box-shadow: 2px 3px 13px #666666; + -khtml-box-shadow: 2px 3px 13px #666666; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items { + display: inline-block; + background: white; + float: right; + height: auto; + padding-left: 10px; + border-top: 1px solid silver; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item { + overflow: visible; + display: inline-block; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { + margin-top: 0; + font-size: 1em; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { + position: relative; + top: 0px; + padding-left: 3px; + display: inline-block; +} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items { - float: left; padding-top: 14px; - width: 70%; + width: 100%; + display: block; + float: right; + background: white; + height: auto; + z-index: 1000; + top: 45px; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul { - margin: 5px 2px; + width: 100%; + padding: 0px; + display: inline-grid; /*Home*/ /*home*/ /*Setup / Einstellungen*/ @@ -3983,52 +4024,27 @@ td.message span.message { /*help*/ /*Search*/ /*logout*/ + /*print*/ } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li { color: #FFFFFF; - /*.Button_size_square_32;*/ padding: 8px 10px; - /*.Complete_Button_normal;*/ - /*background-color: @gray_10;*/ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - -o-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border-top: #E6E6E6; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - background-color: inherit; + background: rgba(153, 204, 255, 0.4); color: #FFFFFF; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a { color: #000000; text-decoration: none; - height: 32px; - /*font-size: 1.1em;*/ font-size: 12px; line-height: 1.5em; display: inline-block; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { - /*color: @gray_10;*/ - border-color: #828282; text-decoration: none !important; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:before { - /*.img_filter_gray;*/ - /*-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);*/ - /*-webkit-filter: invert(100%);*/ -} -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child { - margin-left: 10px; -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child :before { border: none; } @@ -4082,6 +4098,12 @@ td.message span.message { padding-left: 20px; background-image: url(../images/topmenu_items/logout.svg); } +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_print { + background-repeat: no-repeat; + background-size: 16px; + padding-left: 20px; + background-image: url(../images/print.svg); +} /* ################################################### Slide Effekt ###################################################*/ @@ -4159,6 +4181,9 @@ td.message span.message { // ## ## # /* ##################################################################################################### */ +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { + padding-left: 235px; +} #egw_fw_main { padding: 0; width: auto; @@ -4174,19 +4199,17 @@ td.message span.message { background-color: transparent; float: left; width: 100%; - margin-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { margin: 0px 0 0 0; - padding: 1px 1px 0px 0px; + padding: 0px 150px 0px 60px; background-position: bottom; background-repeat: repeat-x; background-color: transparent; - height: 34px; + height: 39px; /*aktive Tabs*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { - /*float: left;*/ display: inline; width: 100%; text-align: center; @@ -4208,20 +4231,17 @@ td.message span.message { white-space: nowrap; text-overflow: ellipsis; margin: 0px 5px 0px 0px; - padding: 2px 5px 7px 2px; + padding: 0px 5px 0px 0px; cursor: pointer; - border-width: 1px 1px 0 1px; - border-style: solid; - border-color: #B4B4B4; background-repeat: repeat-x; - height: 24px; + height: 100%; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { - /*.background_color_20_gray ;*/ background-color: rgba(153, 204, 255, 0.4); + padding-bottom: 0px; + padding-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header h1 { - /*font-size: 100%;*/ font-size: 11px; line-height: 1em; margin: 0 15px 2px 2px; @@ -4243,59 +4263,22 @@ td.message span.message { filter: gray; /* IE 6-9 */ } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header object { - width: 16px; - height: 16px; - /*background-color: @gray_0;*/ - margin: 8px 1px 0 5px; - -webkit-border-top-right-radius: 5px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 5px; - -moz-border-radius-topright: 5px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 5px; - border-top-right-radius: 5px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 5px; - /*.background-clip(padding-box);*/ -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - border-bottom: 1px solid white !important; + border-left: 1px solid #bfc0bf; + border-right: 1px solid #bfc0bf; + border-bottom: 4px solid white !important; background-color: #ffffff; background-image: none !important; - padding-bottom: 8px; - /*aktive Objekte*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active:hover { background-color: #ffffff; + padding-top: 0px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active img.egw_fw_ui_tab_icon { display: inline-block; width: 16px; height: 16px; } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active object { - width: 24px; - height: 24px; - margin: 0px 1px 0 5px; - -webkit-border-top-right-radius: 2px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 2px; - -moz-border-radius-topright: 2px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 2px; - border-top-right-radius: 2px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 2px; - /*.background-clip(padding-box);*/ - background-color: #B4B4B4; -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button { right: 3px; top: 1px; @@ -4346,9 +4329,9 @@ td.message span.message { #egw_fw_sidebar { position: fixed; overflow: hidden; - top: 49px; + top: 38px; left: 0px; - bottom: 25px; + bottom: 0px; width: 225px; /*.background_color_5_gray;*/ /*#################################*/ @@ -4356,8 +4339,8 @@ td.message span.message { #egw_fw_sidebar #egw_fw_sidemenu { position: absolute; top: 1px; - bottom: 4px; - left: 4px; + bottom: 1px; + left: 0px; right: 8px; overflow: hidden; z-index: 0; @@ -4550,36 +4533,33 @@ td.message span.message { top: 40px; bottom: 3px; right: 0px; - border-top: 1px solid; border-left: 1px solid; border-color: #B4B4B4; } #egw_fw_sidebar #egw_fw_splitter:hover { border-color: #E6E6E6; } -#egw_fw_sidebar #egw_fw_toggler { +#egw_fw_basecontainer #egw_fw_toggler { display: block; - width: 30px; - height: 30px; - position: relative; + width: 44px; + height: 44px; + position: absolute; z-index: 1; - top: 8px; - margin-top: 0; - margin-bottom: -30px; - float: right; + margin-top: 0px; + left: 256px; } -#egw_fw_sidebar #egw_fw_toggler span { +#egw_fw_basecontainer #egw_fw_toggler span { background-color: transparent; position: relative; display: block; - width: 100%; + width: 35px; height: 5px; backface-visibility: hidden; border-radius: 2px; top: 11px; left: 10px; } -#egw_fw_sidebar #egw_fw_toggler span:before { +#egw_fw_basecontainer #egw_fw_toggler span:before { transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4589,20 +4569,20 @@ td.message span.message { -webkit-transform: rotate(145deg) translate(8px, -2px); background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_toggler span:after { +#egw_fw_basecontainer #egw_fw_toggler span:before, +#egw_fw_basecontainer #egw_fw_toggler span:after { content: ""; position: absolute; - left: 0; - top: -9px; - width: 10px; - height: 2px; + left: 0px; + top: 3px; + width: 35px; + height: 4px; background-color: #606060; backface-visibility: hidden; border-radius: 2px; } -#egw_fw_sidebar #egw_fw_toggler span:after { - top: 9px; +#egw_fw_basecontainer #egw_fw_toggler span:after { + top: 15px; transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4612,58 +4592,61 @@ td.message span.message { -webkit-transform: rotate(-145deg) translate(8px, 2px); background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { - top: -1px; +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { /* toggler button*/ - /*sidebar adjustments*/ } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler { - margin: 1px auto 4px; - float: none; - top: 5px; -} -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span { background-color: #b4b4b4; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; - left: 0; + left: 5px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; - width: 100%; + width: 35px; height: 5px; background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before { + top: 10px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { + top: 20px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_content { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu { + top: 1px; + /*sidebar adjustments*/ +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_content { display: none !important; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header_active { border-radius: 0 !important; width: auto !important; border: 0; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header { width: 50px; height: 35px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header h1 { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header h1 { visibility: hidden; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header img { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header img { margin: 4px auto 0px !important; padding: 0 !important; float: none !important; @@ -4866,9 +4849,6 @@ td.message span.message { #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { top: 7px !important; } -#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { - top: 1px; -} #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { position: fixed; top: 50px; @@ -4929,95 +4909,15 @@ td.message span.message { Created on : 23.07.2014, 13:25:11 Author : stefanreinhardt */ -/*################################################# - Add / Print / Logout / - - Name / Date -###################################################*/ -/*#egw_fw_topmenu_addons{}*/ -#egw_fw_logout { - background-image: url(../images/logout.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 1em; - margin-top: 0px; - z-index: 200; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - position: fixed; - right: 0px; -} -#egw_fw_logout:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_logout:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_logout:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print { - background-image: url(../images/print.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 5px; - margin-top: 0px; - position: fixed; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - right: 40px; - z-index: 200; -} -#egw_fw_print:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_print:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -/*################################################# -/* Second Line -/* e.g. Name / Datum / angemeldete User -###################################################*/ #egw_fw_topmenu_info_items { - position: fixed; + display: inline-block; + height: 45px; + position: absolute; + padding-right: 2px; + right: 0px; z-index: 1000; - bottom: 2px; - right: 5px; - padding-right: 20px; + background-color: #fbfbfb; /*Notification*/ - /*user info*/ /*current user info*/ /*current user info*/ /*time zone*/ @@ -5028,32 +4928,45 @@ td.message span.message { /* Opera and prob css3 final iteration */ } #egw_fw_topmenu_info_items .topmenu_info_item { - overflow: visible; + height: 45px; + width: 45px; + border-left: 1px solid #bfc0bf; + display: inline-block; + padding-left: 3px; + float: right; + background-size: 20px; + background-position: center center; + background-repeat: no-repeat; + cursor: pointer; +} +#egw_fw_topmenu_info_items .topmenu_info_item:hover { + background-color: rgba(153, 204, 255, 0.4); +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span { + height: 40px; + width: 40px; + display: inline-block; + border: none; + margin-top: 2px; + margin-left: 1px; +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span img { + width: 40px; +} +#egw_fw_topmenu_info_items #topmenu_info_logout { + background-image: url(../images/logout.svg); +} +#egw_fw_topmenu_info_items #topmenu_info_logout a { + width: 45px; + height: 45px; display: inline-block; } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { - /*float: right;*/ - margin-top: 0; - font-size: 1em; - padding-right: 5px; +#egw_fw_topmenu_info_items #topmenu_info_print_title { + background-image: url(../images/print.svg); } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { - position: relative; - top: 0px; - display: inline-block; - /*&:before {content: "";font-size: 1em;color: @egw_color_2_a;}*/ -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_topmenu_info_items #topmenu_info_user_info { +#egw_fw_topmenu_info_items #topmenu_info_print_title span { + width: 45px; + height: 45px; display: inline-block; } #egw_fw_topmenu_info_items form { @@ -5063,22 +4976,14 @@ td.message span.message { padding: 0px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add { - /*border: 1px solid rgba(0, 0, 0, 0.15);*/ - /*box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);*/ float: right; - padding: 0.5em; - position: fixed; - right: 80px; - top: 5px; background-image: url(../images/add.svg); background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 4px 4px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - width: 16px; - height: 16px; + background-size: 24px; + background-position: center; + width: 45px; + height: 45px; + padding-right: 3px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before { content: " "; @@ -5087,35 +4992,25 @@ td.message span.message { line-height: 0.6em; background-color: white; } -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container { position: fixed; - right: 15px !important; - top: 40px; + right: 93px !important; + top: 47px; width: 160px !important; background: #FFFFFF; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before { content: ''; position: absolute; - bottom: 50%; + bottom: 51%; left: 42%; width: 0; - height: 0; - border-left: 15px solid transparent; + height: 0px; + border-left: 14px solid transparent; border-right: 15px solid transparent; border-bottom: 12px solid #aaa; margin-bottom: 12px; - margin-left: 0px; + margin-left: 1px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after { content: ''; @@ -5132,6 +5027,14 @@ td.message span.message { #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-single span { display: none; } +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container a.chzn-single.chzn-default { + border: 1px solid #bfc0bf; + border-radius: 0px; +} +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-drop { + border-radius: 0px; + margin-top: -2px; +} #egw_fw_topmenu_info_items #topmenu_info_quick_add select#quick_add_selectbox { visibility: hidden; } @@ -6395,7 +6298,7 @@ form[id^="ranking-"] .dialogHeadbar { #ranking_sidebox_header { border-left: 6px solid #404040 !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #addressbook_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #addressbook_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(0, 51, 102, 0.3); } #egw_fw_sidebar #egw_fw_sidemenu #addressbook_sidebox_content .egw_fw_ui_category_active { @@ -6446,7 +6349,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #003366; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(51, 51, 51, 0.3); } #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6461,7 +6364,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #333333; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(204, 102, 51, 0.3); } #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6476,7 +6379,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #CC6633; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(204, 0, 51, 0.3); } #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6491,7 +6394,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #CC0033; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(255, 153, 51, 0.3); } #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6506,7 +6409,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #ff9933; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #infolog_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #infolog_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(102, 0, 51, 0.3); } #infolog_sidebox_header { @@ -6521,7 +6424,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #660033; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(0, 102, 153, 0.3); } #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6536,7 +6439,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #006699; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(102, 153, 153, 0.3); } #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6551,7 +6454,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #669999; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(0, 51, 51, 0.3); } #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6566,7 +6469,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #003333; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(51, 0, 102, 0.3); } #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6581,7 +6484,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #330066; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(0, 153, 102, 0.3); } #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6596,7 +6499,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #009966; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(121, 121, 121, 0.3); } #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6611,7 +6514,7 @@ form[id^="ranking-"] .dialogHeadbar { border-top-color: #797979; border-top-width: 4px !important; } -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: rgba(64, 64, 64, 0.3); } #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -6630,7 +6533,7 @@ form[id^="ranking-"] .dialogHeadbar { .standartTreeImage { filter: none; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_sidebar #egw_fw_basecontainer.egw_fw_sidebar_toggleOn .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active { margin-left: 3px; padding-top: 3px; } @@ -6645,10 +6548,8 @@ form[id^="ranking-"] .dialogHeadbar { border-left: 1px solid silver !important; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - padding-bottom: 4px; - border-top: 4px solid; border-top-color: #797979; - border-top-width: 4px !important; + border-top: 4px solid; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_cats { background-image: url(../images/topmenu_items/category.svg); diff --git a/pixelegg/css/pixelegg.less b/pixelegg/css/pixelegg.less index 66e60194b3..cb2ff56f7e 100644 --- a/pixelegg/css/pixelegg.less +++ b/pixelegg/css/pixelegg.less @@ -13,7 +13,7 @@ @import "../less/app_colors.less"; // Addressbook -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #addressbook_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #addressbook_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@addressbook-color, 30%); } @@ -92,7 +92,7 @@ border-top-width: 4px !important; } // Admin -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@admin-color, 30%); } #admin_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -106,7 +106,7 @@ border-top-width: 4px !important; } // Bookmarks -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@bookmarks-color, 30%); } #bookmarks_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -121,7 +121,7 @@ } // Calendar -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@calendar-color, 30%); } #calendar_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -135,7 +135,7 @@ border-top-width: 4px !important; } // Filemanager -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@filemanager-color, 30%); } #filemanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -149,7 +149,7 @@ border-top-width: 4px !important; } // Infolog -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #infolog_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #infolog_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@infolog-color, 30%); } #infolog_sidebox_header{ @@ -165,7 +165,7 @@ border-top-width: 4px !important; } // Mail -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@mail-color, 30%); } #mail_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -182,7 +182,7 @@ border-top-width: 4px !important; } // Projectmanager -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@projectmanager-color, 30%); } #projectmanager_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -196,7 +196,7 @@ border-top-width: 4px !important; } // Resources -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@resources-color, 30%); } #resources_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -211,7 +211,7 @@ } // Timesheet -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@timesheet-color, 30%); } #timesheet_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -225,7 +225,7 @@ border-top-width: 4px !important; } // Tracker -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@tracker-color, 30%); } #tracker_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -239,7 +239,7 @@ border-top-width: 4px !important; } // Wiki -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@wiki-color, 30%); } #wiki_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -253,7 +253,7 @@ border-top-width: 4px !important; } // Ranking -#egw_fw_sidemenu.egw_fw_sidebar_toggleOn #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { background-color: fade(@ranking-color, 30%); } #ranking_sidebox_header.egw_fw_ui_sidemenu_entry_header_active { @@ -272,7 +272,7 @@ } #egw_fw_sidebar { - #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { + #egw_fw_basecontainer.egw_fw_sidebar_toggleOn { .egw_fw_ui_scrollarea_outerdiv { .egw_fw_ui_sidemenu_entry_header_active { margin-left: 3px; @@ -296,10 +296,8 @@ } } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - padding-bottom: 4px; - border-top: 4px solid; border-top-color: @default-color; - border-top-width: 4px !important; + border-top: 4px solid; } #egw_fw_header { diff --git a/pixelegg/head.tpl b/pixelegg/head.tpl index a19c8ec9e6..a04542ee58 100644 --- a/pixelegg/head.tpl +++ b/pixelegg/head.tpl @@ -31,35 +31,25 @@
-
- -
{topmenu_items}
- +
+ {topmenu_items} + {powered_by}
-
- - -
-
{topmenu_info_items}
-
+
+
+ {topmenu_info_items}
0
-
+
- -
- +
-
- - - diff --git a/pixelegg/js/fw_pixelegg.js b/pixelegg/js/fw_pixelegg.js index 2b2b556837..8a5e28f955 100644 --- a/pixelegg/js/fw_pixelegg.js +++ b/pixelegg/js/fw_pixelegg.js @@ -32,7 +32,7 @@ { var height = this._super.apply(this, arguments); - return height - 28; + return height; } }); @@ -50,8 +50,9 @@ window.framework = new fw_pixelegg("egw_fw_sidemenu", "egw_fw_tabs", window.egw_webserverUrl, egw_setSideboxSize,"egw_fw_splitter", 255, 245); // should be identical to jdots_framework::(DEFAULT|MIN)_SIDEBAR_WIDTH window.callManual = window.framework.callManual; - jQuery('#egw_fw_print').click(function(){window.framework.print();}); - jQuery('#egw_fw_logout').click(function(){ window.framework.redirect(this.getAttribute('data-logout-url')); }); + jQuery('#topmenu_info_user_avatar').click(function(){window.framework.toggle_avatar_menu();}); + jQuery('#topmenu_info_print_title').click(function(){window.framework.print();}); + jQuery('#topmenu_info_logout').click(function(){ window.framework.redirect(this.getAttribute('data-logout-url')); }); jQuery('form[name^="tz_selection"]').children().on('change', function(){framework.tzSelection(this.value); return false;}); window.egw.link_quick_add('topmenu_info_quick_add'); diff --git a/pixelegg/less/layout_messages.less b/pixelegg/less/layout_messages.less index 46b27dc622..6b80ab13a7 100755 --- a/pixelegg/less/layout_messages.less +++ b/pixelegg/less/layout_messages.less @@ -315,9 +315,6 @@ div#egwpopup_message { // Container für Meldungen / Message Container .egw_fw_ui_app_header_container { - border-width: 1px 0px 0px 0px; - border-style: solid; - border-color: @gray_30; height: auto; // Statusmeldung diff --git a/pixelegg/less/layout_raster_buttons.less b/pixelegg/less/layout_raster_buttons.less index 25ed6a40ed..9139195566 100644 --- a/pixelegg/less/layout_raster_buttons.less +++ b/pixelegg/less/layout_raster_buttons.less @@ -18,133 +18,63 @@ @import (reference) "definitions.less"; - -/*################################################# - Add / Print / Logout / - - Name / Date -###################################################*/ -/*#egw_fw_topmenu_addons{}*/ - - - -// Button Logout -#egw_fw_logout { - background-image: url(../images/logout.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 1em; - margin-top: 0px; - z-index: 200; - .Button_size_square_16; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - position: fixed; - right: 0px; - - - &:hover {.box_shadow_standard_light_hover;} - &:active {.Complete_Button_active;} - &:focus {.box_shadow_standard_light_inset;} -} - - - -// Button Print - -#egw_fw_print { - background-image: url(../images/print.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 5px; - margin-top: 0px; - position: fixed; - .Button_size_square_16; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - right: 40px; - z-index: 200; - &:hover {.box_shadow_standard_light_hover;} - &:active {.Complete_Button_active;} - &:focus {.box_shadow_standard_light_inset;} - -} - - -/*################################################# -/* Second Line -/* e.g. Name / Datum / angemeldete User -###################################################*/ - - #egw_fw_topmenu_info_items { - - // move to bottom of the page - position: fixed; - z-index: 1000; - bottom: 2px; - right: 5px; - padding-right: 20px; - - - .topmenu_info_item { - - overflow: visible; display: inline-block; + height: 45px; + position: absolute; + padding-right: 2px; + right: 0px; + z-index: 1000; + background-color: #fbfbfb; + .topmenu_info_item { + height: 45px; + width: 45px; + border-left: 1px solid #bfc0bf; + display: inline-block; + padding-left: 3px; + float: right; + background-size: 20px; + background-position: center center; + background-repeat: no-repeat; + cursor: pointer; + &:hover { + background-color: @color_hover_row; + } + } + #topmenu_info_user_avatar { + span { + height: 40px; + width: 40px; + display: inline-block; + border: none; + margin-top: 2px; + margin-left: 1px; + img { + width: 40px; + } + } + } - // Info Bell - &:nth-child(1) { - } + #topmenu_info_logout { + background-image: url(../images/logout.svg); + a { + width:45px; + height: 45px; + display: inline-block; + } + } - // Name - &:nth-child(2) { - /*float: right;*/ - margin-top: 0; - font-size: 1em; - padding-right: 5px; - - } - - // angemeldete User - &:nth-child(3) { - position: relative; - top: 0px; - display: inline-block; - - &:hover {.box_shadow_standard_light_hover;} - &:focus {.box_shadow_standard_light_inset;} - - /*&:before {content: "";font-size: 1em;color: @egw_color_2_a;}*/ - - } - - // Add - &:nth-child(4) { - - } - - } - - /*Notification*/ + #topmenu_info_print_title { + background-image: url(../images/print.svg); + span { + width: 45px; + height: 45px; + display: inline-block; + } + } + /*Notification*/ #topmenu_info_notifications {} - /*user info*/ - #topmenu_info_user_info { - display: inline-block; - } /*current user info*/ #topmenu_info_current_users {} @@ -159,28 +89,15 @@ /*quick*/ #topmenu_info_quick_add { - - // ############################################################################## - // quick_add - // Fist you see an ADD Icon, via Mouseover it expand right, to an select field - span#quick_add { - /*border: 1px solid rgba(0, 0, 0, 0.15);*/ - /*box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);*/ float: right; - padding: 0.5em; - position: fixed; - right: 80px; - top: 5px; - background-image: url(../images/add.svg); background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 4px 4px; - - .border_radius_button_normal; - .dimension_width_height_s; - + background-size: 24px; + background-position: center; + width: 45px; + height: 45px; + padding-right: 3px; &:before { content: " "; font-size: 2em; @@ -188,9 +105,6 @@ line-height: 0.6em; background-color: white; } - - &:hover {.box_shadow_standard_light_hover;} - &:focus {.box_shadow_standard_light_inset;} } // ############################################################################## @@ -198,23 +112,24 @@ // ADD different APPs .chzn-container { + position: fixed; - right: 15px !important; - top: 40px; + right: 93px !important; + top: 47px; width: 160px !important; background: @gray_0; &:before { content: ''; position: absolute; - bottom: 50%; + bottom: 51%; left: 42%; width: 0; - height: 0; - border-left: 15px solid transparent; + height: 0px; + border-left: 14px solid transparent; border-right: 15px solid transparent; border-bottom: 12px solid #aaa; margin-bottom: 12px; - margin-left: 0px; + margin-left: 1px; } &:after { content: ''; @@ -229,6 +144,14 @@ margin-bottom: 11px; } .chzn-single span {display: none;} + a.chzn-single.chzn-default { + border: 1px solid #bfc0bf; + border-radius: 0px; + } + .chzn-drop { + border-radius: 0px; + margin-top: -2px; + } } diff --git a/pixelegg/less/layout_raster_header.less b/pixelegg/less/layout_raster_header.less index c86fae9d33..17a203ee37 100644 --- a/pixelegg/less/layout_raster_header.less +++ b/pixelegg/less/layout_raster_header.less @@ -24,7 +24,8 @@ width: 100%; float: left; - + position: absolute; + border-bottom: 1px solid silver; /* Logo EGW or Company - left top*/ #egw_divLogo { float: left; @@ -62,52 +63,71 @@ } #egw_fw_topmenu{ + position: absolute; + display: none; + right: 5px; + width: 230px; + z-index: 1000; + top: 46px; + background: white; + .box_shadow; + #egw_fw_topmenu_info_items { + display: inline-block; + background: white; + float: right; + height: auto; + padding-left: 10px; + border-top: 1px solid silver; + .topmenu_info_item { + overflow: visible; + display: inline-block; + &:nth-child(2) { + margin-top: 0; + font-size: 1em; + } + &:nth-child(3) { + position: relative; + top: 0px; + padding-left: 3px; + display: inline-block; + } + } + } #egw_fw_topmenu_items { - float: left; padding-top: 14px; - width: 70%; + width: 100%; + display: block; + float: right; + background: white; + height: auto; + z-index: 1000; + top: 45px; ul { - margin: 5px 2px; + width: 100%; + padding: 0px; + display: inline-grid; li{ color: @gray_0; - /*.Button_size_square_32;*/ padding: 8px 10px; - /*.Complete_Button_normal;*/ - /*background-color: @gray_10;*/ - - - &:hover{.Complete_Button_hover; color: @gray_0;} - &:active {.Complete_Button_active;} - .transition (0.2s, ease-out); - + border-top: @gray_10; + &:hover{ background: @color_hover_row;color: @gray_0;} a { color: @gray_100; text-decoration: none; - .dimension_height_l; - /*font-size: 1.1em;*/ .fontsize_l; line-height: 1.5em; display:inline-block; - &:hover { - /*color: @gray_10;*/ - border-color: @gray_50; text-decoration: none !important; } - - &:before { - /*.img_filter_gray;*/ - /*-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);*/ - /*-webkit-filter: invert(100%);*/ - } } } /*Home*/ li:first-child{ - margin-left: 10px; + :before{border: none;} } @@ -172,6 +192,13 @@ padding-left: 20px; background-image: url(../images/topmenu_items/logout.svg); } + /*print*/ + a#topmenu_print{ + background-repeat: no-repeat; + background-size:16px; + padding-left: 20px; + background-image: url(../images/print.svg); + } } // Ende ul } // Ende Items } // Ende Topmenu diff --git a/pixelegg/less/layout_raster_main.less b/pixelegg/less/layout_raster_main.less index e8a14b48f7..d3b347f608 100644 --- a/pixelegg/less/layout_raster_main.less +++ b/pixelegg/less/layout_raster_main.less @@ -36,7 +36,15 @@ // ## ## # /* ##################################################################################################### */ - +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { + #egw_fw_main { + #egw_fw_tabs { + .egw_fw_ui_tabs_header { + padding-left: 235px; + } + } + } +} #egw_fw_main { padding: 0; width: auto; @@ -58,153 +66,101 @@ background-color: transparent; float: left; width: 100%; - margin-top: 8px; - - - // ############################################################ - // Tabnavigation - // Statusmeldung - // definiert in layout_messages.less - // .egw_fw_ui_app_header_container { } - - - - // ######################tabs header ########################## - // # # # # # # # # # #### - // # # # # # # # # # #### - // # tab header # # # # # # # #### - // # # # # # # # # # #### - // ############################################################ - // Div um Tabs - .egw_fw_ui_tabs_header { - margin: 0px 0 0 0; - padding: 1px 1px 0px 0px; - background-position: bottom; - background-repeat: repeat-x; - background-color: transparent; - height: 34px; - - h1 { - /*float: left;*/ - display: inline; - width: 100%; - text-align: center; - -webkit-margin-before: 0; - -webkit-margin-after: 0; - } - - img{ - text-align:center; - float: none; - margin: 0 auto; - .dimension_width_height_s; - } - - // Tab - // ########## - // # # - // # # - // ########## - // inaktive - - .egw_fw_ui_tab_header { - padding-left: 0; - position: relative; - display: inline-block; + margin: 0px 0 0 0; + padding: 0px 150px 0px 60px; + background-position: bottom; + background-repeat: repeat-x; + background-color: transparent; + height: 39px; + h1 { + display: inline; + width: 100%; + text-align: center; + -webkit-margin-before: 0; + -webkit-margin-after: 0; + } + img{ + text-align:center; + float: none; + margin: 0 auto; + .dimension_width_height_s; + } + .egw_fw_ui_tab_header { + padding-left: 0; + position: relative; + display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - margin: 0px 5px 0px 0px; - padding: 2px 5px 7px 2px; - cursor: pointer; - border-width: 1px 1px 0 1px; - border-style: solid; - border-color: @gray_30;; - background-repeat:repeat-x; - height: 24px; + margin: 0px 5px 0px 0px; + padding: 0px 5px 0px 0px; + cursor: pointer; + background-repeat:repeat-x; + height: 100%; + &:hover { + background-color: @color_hover_row; + padding-bottom: 0px; + padding-top: 8px; + } - &:hover { - /*.background_color_20_gray ;*/ - background-color: @color_hover_row; - } + // APP Name + h1 { + .fontsize_m; + line-height: 1em; + margin:0 15px 2px 2px; + vertical-align: super; + } - // APP Name - h1 { - /*font-size: 100%;*/ - .fontsize_m; - line-height: 1em; - margin:0 15px 2px 2px; - vertical-align: super; - } + // Images + img.egw_fw_ui_tab_icon { + display: inline-block; + .dimension_width_height_s; + margin: 5px 1px 0 1em; - // Images - img.egw_fw_ui_tab_icon { - display: inline-block; - .dimension_width_height_s; - margin: 5px 1px 0 1em; - - .img_filter_gray; - } - - // FOR SVG IMG - object { - .dimension_width_height_s; - /*background-color: @gray_0;*/ - margin: 8px 1px 0 5px; - .border_radius(5px,0, 0, 5px); - - - } - - - } + .img_filter_gray; + } + } // ########## // # # // # # // ########## /*aktive Tabs*/ - .egw_fw_ui_tab_header_active { - border-bottom: 1px solid white !important; - .background_color_0_gray ; - background-image:none !important; - padding-bottom:8px; - &:hover {.background_color_0_gray ;} - - - // aktive Bilder - img.egw_fw_ui_tab_icon { - display: inline-block; - .dimension_width_height_s; - } - /*aktive Objekte*/ - object { - .dimension_width_height_m; - margin: 0px 1px 0 5px; - .border_radius(2px,0, 0, 2px); - - background-color: @gray_30; - } - } + .egw_fw_ui_tab_header_active { + border-left: 1px solid #bfc0bf; + border-right: 1px solid #bfc0bf; + border-bottom: 4px solid white !important; + .background_color_0_gray ; + background-image:none !important; + &:hover { + .background_color_0_gray; + padding-top: 0px; + } + // aktive Bilder + img.egw_fw_ui_tab_icon { + display: inline-block; + .dimension_width_height_s; + } + } } - // ################# - // # close x # - // # # - // ################# - .egw_fw_ui_tab_close_button { - right: 3px; - top: 1px; - display: inline-block; - .dimension_width_height_xs; - margin-left: 0px; - background-repeat: no-repeat; - background-position: center; - background-image: url(../images/close.svg); - background-size: 6px 6px; - position: absolute; - } + // ################# + // # close x # + // # # + // ################# + .egw_fw_ui_tab_close_button { + right: 3px; + top: 1px; + display: inline-block; + .dimension_width_height_xs; + margin-left: 0px; + background-repeat: no-repeat; + background-position: center; + background-image: url(../images/close.svg); + background-size: 6px 6px; + position: absolute; + } // Ende Tabs } @@ -227,15 +183,11 @@ // ############################################################ .egw_fw_ui_tab_content { - - width: 100%; padding: 0px; margin: 0; overflow-x: hidden; overflow-y: hidden; - - > div { width: 100%; padding: 0 0 0 0; diff --git a/pixelegg/less/layout_raster_scrollarea.less b/pixelegg/less/layout_raster_scrollarea.less index 9e786fbc2c..4b18a97cc8 100644 --- a/pixelegg/less/layout_raster_scrollarea.less +++ b/pixelegg/less/layout_raster_scrollarea.less @@ -53,7 +53,6 @@ #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { top: 7px !important; - #egw_fw_toggler {top:1px;} .egw_fw_ui_sidemenu_entry_header_active { position: fixed; top: 50px; diff --git a/pixelegg/less/layout_raster_sidebar.less b/pixelegg/less/layout_raster_sidebar.less index 3127741e99..28c5bfed16 100644 --- a/pixelegg/less/layout_raster_sidebar.less +++ b/pixelegg/less/layout_raster_sidebar.less @@ -26,9 +26,9 @@ #egw_fw_sidebar { position: fixed; overflow: hidden; - top: 49px; + top: 38px; left: 0px; - bottom: 25px; + bottom: 0px; width: 225px; /*.background_color_5_gray;*/ @@ -36,8 +36,8 @@ #egw_fw_sidemenu { position: absolute; top: 1px; - bottom: 4px; - left: 4px; + bottom: 1px; + left: 0px; right: 8px; overflow: hidden; z-index: 0; @@ -285,23 +285,27 @@ top: 40px; bottom: 3px; right: 0px; - border-top:1px solid; border-left: 1px solid; border-color:@gray_30; &:hover {border-color: @gray_10;} } + + + // Ende Sidebar + +// Menu Seite links +} +#egw_fw_basecontainer { // Toggle menu #egw_fw_toggler { display: block; - width: 30px; - height: 30px; - position: relative; + width: 44px; + height: 44px; + position: absolute; z-index: 1; - top: 8px; - margin-top: 0; - margin-bottom: -30px; - float: right; + margin-top: 0px; + left: 256px; span { background-color: transparent; &:before{ @@ -317,16 +321,16 @@ &:before, &:after { content: ""; position: absolute; - left: 0; - top: -9px; - width:10px; - height: 2px; + left: 0px; + top: 3px; + width: 35px; + height: 4px; background-color: #606060; backface-visibility: hidden; border-radius: 2px; } &:after { - top:9px; + top:15px; transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -336,51 +340,59 @@ -webkit-transform: rotate(-145deg) translate(8px, 2px); background-color: #606060; } + background-color: transparent; position: relative; display: block; - width: 100%; + width: 35px; height: 5px; backface-visibility: hidden; border-radius: 2px; - top:11px; - left:10px; + top: 11px; + left: 10px; } } - #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { - top:-1px; - /* toggler button*/ - #egw_fw_toggler { - margin: 1px auto 4px; - float:none; - top: 5px; - span { +} + +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { + /* toggler button*/ + #egw_fw_toggler { + span { + background-color: #b4b4b4; + transition: all 0.3s; + -webkit-transition: all 0.3s; + -moz-transition: all 0.3s; + left:5px; + &:before, &:after { + transform:none; + -ms-transform: none; + -moz-transform: none; + -webkit-transform: none; + width:35px; + height:5px; background-color: #b4b4b4; - transition: all 0.3s; - -webkit-transition: all 0.3s; - -moz-transition: all 0.3s; - left:0; - &:before, &:after { - transform:none; - -ms-transform: none; - -moz-transform: none; - -webkit-transform: none; - width:100%; - height:5px; - background-color: #b4b4b4; - } } - &:hover { - span { + &:before { + top: 10px; + } + &:after { + top:20px; + } + } + &:hover { + span { + background-color: #606060; + &:before { + background-color: #606060; + } + &:after { background-color: #606060; - &:before { - background-color: #606060; - } - &:after { - background-color: #606060; - } } } } + } + + #egw_fw_sidemenu { + top:1px; /*sidebar adjustments*/ .egw_fw_ui_sidemenu_entry_content { @@ -407,12 +419,7 @@ } } } - // Ende Sidebar - -// Menu Seite links } - - /** DON"T MOVE THIS **/ .egw_fw_ui_splitter_vertical { background-image: url(../images/splitter_vert.png); diff --git a/pixelegg/mobile/fw_mobile.css b/pixelegg/mobile/fw_mobile.css index d50c56549e..2f2931a99c 100644 --- a/pixelegg/mobile/fw_mobile.css +++ b/pixelegg/mobile/fw_mobile.css @@ -3782,9 +3782,6 @@ div#egwpopup_message { background: #FFFFFF; } .egw_fw_ui_app_header_container { - border-width: 1px 0px 0px 0px; - border-style: solid; - border-color: #B4B4B4; height: auto; } .egw_fw_ui_app_header_container .egw_fw_ui_app_header { @@ -3947,6 +3944,8 @@ td.message span.message { #egw_fw_header { width: 100%; float: left; + position: absolute; + border-bottom: 1px solid silver; /* Logo EGW or Company - left top*/ /* ########################################################################################################################################### Topmenu / Home / Einstellungen / Zugriff / Kategorien usw.. @@ -3978,13 +3977,55 @@ td.message span.message { #egw_fw_header #egw_fw_topmenu_info_items { display: inline; } +#egw_fw_header #egw_fw_topmenu { + position: absolute; + display: none; + right: 5px; + width: 230px; + z-index: 1000; + top: 46px; + background: white; + box-shadow: 2px 3px 13px #666666; + -moz-box-shadow: 2px 3px 13px #666666; + -webkit-box-shadow: 2px 3px 13px #666666; + -khtml-box-shadow: 2px 3px 13px #666666; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items { + display: inline-block; + background: white; + float: right; + height: auto; + padding-left: 10px; + border-top: 1px solid silver; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item { + overflow: visible; + display: inline-block; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { + margin-top: 0; + font-size: 1em; +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { + position: relative; + top: 0px; + padding-left: 3px; + display: inline-block; +} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items { - float: left; padding-top: 14px; - width: 70%; + width: 100%; + display: block; + float: right; + background: white; + height: auto; + z-index: 1000; + top: 45px; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul { - margin: 5px 2px; + width: 100%; + padding: 0px; + display: inline-grid; /*Home*/ /*home*/ /*Setup / Einstellungen*/ @@ -3994,52 +4035,27 @@ td.message span.message { /*help*/ /*Search*/ /*logout*/ + /*print*/ } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li { color: #FFFFFF; - /*.Button_size_square_32;*/ padding: 8px 10px; - /*.Complete_Button_normal;*/ - /*background-color: @gray_10;*/ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - -o-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border-top: #E6E6E6; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - background-color: inherit; + background: rgba(153, 204, 255, 0.4); color: #FFFFFF; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a { color: #000000; text-decoration: none; - height: 32px; - /*font-size: 1.1em;*/ font-size: 12px; line-height: 1.5em; display: inline-block; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { - /*color: @gray_10;*/ - border-color: #828282; text-decoration: none !important; } -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:before { - /*.img_filter_gray;*/ - /*-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);*/ - /*-webkit-filter: invert(100%);*/ -} -#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child { - margin-left: 10px; -} #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child :before { border: none; } @@ -4093,6 +4109,12 @@ td.message span.message { padding-left: 20px; background-image: url(../images/topmenu_items/logout.svg); } +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_print { + background-repeat: no-repeat; + background-size: 16px; + padding-left: 20px; + background-image: url(../images/print.svg); +} /* ################################################### Slide Effekt ###################################################*/ @@ -4170,6 +4192,9 @@ td.message span.message { // ## ## # /* ##################################################################################################### */ +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { + padding-left: 235px; +} #egw_fw_main { padding: 0; width: auto; @@ -4185,19 +4210,17 @@ td.message span.message { background-color: transparent; float: left; width: 100%; - margin-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header { margin: 0px 0 0 0; - padding: 1px 1px 0px 0px; + padding: 0px 150px 0px 60px; background-position: bottom; background-repeat: repeat-x; background-color: transparent; - height: 34px; + height: 39px; /*aktive Tabs*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 { - /*float: left;*/ display: inline; width: 100%; text-align: center; @@ -4219,20 +4242,17 @@ td.message span.message { white-space: nowrap; text-overflow: ellipsis; margin: 0px 5px 0px 0px; - padding: 2px 5px 7px 2px; + padding: 0px 5px 0px 0px; cursor: pointer; - border-width: 1px 1px 0 1px; - border-style: solid; - border-color: #B4B4B4; background-repeat: repeat-x; - height: 24px; + height: 100%; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover { - /*.background_color_20_gray ;*/ background-color: rgba(153, 204, 255, 0.4); + padding-bottom: 0px; + padding-top: 8px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header h1 { - /*font-size: 100%;*/ font-size: 11px; line-height: 1em; margin: 0 15px 2px 2px; @@ -4254,59 +4274,22 @@ td.message span.message { filter: gray; /* IE 6-9 */ } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header object { - width: 16px; - height: 16px; - /*background-color: @gray_0;*/ - margin: 8px 1px 0 5px; - -webkit-border-top-right-radius: 5px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 5px; - -moz-border-radius-topright: 5px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 5px; - border-top-right-radius: 5px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 5px; - /*.background-clip(padding-box);*/ -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active { - border-bottom: 1px solid white !important; + border-left: 1px solid #bfc0bf; + border-right: 1px solid #bfc0bf; + border-bottom: 4px solid white !important; background-color: #ffffff; background-image: none !important; - padding-bottom: 8px; - /*aktive Objekte*/ } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active:hover { background-color: #ffffff; + padding-top: 0px; } #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active img.egw_fw_ui_tab_icon { display: inline-block; width: 16px; height: 16px; } -#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active object { - width: 24px; - height: 24px; - margin: 0px 1px 0 5px; - -webkit-border-top-right-radius: 2px; - -webkit-border-bottom-right-radius: 0; - -webkit-border-bottom-left-radius: 0; - -webkit-border-top-left-radius: 2px; - -moz-border-radius-topright: 2px; - -moz-border-radius-bottomright: 0; - -moz-border-radius-bottomleft: 0; - -moz-border-radius-topleft: 2px; - border-top-right-radius: 2px; - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - border-top-left-radius: 2px; - /*.background-clip(padding-box);*/ - background-color: #B4B4B4; -} #egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button { right: 3px; top: 1px; @@ -4357,9 +4340,9 @@ td.message span.message { #egw_fw_sidebar { position: fixed; overflow: hidden; - top: 49px; + top: 38px; left: 0px; - bottom: 25px; + bottom: 0px; width: 225px; /*.background_color_5_gray;*/ /*#################################*/ @@ -4367,8 +4350,8 @@ td.message span.message { #egw_fw_sidebar #egw_fw_sidemenu { position: absolute; top: 1px; - bottom: 4px; - left: 4px; + bottom: 1px; + left: 0px; right: 8px; overflow: hidden; z-index: 0; @@ -4561,36 +4544,33 @@ td.message span.message { top: 40px; bottom: 3px; right: 0px; - border-top: 1px solid; border-left: 1px solid; border-color: #B4B4B4; } #egw_fw_sidebar #egw_fw_splitter:hover { border-color: #E6E6E6; } -#egw_fw_sidebar #egw_fw_toggler { +#egw_fw_basecontainer #egw_fw_toggler { display: block; - width: 30px; - height: 30px; - position: relative; + width: 44px; + height: 44px; + position: absolute; z-index: 1; - top: 8px; - margin-top: 0; - margin-bottom: -30px; - float: right; + margin-top: 0px; + left: 256px; } -#egw_fw_sidebar #egw_fw_toggler span { +#egw_fw_basecontainer #egw_fw_toggler span { background-color: transparent; position: relative; display: block; - width: 100%; + width: 35px; height: 5px; backface-visibility: hidden; border-radius: 2px; top: 11px; left: 10px; } -#egw_fw_sidebar #egw_fw_toggler span:before { +#egw_fw_basecontainer #egw_fw_toggler span:before { transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4600,20 +4580,20 @@ td.message span.message { -webkit-transform: rotate(145deg) translate(8px, -2px); background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_toggler span:after { +#egw_fw_basecontainer #egw_fw_toggler span:before, +#egw_fw_basecontainer #egw_fw_toggler span:after { content: ""; position: absolute; - left: 0; - top: -9px; - width: 10px; - height: 2px; + left: 0px; + top: 3px; + width: 35px; + height: 4px; background-color: #606060; backface-visibility: hidden; border-radius: 2px; } -#egw_fw_sidebar #egw_fw_toggler span:after { - top: 9px; +#egw_fw_basecontainer #egw_fw_toggler span:after { + top: 15px; transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; @@ -4623,58 +4603,61 @@ td.message span.message { -webkit-transform: rotate(-145deg) translate(8px, 2px); background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn { - top: -1px; +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn { /* toggler button*/ - /*sidebar adjustments*/ } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler { - margin: 1px auto 4px; - float: none; - top: 5px; -} -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span { background-color: #b4b4b4; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; - left: 0; + left: 5px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before, +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; - width: 100%; + width: 35px; height: 5px; background-color: #b4b4b4; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before { + top: 10px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after { + top: 20px; +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after { background-color: #606060; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_content { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu { + top: 1px; + /*sidebar adjustments*/ +} +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_content { display: none !important; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header_active { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header_active { border-radius: 0 !important; width: auto !important; border: 0; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header { width: 50px; height: 35px; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header h1 { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header h1 { visibility: hidden; } -#egw_fw_sidebar #egw_fw_sidemenu.egw_fw_sidebar_toggleOn .egw_fw_ui_sidemenu_entry_header img { +#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header img { margin: 4px auto 0px !important; padding: 0 !important; float: none !important; @@ -4877,9 +4860,6 @@ td.message span.message { #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { top: 7px !important; } -#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { - top: 1px; -} #egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { position: fixed; top: 50px; @@ -4940,95 +4920,15 @@ td.message span.message { Created on : 23.07.2014, 13:25:11 Author : stefanreinhardt */ -/*################################################# - Add / Print / Logout / - - Name / Date -###################################################*/ -/*#egw_fw_topmenu_addons{}*/ -#egw_fw_logout { - background-image: url(../images/logout.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 1em; - margin-top: 0px; - z-index: 200; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - position: fixed; - right: 0px; -} -#egw_fw_logout:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_logout:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_logout:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print { - background-image: url(../images/print.svg); - background-size: 16px 16px; - background-position: center center; - background-repeat: no-repeat; - cursor: pointer; - display: inline-block; - float: right; - margin-right: 5px; - margin-top: 0px; - position: fixed; - width: 16px; - height: 16px; - /*.border_normal;*/ - /*.box_shadow_standard_light;*/ - /*.border_radius_button_normal;*/ - padding: 0.5em; - top: 5px; - right: 40px; - z-index: 200; -} -#egw_fw_print:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_print:active { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_print:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -/*################################################# -/* Second Line -/* e.g. Name / Datum / angemeldete User -###################################################*/ #egw_fw_topmenu_info_items { - position: fixed; + display: inline-block; + height: 45px; + position: absolute; + padding-right: 2px; + right: 0px; z-index: 1000; - bottom: 2px; - right: 5px; - padding-right: 20px; + background-color: #fbfbfb; /*Notification*/ - /*user info*/ /*current user info*/ /*current user info*/ /*time zone*/ @@ -5039,32 +4939,45 @@ td.message span.message { /* Opera and prob css3 final iteration */ } #egw_fw_topmenu_info_items .topmenu_info_item { - overflow: visible; + height: 45px; + width: 45px; + border-left: 1px solid #bfc0bf; + display: inline-block; + padding-left: 3px; + float: right; + background-size: 20px; + background-position: center center; + background-repeat: no-repeat; + cursor: pointer; +} +#egw_fw_topmenu_info_items .topmenu_info_item:hover { + background-color: rgba(153, 204, 255, 0.4); +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span { + height: 40px; + width: 40px; + display: inline-block; + border: none; + margin-top: 2px; + margin-left: 1px; +} +#egw_fw_topmenu_info_items #topmenu_info_user_avatar span img { + width: 40px; +} +#egw_fw_topmenu_info_items #topmenu_info_logout { + background-image: url(../images/logout.svg); +} +#egw_fw_topmenu_info_items #topmenu_info_logout a { + width: 45px; + height: 45px; display: inline-block; } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) { - /*float: right;*/ - margin-top: 0; - font-size: 1em; - padding-right: 5px; +#egw_fw_topmenu_info_items #topmenu_info_print_title { + background-image: url(../images/print.svg); } -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) { - position: relative; - top: 0px; - display: inline-block; - /*&:before {content: "";font-size: 1em;color: @egw_color_2_a;}*/ -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3):focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} -#egw_fw_topmenu_info_items #topmenu_info_user_info { +#egw_fw_topmenu_info_items #topmenu_info_print_title span { + width: 45px; + height: 45px; display: inline-block; } #egw_fw_topmenu_info_items form { @@ -5074,22 +4987,14 @@ td.message span.message { padding: 0px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add { - /*border: 1px solid rgba(0, 0, 0, 0.15);*/ - /*box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);*/ float: right; - padding: 0.5em; - position: fixed; - right: 80px; - top: 5px; background-image: url(../images/add.svg); background-repeat: no-repeat; - background-size: 20px 20px; - background-position: 4px 4px; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; - width: 16px; - height: 16px; + background-size: 24px; + background-position: center; + width: 45px; + height: 45px; + padding-right: 3px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before { content: " "; @@ -5098,35 +5003,25 @@ td.message span.message { line-height: 0.6em; background-color: white; } -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:hover { - -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); - box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); -} -#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:focus { - -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5); -} #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container { position: fixed; - right: 15px !important; - top: 40px; + right: 93px !important; + top: 47px; width: 160px !important; background: #FFFFFF; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before { content: ''; position: absolute; - bottom: 50%; + bottom: 51%; left: 42%; width: 0; - height: 0; - border-left: 15px solid transparent; + height: 0px; + border-left: 14px solid transparent; border-right: 15px solid transparent; border-bottom: 12px solid #aaa; margin-bottom: 12px; - margin-left: 0px; + margin-left: 1px; } #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after { content: ''; @@ -5143,6 +5038,14 @@ td.message span.message { #egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-single span { display: none; } +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container a.chzn-single.chzn-default { + border: 1px solid #bfc0bf; + border-radius: 0px; +} +#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-drop { + border-radius: 0px; + margin-top: -2px; +} #egw_fw_topmenu_info_items #topmenu_info_quick_add select#quick_add_selectbox { visibility: hidden; }