From c6527ff2a43e15c93d925dfcdbacf32691dc9bf4 Mon Sep 17 00:00:00 2001 From: Stefan Reinhardt Date: Wed, 16 Jul 2014 11:24:38 +0000 Subject: [PATCH] pixelegg / less cleanup less files separate the definitions in different files merge them in definitions.less ### same with layout_ files / merge in layout_defintions.less # change all app.less files --- pixelegg/less/def_borderRadius.less | 42 ++ pixelegg/less/def_borders.less | 32 + pixelegg/less/def_boxShadow.less | 75 ++ pixelegg/less/def_buttonSize.less | 39 + pixelegg/less/def_buttons.less | 2 +- pixelegg/less/def_colors.less | 194 +++++ .../def_design_pattern_color_font_shadow.less | 706 +----------------- pixelegg/less/def_dimension.less | 60 ++ pixelegg/less/def_fonts.less | 36 + pixelegg/less/def_gradient.less | 165 ++++ pixelegg/less/def_lessElements.less | 172 +++++ pixelegg/less/def_transparency.less | 44 ++ pixelegg/less/definitions.less | 53 ++ pixelegg/less/layout_ajaxLoader.less | 26 + pixelegg/less/layout_buttons.less | 172 +++++ pixelegg/less/layout_chosen.less | 3 +- pixelegg/less/layout_clientSideJsError.less | 48 ++ pixelegg/less/layout_content_elements.less | Bin 21944 -> 3696 bytes pixelegg/less/layout_definitions.less | 59 ++ pixelegg/less/layout_dhtmlSubmenu.less | 36 + pixelegg/less/layout_dialog.less | 5 +- pixelegg/less/layout_footer.less | 3 +- pixelegg/less/layout_headlines.less | 92 +++ pixelegg/less/layout_lettersearch.less | 45 ++ pixelegg/less/layout_loginPage.less | 5 +- pixelegg/less/layout_messages.less | 5 +- pixelegg/less/layout_overlay.less | 53 ++ pixelegg/less/layout_raster.less | 3 +- pixelegg/less/layout_reset.less | 119 +++ pixelegg/less/layout_sbHolder.less | 141 ++++ pixelegg/less/layout_svgFilter.less | 29 + pixelegg/less/layout_table.less | 8 +- pixelegg/less/layout_traditional.less | 323 ++++++++ pixelegg/less/magicsuggest.less | 3 +- pixelegg/less/svg.css | 8 +- pixelegg/less/svg.less | 12 +- 36 files changed, 2086 insertions(+), 732 deletions(-) create mode 100644 pixelegg/less/def_borderRadius.less create mode 100644 pixelegg/less/def_borders.less create mode 100644 pixelegg/less/def_boxShadow.less create mode 100644 pixelegg/less/def_buttonSize.less create mode 100644 pixelegg/less/def_colors.less create mode 100644 pixelegg/less/def_dimension.less create mode 100644 pixelegg/less/def_fonts.less create mode 100644 pixelegg/less/def_gradient.less create mode 100644 pixelegg/less/def_lessElements.less create mode 100644 pixelegg/less/def_transparency.less create mode 100644 pixelegg/less/definitions.less create mode 100644 pixelegg/less/layout_ajaxLoader.less create mode 100644 pixelegg/less/layout_buttons.less create mode 100644 pixelegg/less/layout_clientSideJsError.less create mode 100644 pixelegg/less/layout_definitions.less create mode 100644 pixelegg/less/layout_dhtmlSubmenu.less create mode 100644 pixelegg/less/layout_headlines.less create mode 100755 pixelegg/less/layout_lettersearch.less create mode 100644 pixelegg/less/layout_overlay.less create mode 100644 pixelegg/less/layout_reset.less create mode 100644 pixelegg/less/layout_sbHolder.less create mode 100644 pixelegg/less/layout_svgFilter.less create mode 100755 pixelegg/less/layout_traditional.less diff --git a/pixelegg/less/def_borderRadius.less b/pixelegg/less/def_borderRadius.less new file mode 100644 index 0000000000..525560ed3b --- /dev/null +++ b/pixelegg/less/def_borderRadius.less @@ -0,0 +1,42 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all border radius + + */ +@import "definitions.less"; + +/*#####################################################################*/ +/* Radius*/ + +.border_radius_button_lefttop { + -webkit-border-radius: 3px; + -webkit-border-top-left-radius: 10px; + -moz-border-radius: 3px; + -moz-border-radius-topleft: 10px; + border-radius: 3px; + border-top-left-radius: 10px; +} + +.border_radius_button_righttop { + -webkit-border-radius: 3px; + -webkit-border-top-right-radius: 20px; + -moz-border-radius: 3px; + -moz-border-radius-topright: 20px; + border-radius: 3px; + border-top-right-radius: 20px; +} + +.border_radius_button_normal { + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; +} diff --git a/pixelegg/less/def_borders.less b/pixelegg/less/def_borders.less new file mode 100644 index 0000000000..057306ca79 --- /dev/null +++ b/pixelegg/less/def_borders.less @@ -0,0 +1,32 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all borders + + */ +@import "definitions.less"; + + // Rahmen für Schaltflächen + +.border_normal{ + border: 1px solid rgba(0, 0, 0, 0.15); +} + +.border_hover{ + border: 1px solid rgba(0, 0, 0, 0.5); +} +.border_active{ + border: 1px solid rgba(0, 0, 0, 0.9); +} + +.border_none{ + border: 0px solid rgba(0, 0, 0, 0.9); +} \ No newline at end of file diff --git a/pixelegg/less/def_boxShadow.less b/pixelegg/less/def_boxShadow.less new file mode 100644 index 0000000000..95f86ef4d6 --- /dev/null +++ b/pixelegg/less/def_boxShadow.less @@ -0,0 +1,75 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all box shadows + + */ +@import "definitions.less"; + +// Box Shadow +// none +.box_shadow_none { + -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); + -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); + box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); +} + +// auf hellem Hintergrund + +.box_shadow_standard_light { + -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); + box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); +} + +// wird dunkler + +.box_shadow_standard_light_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); + +} + +// für focus und active + +.box_shadow_standard_light_inset { + -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); +} + +.box_shadow_standard_light_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); +} + + +.box_shadow_message { + -webkit-box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); + box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); +} + +// Rahmen für Dialoge + +.box_shadow_edit_dialog { + + -moz-box-shadow: inset 0 0 5px 5px #888; + -webkit-box-shadow: inset 0 0 5px 5px #888; + box-shadow: inset 0 0 5px 5px #888; + + margin: 5px ; + padding: 0%; + width: 100%; +} + diff --git a/pixelegg/less/def_buttonSize.less b/pixelegg/less/def_buttonSize.less new file mode 100644 index 0000000000..3f9586e914 --- /dev/null +++ b/pixelegg/less/def_buttonSize.less @@ -0,0 +1,39 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all buttons sizes + + */ +@import "definitions.less"; + +// ############################# +// Button Größen + +.Button_size_square_32{ + width: 32px; + height: 32px; + +} + +.Button_size_square_16{ + width: 16px; + height: 16px; +} + +.Button_size_square_8{ + width: 8px; + height: 8px; +} + +.Button_size_h32_auto{ + width: auto; + height: 32px; +} diff --git a/pixelegg/less/def_buttons.less b/pixelegg/less/def_buttons.less index 198f1ff66a..cdac383f90 100755 --- a/pixelegg/less/def_buttons.less +++ b/pixelegg/less/def_buttons.less @@ -12,7 +12,7 @@ * @version $Id$ */ -@import (reference) "def_design_pattern_color_font_shadow.less"; +@import "definitions.less"; diff --git a/pixelegg/less/def_colors.less b/pixelegg/less/def_colors.less new file mode 100644 index 0000000000..8b15113a22 --- /dev/null +++ b/pixelegg/less/def_colors.less @@ -0,0 +1,194 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all used colors + + */ +@import "definitions.less"; + + // Basic colour +// CI EGW + +// Orange +@egw_color_1 : rgb(255, 194, 0); // #ffc200 + +@egw_color_1_a : #ffc200; +@egw_color_1_b : #BF9D30; +@egw_color_1_c : #A67E00; +@egw_color_1_d : #FFD140; +@egw_color_1_e : #FFDD73; // li:selected + +// BLUE +@egw_color_2_a : #0C5DA5; +@egw_color_2_b : #26537C; +@egw_color_2_c : #043A6B; +@egw_color_2_d : #408DD2; +@egw_color_2_e : #679FD2; // li:current + + +// Lila +@egw_color_3_a : #560EAD; +@egw_color_3_b : #512882; +@egw_color_3_c : #360570; +@egw_color_3_d : #8643D6; +@egw_color_3_e : #9B6AD6; + + + + +@egw_color_blue : #1D1AB2; + +@egw_color_blue_lighter : #0B5FA4 ; + +@egw_color_blue_lightest : #679FD2; //#66A1D2; + +//Berechnung der EGW Farben + +.background_color_egw_normal {background-color : @egw_color_1_a !important;} +.background_color_egw_light {background-color : @egw_color_1_d;} +.background_color_egw_lighter {background-color : @egw_color_1_e;} +.background_color_egw_dark {background-color : @egw_color_2_a;} +.background_color_egw_darker {background-color : @egw_color_2_b;} + + +// greyscale +@gray : #000000; // Base colur is black + +/*@gray-100 : #000000;*/ +@gray_100 : #000000; +@gray_90 : #1E1E1E; +@gray_80 : #373737; +@gray_70 : #505050; +@gray_60 : #696969; +@gray_50 : #828282; +@gray_40 : #9B9B9B; +@gray_30 : #B4B4B4; +@gray_20 : #CDCDCD; +@gray_10 : #E6E6E6; +@gray_5 : #F2F2F2; +@gray_0 : #FFFFFF; + + +.color_0_gray { color : lighten(@gray, 100%);} // white + +.color_5_gray { color : lighten(@gray, 95%);} +.color_10_gray { color : lighten(@gray, 90%);} +.color_15_gray { color : lighten(@gray, 85%);} +.color_20_gray { color : lighten(@gray, 80%);} +.color_25_gray { color : lighten(@gray, 75%);} +.color_30_gray { color : lighten(@gray, 70%);} +.color_40_gray { color : lighten(@gray, 60%);} +.color_50_gray { color : lighten(@gray, 50%);} +.color_60_gray { color : lighten(@gray, 40%);} +.color_70_gray { color : lighten(@gray, 30%);} +.color_80_gray { color : lighten(@gray, 20%);} +.color_90_gray { color : lighten(@gray, 10%);} +.color_100_gray { color : @gray; } // black + +@lightgray : @gray*010101; +/*@darkgrey : .color_90_gray;*/ + +// grey fpr background + +.background_color_0_gray { background-color : lighten(@gray, 100%);} +.background_color_5_gray { background-color : lighten(@gray, 98%); } +.background_color_10_gray { background-color : lighten(@gray, 94%); } +.background_color_15_gray { background-color : lighten(@gray, 85%); } +.background_color_20_gray { background-color : lighten(@gray, 80%); } +.background_color_25_gray { background-color : lighten(@gray, 75%); } +.background_color_30_gray { background-color : lighten(@gray, 70%) !important; } +.background_color_40_gray { background-color : lighten(@gray, 60%); } +.background_color_50_gray { background-color : lighten(@gray, 50%); } + + +// Warning +@red: #FF0000; +@color_warning : @red; + + +// ERROR +@color_error : #AE1D00; + + +// Test Colour for debug +@yellow : #FFD40F; + +// Link Colours +@link_color : @egw_color_2_b; +@link_color_active: fade(@egw_color_2_b, 60%); + +// soll EGROUPWARE FARBE GEBEN +/*@active_button_border_bottom : @egw_color_2_d;*/ + +// Hint / or have to do / must field +@color_hint : #189800; //@egw_color_2_a; + +// Tooltipp / or have to do / must field +@color_tooltip : lighten(@egw_color_1_e, 90%); + +/*optional / can field*/ +@color_optional : fade(@egw_color_1_e, 10%); + + + +/*Listenausgabe*/ + +@color_even : @gray_0; +@color_odd : darken(@gray_0, 5%); + + +// aktiverte Zeilen in allen APP mit Listenausgabe +@color_active_row : fade(@egw_color_1_a, 1%); + +// not in use +@color_selected_row : @egw_color_1_e; + +// Mouse over +@color_hover_row : fade(@egw_color_2_e, 20%); + + +/* Dialog Button panel Background Color*/ +@color_button_panel_bg_color : @egw_color_2_e; + + + /*Button edit + save + apply + copy = positive action */ +@color_positive_action : #189800; // green +@color_positive_action_hover : fade(#189800, 2%); // green +@color_positive_action_active : lighten(#189800, 2%); // green + + + /*Button cancel = do nothing action */ +@color_cancel_action : #F5B301; +@color_cancel_action_hover : lighten(#F5B301, 0%); +@color_cancel_action_active : lighten(#F5B301, 15%); + + /*Button delete = negative action */ +@color_negative_action : #AE1D00; +@color_negative_action_hover : lighten(#AE1D00, 2%); +@color_negative_action_active : lighten(#AE1D00, 10%); + + + + + +@color_splitter_bar : @egw_color_1_a; +@color_splitter_bar_hover : @egw_color_1_a; +@color_splitter_bar_active : @egw_color_1_a; + +// Search Button + +.background_color_search {background-color : @gray_30; } + + +// cal Heute // in Sidebar +.background_table_cal_head { background-color : @egw_color_1_a;} + +@color_progress : @egw_color_1_e; diff --git a/pixelegg/less/def_design_pattern_color_font_shadow.less b/pixelegg/less/def_design_pattern_color_font_shadow.less index f74060ceaf..74cd1e293a 100755 --- a/pixelegg/less/def_design_pattern_color_font_shadow.less +++ b/pixelegg/less/def_design_pattern_color_font_shadow.less @@ -12,708 +12,4 @@ * @version $Id$ */ -// Basic colour -// CI EGW - -// Orange -@egw_color_1 : rgb(255, 194, 0); // #ffc200 - -@egw_color_1_a : #ffc200; -@egw_color_1_b : #BF9D30; -@egw_color_1_c : #A67E00; -@egw_color_1_d : #FFD140; -@egw_color_1_e : #FFDD73; // li:selected - -// BLUE -@egw_color_2_a : #0C5DA5; -@egw_color_2_b : #26537C; -@egw_color_2_c : #043A6B; -@egw_color_2_d : #408DD2; -@egw_color_2_e : #679FD2; // li:current - - -// Lila -@egw_color_3_a : #560EAD; -@egw_color_3_b : #512882; -@egw_color_3_c : #360570; -@egw_color_3_d : #8643D6; -@egw_color_3_e : #9B6AD6; - - - - -@egw_color_blue : #1D1AB2; - -@egw_color_blue_lighter : #0B5FA4 ; - -@egw_color_blue_lightest : #679FD2; //#66A1D2; - -//Berechnung der EGW Farben - -.background_color_egw_normal {background-color : @egw_color_1_a !important;} -.background_color_egw_light {background-color : @egw_color_1_d;} -.background_color_egw_lighter {background-color : @egw_color_1_e;} -.background_color_egw_dark {background-color : @egw_color_2_a;} -.background_color_egw_darker {background-color : @egw_color_2_b;} - - -// greyscale -@gray : #000000; // Base colur is black - -/*@gray-100 : #000000;*/ -@gray_100 : #000000; -@gray_90 : #1E1E1E; -@gray_80 : #373737; -@gray_70 : #505050; -@gray_60 : #696969; -@gray_50 : #828282; -@gray_40 : #9B9B9B; -@gray_30 : #B4B4B4; -@gray_20 : #CDCDCD; -@gray_10 : #E6E6E6; -@gray_5 : #F2F2F2; -@gray_0 : #FFFFFF; - - -.color_0_gray { color : lighten(@gray, 100%);} // white - -.color_5_gray { color : lighten(@gray, 95%);} -.color_10_gray { color : lighten(@gray, 90%);} -.color_15_gray { color : lighten(@gray, 85%);} -.color_20_gray { color : lighten(@gray, 80%);} -.color_25_gray { color : lighten(@gray, 75%);} -.color_30_gray { color : lighten(@gray, 70%);} -.color_40_gray { color : lighten(@gray, 60%);} -.color_50_gray { color : lighten(@gray, 50%);} -.color_60_gray { color : lighten(@gray, 40%);} -.color_70_gray { color : lighten(@gray, 30%);} -.color_80_gray { color : lighten(@gray, 20%);} -.color_90_gray { color : lighten(@gray, 10%);} -.color_100_gray { color : @gray; } // black - -@lightgray : @gray*010101; -/*@darkgrey : .color_90_gray;*/ - -// grey fpr background - -.background_color_0_gray { background-color : lighten(@gray, 100%);} -.background_color_5_gray { background-color : lighten(@gray, 98%); } -.background_color_10_gray { background-color : lighten(@gray, 94%); } -.background_color_15_gray { background-color : lighten(@gray, 85%); } -.background_color_20_gray { background-color : lighten(@gray, 80%); } -.background_color_25_gray { background-color : lighten(@gray, 75%); } -.background_color_30_gray { background-color : lighten(@gray, 70%) !important; } -.background_color_40_gray { background-color : lighten(@gray, 60%); } -.background_color_50_gray { background-color : lighten(@gray, 50%); } - - -// Warning -@red: #FF0000; -@color_warning : @red; - - -// ERROR -@color_error : #AE1D00; - - -// Test Colour for debug -@yellow : #FFD40F; - -// Link Colours -@link_color : @egw_color_2_b; -@link_color_active: fade(@egw_color_2_b, 60%); - -// soll EGROUPWARE FARBE GEBEN -/*@active_button_border_bottom : @egw_color_2_d;*/ - -// Hint / or have to do / must field -@color_hint : #189800; //@egw_color_2_a; - -// Tooltipp / or have to do / must field -@color_tooltip : lighten(@egw_color_1_e, 90%); - -/*optional / can field*/ -@color_optional : fade(@egw_color_1_e, 10%); - - - -/*Listenausgabe*/ - -@color_even : @gray_0; -@color_odd : darken(@gray_0, 5%); - - -// aktiverte Zeilen in allen APP mit Listenausgabe -@color_active_row : fade(@egw_color_1_a, 1%); - -// not in use -@color_selected_row : @egw_color_1_e; - -// Mouse over -@color_hover_row : fade(@egw_color_2_e, 20%); - - -/* Dialog Button panel Background Color*/ -@color_button_panel_bg_color : @egw_color_2_e; - - - /*Button edit + save + apply + copy = positive action */ -@color_positive_action : #189800; // green -@color_positive_action_hover : fade(#189800, 2%); // green -@color_positive_action_active : lighten(#189800, 2%); // green - - - /*Button cancel = do nothing action */ -@color_cancel_action : #F5B301; -@color_cancel_action_hover : lighten(#F5B301, 0%); -@color_cancel_action_active : lighten(#F5B301, 15%); - - /*Button delete = negative action */ -@color_negative_action : #AE1D00; -@color_negative_action_hover : lighten(#AE1D00, 2%); -@color_negative_action_active : lighten(#AE1D00, 10%); - - - - - -@color_splitter_bar : @egw_color_1_a; -@color_splitter_bar_hover : @egw_color_1_a; -@color_splitter_bar_active : @egw_color_1_a; - -// Search Button - -.background_color_search {background-color : @gray_30; } - - -// cal Heute // in Sidebar -.background_table_cal_head { background-color : @egw_color_1_a;} - -@color_progress : @egw_color_1_e; - -/*#####################################################################*/ -// Schriften - -.basefontfamily{ - font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; - -} - - -@basefontsize : 11px; - -.fontsize_normal {font-size: @basefontsize;} - -.fontsize_xs {font-size: @basefontsize*0.25;} // h5 -.fontsize_s {font-size: @basefontsize*0.5;} // h4 -.fontsize_m {font-size: @basefontsize*1;} // p -.fontsize_l {font-size: @basefontsize*1.1;} // h3 + SIDEBAR APPS H1 -.fontsize_xl {font-size: @basefontsize*1.3;} // h2 -.fontsize_xxl {font-size: @basefontsize*1.8;} // h1 - -/*#####################################################################*/ -/* Radius*/ - -.border_radius_button_lefttop { - -webkit-border-radius: 3px; - -webkit-border-top-left-radius: 10px; - -moz-border-radius: 3px; - -moz-border-radius-topleft: 10px; - border-radius: 3px; - border-top-left-radius: 10px; -} - -.border_radius_button_righttop { - -webkit-border-radius: 3px; - -webkit-border-top-right-radius: 20px; - -moz-border-radius: 3px; - -moz-border-radius-topright: 20px; - border-radius: 3px; - border-top-right-radius: 20px; -} - -.border_radius_button_normal { - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} - - -// Box Shadow -// none -.box_shadow_none { - -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); - -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); - box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); -} - -// auf hellem Hintergrund - -.box_shadow_standard_light { - -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); - -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); - box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5); -} - -// wird dunkler - -.box_shadow_standard_light_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); - -} - -// für focus und active - -.box_shadow_standard_light_inset { - -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); -} - -.box_shadow_standard_light_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); -} - - -.box_shadow_message { - -webkit-box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); - -moz-box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); - box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5); -} - -// Rahmen für Dialoge - -.box_shadow_edit_dialog { - - -moz-box-shadow: inset 0 0 5px 5px #888; - -webkit-box-shadow: inset 0 0 5px 5px #888; - box-shadow: inset 0 0 5px 5px #888; - - margin: 5px ; - padding: 0%; - width: 100%; -} - - -// ############################# -// Verlauf - -.background_verlauf_diagonal_gray (@i: #d8d8d8, @j: #a3a3a3) { - background: -webkit-gradient(linear, 0 0, 0 bottom, @i, @j), - -moz-linear-gradient(@i, @j), - -o-linear-gradient(@i, @j), - linear-gradient(@i, @j); - -pie-background: linear-gradient(@i, @j); - behavior: url(/PIE.htc); -} - -.background_linear_gradient(@i: #ffb76b, @j: #ff7f04) { - background: -webkit-gradient(linear, 0 0, 0 bottom, @i, @j), - -moz-linear-gradient(@i, @j), - -o-linear-gradient(@i, @j), - linear-gradient(@i, @j); - -pie-background: linear-gradient(@i, @j); - behavior: url(/PIE.htc); -} - -.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { - background: @color, - -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, @start), - color-stop(1, @stop)), - -ms-linear-gradient(bottom, @start, @stop), - -moz-linear-gradient(center bottom, @start 0%, @stop 100%), - -o-linear-gradient(@stop, @start); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); -} - - -.bw_gradient(@color: #F5F5F5, @start: 0, @stop: 255) { - background: @color, - -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, rgb(@start,@start,@start)), - color-stop(1, rgb(@stop,@stop,@stop))), - -ms-linear-gradient(bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%), - -moz-linear-gradient(center bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%), - -o-linear-gradient(rgb(@stop,@stop,@stop), - rgb(@start,@start,@start)); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); -} - - - - -.img_filter_gray{ - - /*filter grey*/ - filter: url("data:image/svg+xml;utf8,#grayscale"); - - -webkit-filter: grayscale(100%); - -moz-filter: grayscale(100%); - -ms-filter: grayscale(0%); - -o-filter: grayscale(100%); - filter: grayscale(100%); - /*filter: url(grayscale.svg); Firefox 4+ */ - filter: gray; /* IE 6-9 */ - -} -// ############################# -// Transparenz - -.transparent_50 { - /* Required for IE 5, 6, 7 */ - /* ...or something to trigger hasLayout, like zoom: 1; */ - width: 100%; - - /* Theoretically for IE 8 & 9 (more valid) */ - /* ...but not required as filter works too */ - /* should come BEFORE filter */ - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; - - /* This works in IE 8 & 9 too */ - /* ... but also 5, 6, 7 */ - filter: alpha(opacity=50); - - /* Older than Firefox 0.9 */ - -moz-opacity:0.5; - - /* Safari 1.x (pre WebKit!) */ - -khtml-opacity: 0.5; - - /* Modern! - /* Firefox 0.9+, Safari 2?, Chrome any? - /* Opera 9+, IE 9+ */ - opacity: 0.5; -} - - -// ############################# -// Button Größen - -.Button_size_square_32{ - width: 32px; - height: 32px; - -} - -.Button_size_square_16{ - width: 16px; - height: 16px; -} - -.Button_size_square_8{ - width: 8px; - height: 8px; -} - -.Button_size_h32_auto{ - width: auto; - height: 32px; -} - - - /*Icon Buttons ################## */ - @mass_xxs : 8px; - @mass_xs : 12px; - @mass_s : 16px; - @mass_sm : 20px; - @mass_m : 24px; - @mass_l : 32px; - @mass_xl : 40px; - @mass_xxl: 48px; - - -/* ############## - # big Icon # - # # - # 32 x 32 # - # # - # # - ################*/ -.dimension_width_height_xl{width: @mass_xl; height: @mass_xl;} -.dimension_width_height_l{width: @mass_l; height: @mass_l;} -.dimension_width_height_m{width: @mass_m; height: @mass_m;} -.dimension_width_height_sm{width: @mass_sm; height: @mass_sm;} -.dimension_width_height_s{width: @mass_s; height: @mass_s;} -.dimension_width_height_xs{width: @mass_xs; height: @mass_xs;} -.dimension_width_height_xxs{width: @mass_xxs; height: @mass_xxs;} - -/* only Buttons ################## */ - -/* ########################## - # big Button # - # # - # # - # # - # N x 32 # - ############################*/ - -.dimension_height_xxl{ height: @mass_xxl;} -.dimension_height_xl{ height: @mass_xl;} -.dimension_height_l{ height: @mass_l;} -.dimension_height_m{ height: @mass_m;} -.dimension_height_sm{ height: @mass_sm;} -.dimension_height_s{ height: @mass_s;} -.dimension_height_xs{ height: @mass_xs;} -.dimension_height_xxs{ height: @mass_xxs;} - -// Rahmen für Schaltflächen - -.border_normal{ - border: 1px solid rgba(0, 0, 0, 0.15); -} - -.border_hover{ - border: 1px solid rgba(0, 0, 0, 0.5); -} -.border_active{ - border: 1px solid rgba(0, 0, 0, 0.9); -} - -.border_none{ - border: 0px solid rgba(0, 0, 0, 0.9); -} - - - - - -/*--------------------------------------------------- - LESS Elements 0.9 - --------------------------------------------------- - A set of useful LESS mixins - More info at: http://lesselements.com - ---------------------------------------------------*/ - -.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { - background: @color, - -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, @start), - color-stop(1, @stop)), - -ms-linear-gradient(bottom, - @start, - @stop), - -moz-linear-gradient(center bottom, - @start 0%, - @stop 100%), - -o-linear-gradient(@stop, - @start); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); -} -.bw_gradient(@color: #F5F5F5, @start: 0, @stop: 255) { - background: @color, - -webkit-gradient(linear, - left bottom, - left top, - color-stop(0, rgb(@start,@start,@start)), - color-stop(1, rgb(@stop,@stop,@stop))), - -ms-linear-gradient(bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%), - -moz-linear-gradient(center bottom, - rgb(@start,@start,@start) 0%, - rgb(@stop,@stop,@stop) 100%), - -o-linear-gradient(rgb(@stop,@stop,@stop), - rgb(@start,@start,@start)); - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); -} -.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) { - border-top: solid 1px @top-color; - border-left: solid 1px @left-color; - border-right: solid 1px @right-color; - border-bottom: solid 1px @bottom-color; -} -.drop_shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @r:0, @g:0, @b:0, @alpha: 0.1, @inset:inset) { - -webkit-box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; - -moz-box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; - box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; -} -.rounded(@radius: 2px) { - -webkit-border-radius: @radius; - -moz-border-radius: @radius; - border-radius: @radius; -} -.border_radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) { - -webkit-border-top-right-radius: @topright; - -webkit-border-bottom-right-radius: @bottomright; - -webkit-border-bottom-left-radius: @bottomleft; - -webkit-border-top-left-radius: @topleft; - -moz-border-radius-topright: @topright; - -moz-border-radius-bottomright: @bottomright; - -moz-border-radius-bottomleft: @bottomleft; - -moz-border-radius-topleft: @topleft; - border-top-right-radius: @topright; - border-bottom-right-radius: @bottomright; - border-bottom-left-radius: @bottomleft; - border-top-left-radius: @topleft; - /*.background-clip(padding-box);*/ -} -.opacity(@opacity: 0.5) { - -moz-opacity: @opacity; - -khtml-opacity: @opacity; - -webkit-opacity: @opacity; - opacity: @opacity; - @opperc: @opacity * 100; - -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})"; - filter: ~"alpha(opacity=@{opperc})"; -} -.transition_duration(@duration: 0.2s) { - -moz-transition-duration: @duration; - -webkit-transition-duration: @duration; - -o-transition-duration: @duration; - transition-duration: @duration; -} -.transform(...) { - -webkit-transform: @arguments; - -moz-transform: @arguments; - -o-transform: @arguments; - -ms-transform: @arguments; - transform: @arguments; -} -.rotation(@deg:5deg){ - .transform(rotate(@deg)); -} -.scale(@ratio:1.3){ - .transform(scale(@ratio)); -} -.transition(@duration:0.2s, @ease:ease-out) { - -webkit-transition: all @duration @ease; - -moz-transition: all @duration @ease; - -o-transition: all @duration @ease; - transition: all @duration @ease; -} -.inner_shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) { - -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); - -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); - box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); -} -.box_shadow(@arguments) { - -webkit-box-shadow: @arguments; - -moz-box-shadow: @arguments; - box-shadow: @arguments; -} -.box_sizing(@sizing: border-box) { - -ms-box-sizing: @sizing; - -moz-box-sizing: @sizing; - -webkit-box-sizing: @sizing; - box-sizing: @sizing; -} -.user_select(@argument: none) { - -webkit-user-select: @argument; - -moz-user-select: @argument; - -ms-user-select: @argument; - user-select: @argument; -} -.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) { - -moz-column-width: @colwidth; - -moz-column-count: @colcount; - -moz-column-gap: @colgap; - -moz-column-rule-color: @columnRuleColor; - -moz-column-rule-style: @columnRuleStyle; - -moz-column-rule-width: @columnRuleWidth; - -webkit-column-width: @colwidth; - -webkit-column-count: @colcount; - -webkit-column-gap: @colgap; - -webkit-column-rule-color: @columnRuleColor; - -webkit-column-rule-style: @columnRuleStyle; - -webkit-column-rule-width: @columnRuleWidth; - column-width: @colwidth; - column-count: @colcount; - column-gap: @colgap; - column-rule-color: @columnRuleColor; - column-rule-style: @columnRuleStyle; - column-rule-width: @columnRuleWidth; -} -.translate(@x:0, @y:0) { - .transform(translate(@x, @y)); -} -.background_clip(@argument: padding-box) { - -moz-background-clip: @argument; - -webkit-background-clip: @argument; - background-clip: @argument; -} - -/* ##################################################### */ - -.gradient_thead{ - /*.background-color-5-gray;*/ - background: -moz-linear-gradient(top, rgba(240,240,240,0) 0%, rgba(191,191,191,0.65) 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(240,240,240,0)), color-stop(100%,rgba(191,191,191,0.65))); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* IE10+ */ - background: linear-gradient(to bottom, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f0f0f0', endColorstr='#a6bfbfbf',GradientType=0 ); /* IE6-9 */ -} - - -// Vertical gradient using CSS where possible, and base64-encoded SVG for IE9 (enables use of this in combination with border-radius) -// Based on this by Phil Brown: http://blog.philipbrown.id.au/2012/09/base64-encoded-svg-gradient-backgrounds-in-less/ -// Also based on a mixin from Twitter Bootstrap: https://github.com/twitter/bootstrap - -.gradient_vertical(@startColor, @endColor) { - -// IE9 prep -@dataPrefix: ~"url(data:image/svg+xml;base64,"; -@dataSuffix: ~")"; -@dataContent: ~''; -@b64Out: ~`(function(a,b,c){function e(a){a=a.replace(/\r\n/g,'\n');var b='';for(var c=0;c127&&d<2048){b+=String.fromCharCode(d>>6|192);b+=String.fromCharCode(d&63|128)}else{b+=String.fromCharCode(d>>12|224);b+=String.fromCharCode(d>>6&63|128);b+=String.fromCharCode(d&63|128)}}return b}function f(a){var b='';var c,f,g,h,i,j,l;var m=0;a=e(a);while(m>2;i=(c&3)<<4|f>>4;j=(f&15)<<2|g>>6;l=g&63;if(isNaN(f)){j=l=64}else if(isNaN(g)){l=64}b=b+d.charAt(h)+d.charAt(i)+d.charAt(j)+d.charAt(l)}return b}var d='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';return a+f(b)+c})('@{dataPrefix}','@{dataContent}','@{dataSuffix}')`; - -background-color: mix(@startColor, @endColor, 60%); // Base solid colour fallback -background-image: ~"@{b64Out}"; // IE9 -background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ -background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10 -background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ -background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ -background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 -background-image: linear-gradient(top, @startColor, @endColor); // The standard -background-repeat: repeat-x; - -} - - -.span_tool_group { - - float: left; - margin: 0 6px 5px 0; - padding: 2px 2px 2px 5px; - border: 1px solid #a6a6a6; - border-bottom-color: #979797; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - -moz-box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; - -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; - box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; - background: #e4e4e4; - background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e4e4e4)); - background-image: -moz-linear-gradient(top,#fff,#e4e4e4); - background-image: -webkit-linear-gradient(top,#fff,#e4e4e4); - background-image: -o-linear-gradient(top,#fff,#e4e4e4); - background-image: -ms-linear-gradient(top,#fff,#e4e4e4); - background-image: linear-gradient(top,#fff,#e4e4e4); - filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#ffffff',endColorstr='#e4e4e4'); - } - - - - - - - -// -// \ No newline at end of file +// not used any more \ No newline at end of file diff --git a/pixelegg/less/def_dimension.less b/pixelegg/less/def_dimension.less new file mode 100644 index 0000000000..0127d6570e --- /dev/null +++ b/pixelegg/less/def_dimension.less @@ -0,0 +1,60 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of used dimensions in images, buttons and stuff + + */ +@import "definitions.less"; + + /*Icon Buttons ################## */ + @mass_xxs : 8px; + @mass_xs : 12px; + @mass_s : 16px; + @mass_sm : 20px; + @mass_m : 24px; + @mass_l : 32px; + @mass_xl : 40px; + @mass_xxl: 48px; + + +/* ############## + # big Icon # + # # + # 32 x 32 # + # # + # # + ################*/ +.dimension_width_height_xl{width: @mass_xl; height: @mass_xl;} +.dimension_width_height_l{width: @mass_l; height: @mass_l;} +.dimension_width_height_m{width: @mass_m; height: @mass_m;} +.dimension_width_height_sm{width: @mass_sm; height: @mass_sm;} +.dimension_width_height_s{width: @mass_s; height: @mass_s;} +.dimension_width_height_xs{width: @mass_xs; height: @mass_xs;} +.dimension_width_height_xxs{width: @mass_xxs; height: @mass_xxs;} + +/* only Buttons ################## */ + +/* ########################## + # big Button # + # # + # # + # # + # N x 32 # + ############################*/ + +.dimension_height_xxl{ height: @mass_xxl;} +.dimension_height_xl{ height: @mass_xl;} +.dimension_height_l{ height: @mass_l;} +.dimension_height_m{ height: @mass_m;} +.dimension_height_sm{ height: @mass_sm;} +.dimension_height_s{ height: @mass_s;} +.dimension_height_xs{ height: @mass_xs;} +.dimension_height_xxs{ height: @mass_xxs;} \ No newline at end of file diff --git a/pixelegg/less/def_fonts.less b/pixelegg/less/def_fonts.less new file mode 100644 index 0000000000..743debcdb1 --- /dev/null +++ b/pixelegg/less/def_fonts.less @@ -0,0 +1,36 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all used fonts + + */ +@import "definitions.less"; + + + + /*#####################################################################*/ +// Schriften + +.basefontfamily{ + font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; + +} + +@basefontsize : 11px; + +.fontsize_normal {font-size: @basefontsize;} + +.fontsize_xs {font-size: @basefontsize*0.25;} // h5 +.fontsize_s {font-size: @basefontsize*0.5;} // h4 +.fontsize_m {font-size: @basefontsize*1;} // p +.fontsize_l {font-size: @basefontsize*1.1;} // h3 + SIDEBAR APPS H1 +.fontsize_xl {font-size: @basefontsize*1.3;} // h2 +.fontsize_xxl {font-size: @basefontsize*1.8;} // h1 \ No newline at end of file diff --git a/pixelegg/less/def_gradient.less b/pixelegg/less/def_gradient.less new file mode 100644 index 0000000000..3c448bb37e --- /dev/null +++ b/pixelegg/less/def_gradient.less @@ -0,0 +1,165 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all gradients + + */ +@import "definitions.less"; + +// ############################# +// Verlauf + +.background_verlauf_diagonal_gray (@i: #d8d8d8, @j: #a3a3a3) { + background: -webkit-gradient(linear, 0 0, 0 bottom, @i, @j), + -moz-linear-gradient(@i, @j), + -o-linear-gradient(@i, @j), + linear-gradient(@i, @j); + -pie-background: linear-gradient(@i, @j); + behavior: url(/PIE.htc); +} + +.background_linear_gradient(@i: #ffb76b, @j: #ff7f04) { + background: -webkit-gradient(linear, 0 0, 0 bottom, @i, @j), + -moz-linear-gradient(@i, @j), + -o-linear-gradient(@i, @j), + linear-gradient(@i, @j); + -pie-background: linear-gradient(@i, @j); + behavior: url(/PIE.htc); +} + +.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { + background: @color, + -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, @start), + color-stop(1, @stop)), + -ms-linear-gradient(bottom, @start, @stop), + -moz-linear-gradient(center bottom, @start 0%, @stop 100%), + -o-linear-gradient(@stop, @start); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); +} + + +.bw_gradient(@color: #F5F5F5, @start: 0, @stop: 255) { + background: @color, + -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, rgb(@start,@start,@start)), + color-stop(1, rgb(@stop,@stop,@stop))), + -ms-linear-gradient(bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%), + -moz-linear-gradient(center bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%), + -o-linear-gradient(rgb(@stop,@stop,@stop), + rgb(@start,@start,@start)); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); +} + + + +// Graufiler +.img_filter_gray{ + + /*filter grey*/ + filter: url("data:image/svg+xml;utf8,#grayscale"); + + -webkit-filter: grayscale(100%); + -moz-filter: grayscale(100%); + -ms-filter: grayscale(0%); + -o-filter: grayscale(100%); + filter: grayscale(100%); + /*filter: url(grayscale.svg); Firefox 4+ */ + filter: gray; /* IE 6-9 */ + +} + + +// kein Filter +.img_filter_none{ + + /*filter grey*/ + filter: none; + + -webkit-filter: initial; + -moz-filter: initial; + -ms-filter: initial; + -o-filter: initial; + filter: initial; + /*filter: url(grayscale.svg); Firefox 4+ */ + filter: initial; /* IE 6-9 */ + +} + +/* ##################################################### */ + +.gradient_thead{ + /*.background-color-5-gray;*/ + background: -moz-linear-gradient(top, rgba(240,240,240,0) 0%, rgba(191,191,191,0.65) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(240,240,240,0)), color-stop(100%,rgba(191,191,191,0.65))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* IE10+ */ + background: linear-gradient(to bottom, rgba(240,240,240,0) 0%,rgba(191,191,191,0.65) 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f0f0f0', endColorstr='#a6bfbfbf',GradientType=0 ); /* IE6-9 */ +} + + +// Vertical gradient using CSS where possible, and base64-encoded SVG for IE9 (enables use of this in combination with border-radius) +// Based on this by Phil Brown: http://blog.philipbrown.id.au/2012/09/base64-encoded-svg-gradient-backgrounds-in-less/ +// Also based on a mixin from Twitter Bootstrap: https://github.com/twitter/bootstrap + +.gradient_vertical(@startColor, @endColor) { + +// IE9 prep +@dataPrefix: ~"url(data:image/svg+xml;base64,"; +@dataSuffix: ~")"; +@dataContent: ~''; +@b64Out: ~`(function(a,b,c){function e(a){a=a.replace(/\r\n/g,'\n');var b='';for(var c=0;c127&&d<2048){b+=String.fromCharCode(d>>6|192);b+=String.fromCharCode(d&63|128)}else{b+=String.fromCharCode(d>>12|224);b+=String.fromCharCode(d>>6&63|128);b+=String.fromCharCode(d&63|128)}}return b}function f(a){var b='';var c,f,g,h,i,j,l;var m=0;a=e(a);while(m>2;i=(c&3)<<4|f>>4;j=(f&15)<<2|g>>6;l=g&63;if(isNaN(f)){j=l=64}else if(isNaN(g)){l=64}b=b+d.charAt(h)+d.charAt(i)+d.charAt(j)+d.charAt(l)}return b}var d='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';return a+f(b)+c})('@{dataPrefix}','@{dataContent}','@{dataSuffix}')`; + +background-color: mix(@startColor, @endColor, 60%); // Base solid colour fallback +background-image: ~"@{b64Out}"; // IE9 +background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ +background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10 +background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ +background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ +background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 +background-image: linear-gradient(top, @startColor, @endColor); // The standard +background-repeat: repeat-x; + +} + +.span_tool_group { + + float: left; + margin: 0 6px 5px 0; + padding: 2px 2px 2px 5px; + border: 1px solid #a6a6a6; + border-bottom-color: #979797; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; + -moz-box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; + -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; + box-shadow: 0 1px 0 rgba(255,255,255,.5),0 0 2px rgba(255,255,255,.15) inset,0 1px 0 rgba(255,255,255,.15) inset; + background: #e4e4e4; + background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e4e4e4)); + background-image: -moz-linear-gradient(top,#fff,#e4e4e4); + background-image: -webkit-linear-gradient(top,#fff,#e4e4e4); + background-image: -o-linear-gradient(top,#fff,#e4e4e4); + background-image: -ms-linear-gradient(top,#fff,#e4e4e4); + background-image: linear-gradient(top,#fff,#e4e4e4); + filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#ffffff',endColorstr='#e4e4e4'); + } + diff --git a/pixelegg/less/def_lessElements.less b/pixelegg/less/def_lessElements.less new file mode 100644 index 0000000000..8c1c5fbed8 --- /dev/null +++ b/pixelegg/less/def_lessElements.less @@ -0,0 +1,172 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of less elements / mixin + + */ +@import "definitions.less"; + +/*--------------------------------------------------- + LESS Elements 0.9 + --------------------------------------------------- + A set of useful LESS mixins + More info at: http://lesselements.com + ---------------------------------------------------*/ + +.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { + background: @color, + -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, @start), + color-stop(1, @stop)), + -ms-linear-gradient(bottom, + @start, + @stop), + -moz-linear-gradient(center bottom, + @start 0%, + @stop 100%), + -o-linear-gradient(@stop, + @start); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); +} +.bw_gradient(@color: #F5F5F5, @start: 0, @stop: 255) { + background: @color, + -webkit-gradient(linear, + left bottom, + left top, + color-stop(0, rgb(@start,@start,@start)), + color-stop(1, rgb(@stop,@stop,@stop))), + -ms-linear-gradient(bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%), + -moz-linear-gradient(center bottom, + rgb(@start,@start,@start) 0%, + rgb(@stop,@stop,@stop) 100%), + -o-linear-gradient(rgb(@stop,@stop,@stop), + rgb(@start,@start,@start)); + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",rgb(@stop,@stop,@stop),rgb(@start,@start,@start))); +} +.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) { + border-top: solid 1px @top-color; + border-left: solid 1px @left-color; + border-right: solid 1px @right-color; + border-bottom: solid 1px @bottom-color; +} +.drop_shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @r:0, @g:0, @b:0, @alpha: 0.1, @inset:inset) { + -webkit-box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; + -moz-box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; + box-shadow: @x-axis @y-axis @blur rgba(@r, @g, @b, @alpha) @inset; +} +.rounded(@radius: 2px) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; +} +.border_radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) { + -webkit-border-top-right-radius: @topright; + -webkit-border-bottom-right-radius: @bottomright; + -webkit-border-bottom-left-radius: @bottomleft; + -webkit-border-top-left-radius: @topleft; + -moz-border-radius-topright: @topright; + -moz-border-radius-bottomright: @bottomright; + -moz-border-radius-bottomleft: @bottomleft; + -moz-border-radius-topleft: @topleft; + border-top-right-radius: @topright; + border-bottom-right-radius: @bottomright; + border-bottom-left-radius: @bottomleft; + border-top-left-radius: @topleft; + /*.background-clip(padding-box);*/ +} +.opacity(@opacity: 0.5) { + -moz-opacity: @opacity; + -khtml-opacity: @opacity; + -webkit-opacity: @opacity; + opacity: @opacity; + @opperc: @opacity * 100; + -ms-filter: ~"progid:DXImageTransform.Microsoft.Alpha(opacity=@{opperc})"; + filter: ~"alpha(opacity=@{opperc})"; +} +.transition_duration(@duration: 0.2s) { + -moz-transition-duration: @duration; + -webkit-transition-duration: @duration; + -o-transition-duration: @duration; + transition-duration: @duration; +} +.transform(...) { + -webkit-transform: @arguments; + -moz-transform: @arguments; + -o-transform: @arguments; + -ms-transform: @arguments; + transform: @arguments; +} +.rotation(@deg:5deg){ + .transform(rotate(@deg)); +} +.scale(@ratio:1.3){ + .transform(scale(@ratio)); +} +.transition(@duration:0.2s, @ease:ease-out) { + -webkit-transition: all @duration @ease; + -moz-transition: all @duration @ease; + -o-transition: all @duration @ease; + transition: all @duration @ease; +} +.inner_shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) { + -webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); + -moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); + box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha); +} +.box_shadow(@arguments) { + -webkit-box-shadow: @arguments; + -moz-box-shadow: @arguments; + box-shadow: @arguments; +} +.box_sizing(@sizing: border-box) { + -ms-box-sizing: @sizing; + -moz-box-sizing: @sizing; + -webkit-box-sizing: @sizing; + box-sizing: @sizing; +} +.user_select(@argument: none) { + -webkit-user-select: @argument; + -moz-user-select: @argument; + -ms-user-select: @argument; + user-select: @argument; +} +.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) { + -moz-column-width: @colwidth; + -moz-column-count: @colcount; + -moz-column-gap: @colgap; + -moz-column-rule-color: @columnRuleColor; + -moz-column-rule-style: @columnRuleStyle; + -moz-column-rule-width: @columnRuleWidth; + -webkit-column-width: @colwidth; + -webkit-column-count: @colcount; + -webkit-column-gap: @colgap; + -webkit-column-rule-color: @columnRuleColor; + -webkit-column-rule-style: @columnRuleStyle; + -webkit-column-rule-width: @columnRuleWidth; + column-width: @colwidth; + column-count: @colcount; + column-gap: @colgap; + column-rule-color: @columnRuleColor; + column-rule-style: @columnRuleStyle; + column-rule-width: @columnRuleWidth; +} +.translate(@x:0, @y:0) { + .transform(translate(@x, @y)); +} +.background_clip(@argument: padding-box) { + -moz-background-clip: @argument; + -webkit-background-clip: @argument; + background-clip: @argument; +} \ No newline at end of file diff --git a/pixelegg/less/def_transparency.less b/pixelegg/less/def_transparency.less new file mode 100644 index 0000000000..8ee71ff2a6 --- /dev/null +++ b/pixelegg/less/def_transparency.less @@ -0,0 +1,44 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + +## Definitions of all gradients + + */ +@import "definitions.less"; + +// ############################# +// Transparenz + +.transparent_50 { + /* Required for IE 5, 6, 7 */ + /* ...or something to trigger hasLayout, like zoom: 1; */ + width: 100%; + + /* Theoretically for IE 8 & 9 (more valid) */ + /* ...but not required as filter works too */ + /* should come BEFORE filter */ + -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; + + /* This works in IE 8 & 9 too */ + /* ... but also 5, 6, 7 */ + filter: alpha(opacity=50); + + /* Older than Firefox 0.9 */ + -moz-opacity:0.5; + + /* Safari 1.x (pre WebKit!) */ + -khtml-opacity: 0.5; + + /* Modern! + /* Firefox 0.9+, Safari 2?, Chrome any? + /* Opera 9+, IE 9+ */ + opacity: 0.5; +} diff --git a/pixelegg/less/definitions.less b/pixelegg/less/definitions.less new file mode 100644 index 0000000000..262b9c9668 --- /dev/null +++ b/pixelegg/less/definitions.less @@ -0,0 +1,53 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + + +## Important ########### + +# Merge file for all .less def_ Files + + */ + +// Buttons +@import "def_buttons.less"; + +// Box Shadow +@import "def_boxShadow.less"; + +// Borders +@import "def_borders.less"; + +// Border Radius +@import "def_borderRadius.less"; + +// Box Shadow +@import "def_boxShadow.less"; + +// Button Size +@import "def_buttonSize.less"; + +// Colors +@import "def_colors.less"; + +// Colors +@import "def_dimension.less"; + +// fonts + font size +@import "def_fonts.less"; + +// Gradient / Farbverlauf +@import "def_gradient.less"; + +// Gradient / Farbverlauf +@import "def_lessElements.less"; + +// Transparency +@import "def_transparency.less"; diff --git a/pixelegg/less/layout_ajaxLoader.less b/pixelegg/less/layout_ajaxLoader.less new file mode 100644 index 0000000000..21ce6bb9fb --- /dev/null +++ b/pixelegg/less/layout_ajaxLoader.less @@ -0,0 +1,26 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + + +.egw_fw_ui_ajaxloader { + display: inline-block; + width: 16px; + height: 16px; + background-image:url(../images/ajax-loader.gif); + background-repeat: no-repeat; + background-position: center; + float: right; +} diff --git a/pixelegg/less/layout_buttons.less b/pixelegg/less/layout_buttons.less new file mode 100644 index 0000000000..dbdd19b308 --- /dev/null +++ b/pixelegg/less/layout_buttons.less @@ -0,0 +1,172 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## +// Button global for all and everything: + +/*########################################## +# Content Element # +# Button # +###########################################*/ + + +button{ + // siehe etemplate2.less +} + +button.et2_button_text, +input[type=button] { + + background-image[src$="svg"]{.gradient_vertical (@gray_30, @gray_30);} + + &:hover{ + /*background-color: @gray_30;*/ + text-shadow: 0px 0px; + color: @gray_0; + .box_shadow_standard_light_hover; + background-color: @color_positive_action_active; + background-size: 20px 20px; + } + + &:active {.box_shadow_standard_light_active !important;} + +} + +/* ######################################################################################## + * Content Element + * Button mit Bildern + * + ######################################################################################## */ +button.et2_button_with_image{ + .Complete_Button_text_icon_before; + background-repeat: no-repeat !important; + background-position: 6px center; + background-size: 20px 20px; + background-color: @gray_10; + background-color[url$="svg"]{.gradient_vertical (@gray_30, @gray_30);} + +} + +/* ######################################################################################## + * Content Element + * Button löschen / delete / => color-negative-action // red + * + ######################################################################################## */ + +input[type="submit"][id*="delete"], +input[type="button"][id*="delete"], +button[id="delete"], +button[id="infolog-edit_button[delete]"], +button[id="addressbook-edit_button[delete]"], +button[id="resources-edit_delete"], +button[id="calendar-edit_button[delete]"], +button[id="timesheet-edit_button[delete]"], +button[id="displayToolbar-delete"], +button.et2_button_delete +{ + .Complete_Button_delete; +} + +/* ######################################################################################## + * Content Element + * Button edit + save + apply + copy => color-positive-action // green + * + ######################################################################################## */ + +button[id*="save"], +button[id*="apply"], +button[id*="copy"], +button[id*="edit_button[edit]"], +button.et2_button{ + + .Complete_Button_save_apply_copy; +} + + +button#filemanager-select_button[ok]{ + &:active {background-color: @color_positive_action_active;} +} + +// Password change +#passwordchange { + background-image:url('../images/cancel.png') !important; + .Complete_Button_text_icon_before; + + &:hover {background-color: @color_positive_action_active !important; .box_shadow_standard_light_hover;} + &:active {background-color: @color_positive_action_active !important; .box_shadow_standard_light_inset;} + + +} + + + +/* ######################################################################################## + * + * Button cancel / => color-cancel-action // yellow + * + ######################################################################################## */ + +button[id*="cancel"], +button[id*="importexport-wizardbox_button[previous]"], +button#cancel, +#cancel, +button.et2_button_cancel, +button.et2_button_question{ + + &:hover { background-color: @color_cancel_action_hover !important; color: @gray_100; } + &:active { background-color: @color_cancel_action_active !important; color: @gray_80; } +} + + +/* et2_box_widget ###*/ +/*div.et2_box_widget .et2_button_text:last_child,*/ +button[id="cancel"], +button#cancel{ + + .Complete_Button_cancel; +} + + +// Password cancel +#passwordcancel { + background-image:url('../images/cancel.png') !important; + .Complete_Button_text_icon_before; + + &:hover {background-color: @color_cancel_action_hover !important; .box_shadow_standard_light_hover;} + &:active {background-color: @color_cancel_action_active !important; .box_shadow_standard_light_inset;} + + +} + +/* ######################################################################################## + * + * Button hinzufügen + * + ######################################################################################## */ + +button.add { + .Complete_Button_add ; +} + +button[id="add"]{ + background-image:url('../images/add.png') !important; + .Complete_Button_text_icon_before; + + &:active {background-color: @color_positive_action_active !important;} +} + + + + +/*Button Ende #######################################################*/ diff --git a/pixelegg/less/layout_chosen.less b/pixelegg/less/layout_chosen.less index d134f1796f..30554bdf1c 100755 --- a/pixelegg/less/layout_chosen.less +++ b/pixelegg/less/layout_chosen.less @@ -12,8 +12,7 @@ * @version $Id$ */ -@import (reference) "def_design_pattern_color_font_shadow.less"; -@import (reference) "def_buttons.less"; +@import (reference) "definitions.less"; //######################################################################################################## diff --git a/pixelegg/less/layout_clientSideJsError.less b/pixelegg/less/layout_clientSideJsError.less new file mode 100644 index 0000000000..e0b551ca80 --- /dev/null +++ b/pixelegg/less/layout_clientSideJsError.less @@ -0,0 +1,48 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + + +/** +* Clientside Javascript error-log +*/ +#topmenu_info_error { + width: 16px; + cursor: pointer; +} +div.client_error_log { + max-height: 50ex; +} +div.client_error_log tbody { + vertical-align: top; +} +div.client_error_log tr.hidden td > div { + max-height: 2ex; + max-width: 40ex; + overflow: hidden; + text-overflow: ellipsis; + white-space:nowrap; +} +div.client_error_log tr td.timestamp > div { + text-wrap: none; + white-space: normal; + width: 27ex; +} +div.client_error_log tr.hidden td.stack > div { + text-indent: 100% +} +div.client_error_log tr td.stack > div { + white-space: pre; +} diff --git a/pixelegg/less/layout_content_elements.less b/pixelegg/less/layout_content_elements.less index 684cde20a1b437b27b165ce0934ff88f304a15c5..483c54b66c03f692a7d0588e816bf540061f1c87 100755 GIT binary patch delta 130 zcmdn7n(>3ohV_gBnR%HdnfZCedO4}Z#Y)y(lN0P?CQsm~+U&-?j>&>cUthr^H8CY8 zGcUDRA;VCiw76U$GfyEWu`<83Bt8Qs1=h_4QeB*ylbT$zxkYFmBV+C4I3e}P&T`8c ZxhB7p4cW{mf0udkwSY;RzXTs)1ONqVFR%ar literal 21944 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 CT44YH diff --git a/pixelegg/less/layout_definitions.less b/pixelegg/less/layout_definitions.less new file mode 100644 index 0000000000..4e3cf108f7 --- /dev/null +++ b/pixelegg/less/layout_definitions.less @@ -0,0 +1,59 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $ + + +## Important ########### + +# Merge file for all .less layout_ Files + + */ + +// Lettersearch + +@import "layout_ajaxLoader.less"; + +@import "layout_buttons.less"; + +@import "layout_chosen.less"; + +@import "layout_clientSideJsError.less"; + +@import "layout_content_elements.less"; + +@import "layout_dhtmlSubmenu.less"; + +@import "layout_dialog.less"; + +@import "layout_footer.less"; + +@import "layout_headlines.less"; + +@import "layout_lettersearch.less"; + +@import "layout_loginPage.less"; + +@import "layout_messages.less"; + +@import "layout_overlay.less"; + +@import "layout_raster.less"; + +@import "layout_reset.less"; + +@import "layout_sbHolder.less"; + +@import "layout_svgFilter.less"; + +@import "layout_table.less"; + +@import "layout_traditional.less"; + + diff --git a/pixelegg/less/layout_dhtmlSubmenu.less b/pixelegg/less/layout_dhtmlSubmenu.less new file mode 100644 index 0000000000..ff75011665 --- /dev/null +++ b/pixelegg/less/layout_dhtmlSubmenu.less @@ -0,0 +1,36 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + +/*dhtml Submenu ##########################################################*/ +div.dhtmlxMenu_egw_SubLevelArea_Polygon{ + + table.dhtmlxMebu_SubLevelArea_Tbl{ + + tr.sub_item { + + + td.sub_item_icon{ + img[src*="svg"]{background-color: @gray_100; .gradient_vertical (@gray_90, @gray_90);} + .img_filter_gray; + } + } + + tr.sub_item_selected { + background-color: @egw_color_1_a !important; + background-image: none !important;} + } + +} diff --git a/pixelegg/less/layout_dialog.less b/pixelegg/less/layout_dialog.less index 90f085a0e1..0ea5ca1947 100755 --- a/pixelegg/less/layout_dialog.less +++ b/pixelegg/less/layout_dialog.less @@ -15,9 +15,8 @@ * @version $Id$ */ -@import (reference) "def_buttons.less"; -/*@import (reference) "def_content_elements.less";*/ -@import (reference) "def_design_pattern_color_font_shadow.less"; +@import (reference) "definitions.less"; +//############################################################################################################## /*body { background-color: @gray_0; diff --git a/pixelegg/less/layout_footer.less b/pixelegg/less/layout_footer.less index df23202eb3..9d378c6754 100644 --- a/pixelegg/less/layout_footer.less +++ b/pixelegg/less/layout_footer.less @@ -9,7 +9,8 @@ * */ -@import "def_design_pattern_color_font_shadow.less"; +@import (reference) "definitions.less"; +//############################################################################################################## /* ################################################# * FOOTER diff --git a/pixelegg/less/layout_headlines.less b/pixelegg/less/layout_headlines.less new file mode 100644 index 0000000000..85f3d8f701 --- /dev/null +++ b/pixelegg/less/layout_headlines.less @@ -0,0 +1,92 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## +h1 { + font-size: 300%; + line-height: 330%; + margin: 0.4em 0 0; + font-weight: normal; +} +.headline_h1 { + font-size: 300%; + line-height: 330%; + margin: 0.4em 0 0; +} + + +h2 { + font-size: 250%; + line-height: 270%; + margin: 0.6em 0 0; +} +.headline_h2 { + font-size: 250%; + line-height: 270%; + margin: 0.6em 0 0; + font-weight: lighter; +} + +h3 { + font-size: 200%; + line-height: 220%; + margin: 0.8571em 0 0; +} + +.headline_h3 { + font-size: 200%; + line-height: 220%; + margin: 0.8571em 0 0; +} + +h3 a { + color: #999999; +} + +h4 { + font-size: 150%; + line-height: 160%; + margin: 1.125em 0 0; +} +.headline_h4 { + font-size: 150%; + line-height: 160%; + margin: 1.125em 0 0; +} + +h5 { + font-size: 100%; + line-height: 110%; + margin: 1.2857em 0 0; +} + +.headline_h5 { + font-size: 100%; + line-height: 110%; + margin: 1.2857em 0 0; +} + + +h6 { + font-size: 100%; + font-weight: bold; + line-height: 100%; + margin: 1.5em 0 0; +} +.headline_h6 { + font-size: 100%; + font-weight: bold; + line-height: 100%; + margin: 1.5em 0 0; +} \ No newline at end of file diff --git a/pixelegg/less/layout_lettersearch.less b/pixelegg/less/layout_lettersearch.less new file mode 100755 index 0000000000..559df0fbdd --- /dev/null +++ b/pixelegg/less/layout_lettersearch.less @@ -0,0 +1,45 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id$ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + +// Lettersearch + +.lettersearch { + .Complete_Button_lettersearch; +} + +.lettersearch:hover { + .background_color_30_gray; + .color_0_gray; +} + + +.lettersearch_active{ + .Complete_Button_lettersearch; + .background_color_30_gray; + // background-color: #808080 !important; + font-weight: bold; +} + +td.lettersearch { + // border-color: #E0E0E0; + background-image: none; +} + + +/*.nextmatch_header table { + border: none !important; + width: 99% !important; +}*/ \ No newline at end of file diff --git a/pixelegg/less/layout_loginPage.less b/pixelegg/less/layout_loginPage.less index 34f10542cc..61049c39e2 100644 --- a/pixelegg/less/layout_loginPage.less +++ b/pixelegg/less/layout_loginPage.less @@ -12,9 +12,8 @@ * @version $Id$ */ -@import (reference) "def_buttons.less"; -@import (reference) "def_design_pattern_color_font_shadow.less"; -@import (reference) "layout_messages.less"; +@import (reference) "definitions.less"; +//############################################################################################################## /* ################################################################################## diff --git a/pixelegg/less/layout_messages.less b/pixelegg/less/layout_messages.less index 704963c3af..f886d7f1db 100755 --- a/pixelegg/less/layout_messages.less +++ b/pixelegg/less/layout_messages.less @@ -12,9 +12,8 @@ * @version $Id$ */ -@import (reference) "def_design_pattern_color_font_shadow.less"; -@import (reference) "def_buttons.less"; -//@import "def_buttons.less"; +@import (reference) "definitions.less"; +//############################################################################################################## #egwpopup{ diff --git a/pixelegg/less/layout_overlay.less b/pixelegg/less/layout_overlay.less new file mode 100644 index 0000000000..a0648c47c7 --- /dev/null +++ b/pixelegg/less/layout_overlay.less @@ -0,0 +1,53 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + + + /*z.b. Dateimanager overlay*/ + +.egwGridView_grid span.iconOverlayContainer { + margin: 2px 5px 2px 2px; + position: relative; + -moz-user-select: none; + -khtml-user-select: none; + user-select: none; + overflow: visible; + display: inline-block; +} + +.egwGridView_grid span.overlayContainer { + position: absolute; + right: -2px; + bottom: -2px; + vertical-align: bottom; + text-align: right; +} + +.egwGridView_grid span.iconContainer { + display: inline-block; + padding: 0; + margin: 0; + text-align: center; +} + +.egwGridView_grid span.overlayContainer img.overlay { + position: relative; + top: 1px; + margin: 0; + padding: 0; + height: 9px; + width: 11px; + +} diff --git a/pixelegg/less/layout_raster.less b/pixelegg/less/layout_raster.less index 426a222aee..98770d8f51 100644 --- a/pixelegg/less/layout_raster.less +++ b/pixelegg/less/layout_raster.less @@ -12,7 +12,8 @@ * @version $Id$ */ -@import (reference) "def_buttons.less"; +@import (reference) "definitions.less"; +//############################################################################################################## //############## Layout ######################################################################################## diff --git a/pixelegg/less/layout_reset.less b/pixelegg/less/layout_reset.less new file mode 100644 index 0000000000..a4547db5a2 --- /dev/null +++ b/pixelegg/less/layout_reset.less @@ -0,0 +1,119 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## +/** + * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) + * http://cssreset.com + * fieldset legend + */ +/* html, body, div, span, applet, object, iframe, + h1, h2, h3, h4, h5, h6, p, blockquote, pre, + a, abbr, acronym, address, big, cite, code, + del, dfn, em, img, ins, kbd, q, s, samp, + small, strike, strong, sub, sup, tt, var, + b, u, i, center, + dl, dt, dd, ol, ul, li, + form, label, + table, caption, tbody, tfoot, thead, tr, th, td, + article, aside, canvas, details, embed, + figure, figcaption, footer, header, hgroup, + menu, nav, output, ruby, section, summary, + time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + }*/ + /* HTML5 display-role reset for older browsers */ + article, aside, details, figcaption, figure, + footer, header, hgroup, menu, nav, section { + display: block; + } + + body { + line-height: 1; + } + + ol, ul { + /*list-style: none;*/ + } + blockquote, q { + quotes: none; + } + blockquote:before, blockquote:after, + q:before, q:after { + content: ''; + content: none; + } + table { + border-collapse: collapse; + border-spacing: 0; + } + + *::-webkit-input-placeholder { + color:@gray_60; + } + *:-moz-placeholder { + /* FF 4-18 */ + color: @gray_60; + } + *::-moz-placeholder { + /* FF 19+ */ + color: @gray_60; + } + *:-ms-input-placeholder { + /* IE 10+ */ + color: @gray_60; + } + + iframe{border: none;} + + + + +//Reset + +html * { + font-size: 100%; + +} +//############################################### + +// verhindert Scrollbars und gibt content volle höhe +html { + + margin: 0px !important; + padding: 0px !important; + width: 99.9% !important; + height: 99% !important; + +} + +body{ + background-image:none; + + .background_color_10_gray; + .color_100_gray; // Schriftfarbe schwarz + + margin: 0px !important; + padding: 0px !important; + width: 99.9% !important; + height: 99% !important; + font-size: 11px; + line-height: 1.28; + font-weight: normal; + +} \ No newline at end of file diff --git a/pixelegg/less/layout_sbHolder.less b/pixelegg/less/layout_sbHolder.less new file mode 100644 index 0000000000..76fab5d7e2 --- /dev/null +++ b/pixelegg/less/layout_sbHolder.less @@ -0,0 +1,141 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## +.sbHolder{ + .Complete_Button_select; + // background-color: #2d2d2d; + // border: solid 1px #515151; + // font-family: Arial, sans-serif; + .basefontfamily; + font-size: 1.2em; + font-weight: normal; + height: 30px; + position: relative; + width: 10em; + + &:hover{.Complete_Button_select_hover;} + &:focus{.Complete_Button_select_focus;} + +} +.sbHolder:focus .sbSelector{} + +.sbSelector{ + display: block; + height: 30px; + left: 0; + line-height: 30px; + outline: none; + overflow: hidden; + position: absolute; + text-indent: 10px; + top: 0; + width: 170px; +} +.sbSelector:link, .sbSelector:visited, .sbSelector:hover{ + // color: #EBB52D; + .color_50_gray; + outline: none; + text-decoration: none; +} +.sbToggle{ + background: url(../img/select-icons.png) 0 -116px no-repeat; + display: block; + height: 30px; + outline: none; + position: absolute; + right: 0; + top: 0; + width: 30px; +} +.sbToggle:hover{ + background: url(../images/select-icons.png) 0 -167px no-repeat; +} +.sbToggleOpen{ + background: url(../images/select-icons.png) 0 -16px no-repeat; +} +.sbToggleOpen:hover{ + background: url(../images/select-icons.png) 0 -66px no-repeat; +} +.sbHolderDisabled{ + background-color: #3C3C3C; + border: solid 1px #515151; +} +.sbHolderDisabled .sbHolder{ + +} +.sbHolderDisabled .sbToggle{ + +} + +// Ausklappliste + +.sbOptions{ + // background-color: #212121; + .background_color_0_gray; + border: solid 1px #515151; + list-style: none; + left: -1px; + margin: 0; + padding: 0; + position: absolute; + top: 30px; + width: 200px; + z-index: 1; + overflow-y: auto; + + li{ + padding: 0 7px; + } + + a{ + border-bottom: dotted 1px #515151; + display: block; + outline: none; + padding: 7px 0 7px 3px; + color:@link_color; + } + + a:link, + a:visited{ + color:@link_color; + text-decoration: none; + } + a:hover, + a:focus, + a.sbFocus{ + color: @link_color_active; + } + li.last a{ + border-bottom: none; + } + + + .sbDisabled{ + border-bottom: dotted 1px #515151; + color: #999; + display: block; + padding: 7px 0 7px 3px; + } + .sbGroup{ + border-bottom: dotted 1px #515151; + color: #EBB52D; + display: block; + font-weight: bold; + padding: 7px 0 7px 3px; + } + .sbSub{ + padding-left: 17px; + } +} \ No newline at end of file diff --git a/pixelegg/less/layout_svgFilter.less b/pixelegg/less/layout_svgFilter.less new file mode 100644 index 0000000000..c54cd0136f --- /dev/null +++ b/pixelegg/less/layout_svgFilter.less @@ -0,0 +1,29 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + +/*SVG Filter / not for Logo */ +#egw_fw_sidebar img[src$="svg"]{ + .gradient_vertical (@gray_60, @gray_60); + .rounded(3px); + border: 1px solid @gray_0;; +} + +#egw_fw_main img[src$="svg"], +#egw_fw_footer img[src$="svg"]{ + /*.gradient_vertical (@egw_color_2_a, @egw_color_2_a);*/ + .gradient_vertical (fade(@gray_100,50%), fade(@gray_100,50%)); + +} diff --git a/pixelegg/less/layout_table.less b/pixelegg/less/layout_table.less index f81db3789d..6ff70687b1 100755 --- a/pixelegg/less/layout_table.less +++ b/pixelegg/less/layout_table.less @@ -12,8 +12,7 @@ * @version $Id$ */ -@import (reference) "def_design_pattern_color_font_shadow.less"; -@import (reference) "def_buttons.less"; +@import (reference) "definitions.less"; /** ##################################################################################### * et2 @@ -29,6 +28,11 @@ table.et2_grid { } +// Tabellen + +.th { + background-color: #e0e0e0; +} .innerContainer{ overflow: hidden; diff --git a/pixelegg/less/layout_traditional.less b/pixelegg/less/layout_traditional.less new file mode 100755 index 0000000000..200c39d81e --- /dev/null +++ b/pixelegg/less/layout_traditional.less @@ -0,0 +1,323 @@ +/** + * EGroupware: Stylite Pixelegg template + * + * lettersearch + * + * Please do NOT change css-files directly, instead change less-files and compile them! + * + * @link http://www.egroupware.org + * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License + * @author Stefan Reinhard + * @package pixelegg + * @version $Id$ + */ +@import (reference) "definitions.less"; +//############################################################################################################## + +/* traditional */ + + + +form +{ + margin:0px; + padding:0px; +} + +img +{ + border:0; + +} + +div{ + color: #000000; +} +input[type=submit],input[type=button],input[type=reset],button,.egwbutton +{ + .background_color_10_gray; + background-image: none; + border: outset 1px #b9d5e3; + margin: 1px; + padding: 1px; + cursor: pointer; + color: #004e7d; +} + +input[type=submit]:hover,input[type=button]:hover,input[type=reset]:hover,button:hover,.egwbutton:hover +{ + .background_color_15_gray; + background-image: none; + border: outset 1px #b9d5e3; + color: #004e7d; +} + +input[type=submit]:active,input[type=button]:active,input[type=reset]:active,button:active,.egwbutton:active +{ + border: inset 1px #bbbbbb; +} + +input[type=submit]:disabled,input[type=button]:disabled,input[type=reset]:disabled,button:disabled,.egwbutton:disabled +{ + background-color: transparent; + color: gray; +} + +input.egwbutton +{ + background-color:#b9d5e3; + border: outset 1px #b9d5e3; + margin: 1px; + padding: 1px; + cursor: pointer; + color: #004e7d; +} + +input.egwbutton:hover +{ + background-color:#94bfd4; + border: outset 1px #b9d5e3; + color: #004e7d; +} +input.egwbutton:active +{ + border: inset 1px #bbbbbb; +} + +input[type=image] +{ + cursor: pointer; + border: 0; + .dimension_width_height_s; +} + +#thesideboxcolumn +{ + width: 177px; + position:relative; +} + +#sideresize +{ + background-image:url(../images/resize.png); + width:13px; + height:13px; + right:1px; + top:1px; + position:absolute; + z-index:9999; +} + + + + + +.divSidebox +{ + position:relative; + border: #9c9c9c 1px solid; + overflow:auto; +} + +.divSideboxHeader +{ + text-align:center; + .background_color_15_gray; + padding-top:2px; + .color_50_gray; +} + + +a.divSideboxEntry, .divSideboxEntry +{ + text-align:left; + background-color:#FDFDFD; +} + +a.appTitles,.appTitles +{ + height:18px; + padding-top:2px; + padding-bottom:2px; +} + +a.textSidebox +{ + padding: 0; + border-top: 0; +} + +.textSidebox +{ + padding-top:3px; + padding-bottom:3px; + padding-left: 1px; + border-top: solid #aaaaaa 1px; + overflow: auto; +} + +.sideboxSpace +{ + height:9px; +} + +.greyLine +{ + margin:1px; + border-top:solid 1px #7e7e7e; + height:1px; +} + +#extraIcons +{ + background-color:#eeeeee; + border:solid 1px #7e7e7e; +} + +.extraIconsRow +{ + border:solid 1px #dddddd; + padding:2px; +} + +#topmenu +{ + background-color: #0081c1; + background-image: url(../images/bgtopmenu2.png); + color:#006699; + /*border-top: solid 1px #7e7e7e;*/ + border-bottom: solid #5793ff 1px; + height:20px; + padding-top:4px ; + line-height:16px; +} +#topmenu a +{ + color:#006699; +} + +#topmenu_items +{ + float:left; +} +#topmenu_info +{ + float:right; +} + +#divUpperTabs +{ + text-align:right; + height: 15px; + margin-right: 10px; +} + +#divUpperTabs ul +{ + display:inline; + margin:0; + padding:10px 10px 0 1px; + list-style:none; +} + +#divUpperTabs li +{ + float:right; + margin:0 5px 0 0; + padding:0 5px 0 5px; + border:solid 1px #9c9c9c; + border-bottom: 0px; +} + +//#divAppIconBar +//{ +// background-color:silver; +// border:solid 1px #9c9c9c; +// background-image: url(../images/background-icon-bar.png); +// background-repeat: repeat-x; +// overflow:visible; +// height: 45px; /* prevents text line to show in IE7+8(Compatibilitymode) */ +//} + +/* Star-Plus-HTML Hack fix for the above */ +*:first-child+html #divAppIconBar +{ + height: 60px; +} + +#divAppTextBar +{ + background-color:white; +} + +#divStatusBar +{ + background-color:white; + height:18px; + padding-left:3px; +} + +#tdSidebox +{ + width:170px; + background-color:white; + overflow:visible; +} + +#tdAppbox +{ + background-color:white; + padding-left:5px; + width: 100%; +} + +#divAppboxHeader +{ + background-image:url(../images/appbox-header-background.png); + background-repeat: repeat-x; + height: 25px; + border-bottom:solid 1px #c0c0c0; + text-align:center; + padding-bottom:0px; + border-top:solid 1px #9c9c9c; + border-left:solid 1px #9c9c9c; + border-right:solid 1px #9c9c9c; + + + table img {.dimension_height_s;} +} + +#divAppbox +{ + background-color:#ffffff; + padding:5px; + border-bottom:solid 1px #9c9c9c; + border-left:solid 1px #9c9c9c; + border-right:solid 1px #9c9c9c; +} + +#divGenTime,#divPoweredBy +{ + bottom:4px; + text-align:center; + width:99%; +} + +.pageGenTime,#divPoweredBy + { + font-size: 80%; + color: #ff0000; + text-align: center; + } + + .pageGenTime { + margin-top: 1em; + } + + .pageGenTime > span:after { + content: ", "; + } + + .pageGenTime > span:last-child:after { + content: ""; + } \ No newline at end of file diff --git a/pixelegg/less/magicsuggest.less b/pixelegg/less/magicsuggest.less index eeba5cbc17..28796dde6c 100644 --- a/pixelegg/less/magicsuggest.less +++ b/pixelegg/less/magicsuggest.less @@ -12,7 +12,8 @@ * @version $Id$ */ -@import (reference) "def_design_pattern_color_font_shadow.less"; +@import (reference) "definitions.less"; +//############################################################################################################## .ms-ctn{ position: relative; diff --git a/pixelegg/less/svg.css b/pixelegg/less/svg.css index f12b18da01..1fdbe37149 100644 --- a/pixelegg/less/svg.css +++ b/pixelegg/less/svg.css @@ -18,7 +18,7 @@ } /* svg#etemplate_navbar { - fill: @gray_40; + fill: @gray_40; } svg#infolog_navbar { @@ -26,7 +26,7 @@ svg#infolog_navbar { } svg#admin_navbar { - fill: @gray_40; + fill: @gray_40; } .egw_fw_ui_tabs_header > svg * { @@ -35,9 +35,9 @@ svg#admin_navbar { } svg#sambaadmin_navbar { - fill: @gray_40; + fill: @gray_40; } svg#mail_navbar { - fill: @gray_40; + fill: @gray_40; }*/ diff --git a/pixelegg/less/svg.less b/pixelegg/less/svg.less index 9dd565272b..9d6ec9bb13 100755 --- a/pixelegg/less/svg.less +++ b/pixelegg/less/svg.less @@ -12,8 +12,8 @@ * @version $Id$ */ - @import (reference) "def_design_pattern_color_font_shadow.less"; - @import (reference) "def_buttons.less"; +@import (reference) "definitions.less"; +//############################################################################################################## @@ -24,7 +24,7 @@ } /* svg#etemplate_navbar { - fill: @gray_40; + fill: @gray_40; } svg#infolog_navbar { @@ -32,7 +32,7 @@ svg#infolog_navbar { } svg#admin_navbar { - fill: @gray_40; + fill: @gray_40; } .egw_fw_ui_tabs_header > svg * { @@ -41,11 +41,11 @@ svg#admin_navbar { } svg#sambaadmin_navbar { - fill: @gray_40; + fill: @gray_40; } svg#mail_navbar { - fill: @gray_40; + fill: @gray_40; }*/ //