/** * EGroupware: CSS with less preprocessor * * Definitions for buttons * * 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 Reinhardt * @package phpgwapi * @version $Id$ */ @import (reference) "def_design_pattern_color_font_shadow.less"; //##################### //# Complete Button # //##################### .Complete_Button_normal{ .border_normal; /*.box_shadow_standard_light;*/ .rounded (3px); color: @gray_100; -webkit-transition-property: background-color; -moz-transition-property: background-color; -o-transition-property: background-color; transition-property: background-color; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: linear; -moz-transition-timing-function: linear; -o-transition-timing-function: linear; transition-timing-function: linear; background-color: @gray_30; } .Complete_Button_hover{ // .border_hover; .box_shadow_standard_light_hover; background-color: inherit !important; } .Complete_Button_active{ // .border_hover; .box_shadow_standard_light_inset; } .Complete_Button_focus{ // .border_hover; .box_shadow_standard_light_inset; } /*ADD / Hinzufügen*/ .Complete_Button_add { color: #FFF; text-shadow: none; /* height: auto;*/ background-image: none !important; /*.border_radius_button_lefttop;*/ &:before {content: "+";font-size: 1.5em;color: @egw_color_1; line-height: 1.1em;} } .Complete_Button_add_hover { background-color: @egw_color_blue_lightest !important; color: @egw_color_1; .box_shadow_standard_light_hover; .border_radius_button_lefttop; } /*ADD / Hinzufügen = only PLUS */ .Complete_Button_add_only_plus { .dimension_width_height_l; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); padding: -0.5em; background-color: @egw_color_2_e !important; &:before { content: ""; font-size: 2em; color: @egw_color_1_a; line-height: 0.6em; padding-left: 0.1em; padding-right: 4em; } &:active {background-color: @color_positive_action_active;} } .Complete_Button_add_only_plus_hover { background-color: @egw_color_blue_lightest !important; color: @egw_color_1; .box_shadow_standard_light_hover; .border_radius_button_lefttop; } .Complete_Button_hinweis{ .Button_size_square_32; .border_normal; padding: 0 0.2em; border-left: 3px solid; border-left-color: @lightgray; } // select .Complete_Button_select{ .box_shadow_standard_light; width: auto; margin: 5px 0em 5px 5px; padding:3px; outline:none; display: inline-block; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer; } .Complete_Button_select_hover { .box_shadow_standard_light_hover; } .Complete_Button_select_focus { outline:0; border-width:1px; border-style: solid; border-color: @gray_30; -webkit-box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); -moz-box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); } // Input .Complete_Button_input{ .border_normal; border-color: @gray_30; .box_shadow_standard_light; width: auto; /*margin: 0.5em 0em 0.5em 0;*/ .border_radius_button_normal; } .Complete_Button_input_hover{ .box_shadow_standard_light_hover; } .Complete_Button_input_focus { outline:0; border-width:1px; border-style: solid; border-color: @gray_30; -webkit-box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); -moz-box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); box-shadow: 0 0 2px 1px rgba(0,0,0, 0.10); } // Suchen button .Complete_Button_search_action{ .border_normal; border-color: @gray_30; .box_shadow_standard_light; width: 45px; /*height: 1.6em;*/ .border_radius_button_righttop; .background_color_search; color: lighten(@egw_color_1, 15%); text-decoration: none; cursor: pointer; padding: 0px; margin: 7px; margin-left: 0px; background-image: url("../images/search.png"); background-position: center 0; background-size: contain; background-repeat: no-repeat; } // Buchstaben .Complete_Button_lettersearch{ .border_radius_button_normal; .box_shadow_standard_light; .border_normal; // border: 1px solid #D3DCE3; text-align: center; cursor: pointer; } // Text .Complete_Button_text{ .border_radius_button_normal; .background_color_10_gray; border-color: @gray_50; cursor: pointer; } .Complete_Button_text_hover { .border_radius_button_normal; .border_hover; text-align: center; cursor: pointer; .background_color_30_gray; } .Complete_Button_text_active{ color: @gray; } .Complete_Button_text_icon_before{ .Complete_Button_normal; padding-left: 30px !important; background-position: 6px center !important; background-repeat: no-repeat !important; background-size: 20px auto !important; .Button_size_h32_auto; } .Complete_Button_text_icon_before_hover{ .Complete_Button_text_icon_before; .box_shadow_standard_light_hover; } .Complete_Button_text_icon_before_active{ .Complete_Button_text_icon_before; .box_shadow_standard_light_hover; } // Buttons nur Icon .Complete_Button_Icon_normal { /*.background_color_10_gray;*/ .box_shadow_standard_light; .border_normal; .border_radius_button_normal; } .Complete_Button_Icon_hover { /*.background_color_20_gray;*/ .box_shadow_standard_light_hover; .border_hover; .border_radius_button_normal; } .Complete_Button_Icon_active { /*.background_color_30_gray;*/ .border_active; .border_radius_button_normal; .box_shadow_standard_light_inset; background-color: @color_positive_action_active; } // ############################# // Button Sub Menupunkte .Complete_Button_Module_Menu_Links{ .background_color_10_gray; } .Complete_Button_Module_Menu_Links_Hover{ .background_color_30_gray; .color_5_gray; } .Complete_Button_Module_Menu_Links_active{ .background_color_10_gray; } // Button Sub Sub Menupunkte .Complete_Button_Module_Menu_Links_Sub_Hover { margin-left: 2px; padding-top: 0px; padding-bottom: 5px; .border_normal; .background_color_15_gray; } .Complete_Button_Module_Menu_Links_Sub { margin-left: 3px; padding-top: 0px; padding-bottom: 5px; .border_normal; border-top-width: 0px; .background_color_10_gray; margin-top: -7px; padding-left: 14px; width: 93%; } /*##################################################### Images svg #####################################################*/ /*delete*/ img[url*="delete"]{.gradient_vertical (@gray_30, @gray_30);} //