diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css index 01c32d9f99..e0e2e8f500 100644 --- a/pixelegg/css/pixelegg.css +++ b/pixelegg/css/pixelegg.css @@ -4243,10 +4243,8 @@ span.overlayContainer img.overlay { z-index: 1001; 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; + box-shadow: 0 2px 8px hsla(240, 3.8%, 46.1%, 0.12); + border: 1px solid hsl(240, 6%, 90%); } #egw_fw_header #egw_fw_topmenu a.powered_by { width: calc(100% - 20px); @@ -4343,13 +4341,16 @@ span.overlayContainer img.overlay { border-top: #E6E6E6; } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover { - background: rgba(153, 204, 255, 0.4); - color: #FFFFFF; + background: hsl(200, 98%, 39%); + color: hsl(0, 0%, 100%); +} +#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover a { + filter: invert(1) brightness(5); } #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a { color: #000000; text-decoration: none; - font-size: 12px; + font-size: 11px; padding-left: 26px; line-height: 1.5em; display: inline-block; diff --git a/pixelegg/less/def_colors.less b/pixelegg/less/def_colors.less index 757383383a..f5fc3552af 100644 --- a/pixelegg/less/def_colors.less +++ b/pixelegg/less/def_colors.less @@ -165,6 +165,11 @@ // Mouse over @color_hover_row : fade(@egw_color_hover, 40%); +@sl-color-menu: hsl(0, 0%, 100%); +@sl-bg-color-menu: hsl(200, 98%, 39%); +@sl-filter-menu: invert(1) brightness(5); +@sl-box-shadow-menu: 0 2px 8px hsl(240 3.8% 46.1% / 12%); +@sl-border-menu: 1px solid hsl(240deg 6% 90%); /* Dialog Button panel Background Color*/ @color_button_panel_bg_color : @egw_color_2_e; diff --git a/pixelegg/less/layout_dhtmlSubmenu.less b/pixelegg/less/layout_dhtmlSubmenu.less index 31a96e06cb..9b78f8d9cd 100644 --- a/pixelegg/less/layout_dhtmlSubmenu.less +++ b/pixelegg/less/layout_dhtmlSubmenu.less @@ -29,13 +29,13 @@ div.dhtmlxMenu_egw_SubLevelArea_Polygon{ tr.sub_item_selected { td.sub_item_icon { img.sub_icon { - filter: invert(1) brightness(5); + filter: @sl-filter-menu; } } - background-color: hsl(200deg 98% 39%) !important; + background-color: @sl-bg-color-menu !important; background-image: none !important; div.sub_item_text, td.sub_item_hk div.sub_item_hk { - color: hsl(0deg 0% 100%); + color: @sl-color-menu; } } div.sub_sep { diff --git a/pixelegg/less/layout_raster_header.less b/pixelegg/less/layout_raster_header.less index fd034cad06..de68fb9cb1 100644 --- a/pixelegg/less/layout_raster_header.less +++ b/pixelegg/less/layout_raster_header.less @@ -64,7 +64,8 @@ z-index: 1001; top: 46px; background: white; - .box_shadow; + box-shadow: @sl-box-shadow-menu; + border: @sl-border-menu; a.powered_by { width: ~"calc(100% - 20px)"; display: inline-block; @@ -162,11 +163,15 @@ color: @gray_0; padding: 8px 10px; border-top: @gray_10; - &:hover{ background: @color_hover_row;color: @gray_0;} + &:hover{ + background: @sl-bg-color-menu; + color: @sl-color-menu; + a {filter:@sl-filter-menu} + } a { color: @gray_100; text-decoration: none; - .fontsize_l; + .fontsize_m; padding-left: 26px; line-height: 1.5em; display:inline-block;