/** * EGroupware: Stylite Pixelegg template * * et2 Messages * * 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 <stefan.reinhard@pixelegg.de> * @package pixelegg * @version $Id$ */ @import (reference) "def_design_pattern_color_font_shadow.less"; @import (reference) "def_buttons.less"; // calender #uical_select_resource {background-color: @color_hover_row;} .uiaccountselection .primary_group {background-color: @color_hover_row;} option:checked {background-color: @color_hover_row;} .ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; .box_shadow (0 0 5px #aaa); } /* Component containers ----------------------------------*/ .ui-widget { .basefontfamily; // font-family: Lucida Grande,Lucida Sans,Arial,sans-serif; font-size: 1.1em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { .basefontfamily; // font-family: Lucida Grande,Lucida Sans,Arial,sans-serif; .fontsize_m; } .ui-widget-content { /*.bordered (@color-hint,@color-hint,@color-hint,@color-hint);*/ // border: 1px solid #a6c9e2; // background: #fcfdfd url(images/ui-bg_inset-hard_100_fcfdfd_1x100.png) 50% bottom repeat-x; // color: #222222; background-image: none; .color_50_gray !important; background: white; } .ui-widget-content a { // color: #222222; .color_40_gray; } .ui-widget-header { // border: 1px solid #4297d7; .bordered(0px, 0px, 0px,0px) !important; /*.gradient_thead !important;*/ background-color: @egw_color_2_a; /*border-color: @gray_10;*/ // background: #5c9ccc url(images/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x; // color: #ffffff; color : @gray_100; font-weight: bold; background-image: none; border: 0px !important; } .ui-widget-header a { // color: #ffffff; .color_0_gray; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { .bordered(1px, 1px, 1px,1px); border-color: @gray_30; // background: #dfeffc url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x; background: transparent; font-weight: normal; .color_90_gray; // float: left; // position: relative; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { .color_40_gray; text-decoration: none; } .ui-state-default .ui-icon.ui-icon-triangle-1-s { background: url("../images/arrow_down.svg"); background-size: 8px auto; background-position: center; background-repeat: no-repeat; } .ui-widget-header .ui-icon.ui-icon-check { background-image: url("../images/check.svg"); background-size: 12px auto; background-position: center; background-repeat: no-repeat; filter: brightness(2.5); } .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-widget-content .ui-state-focus{ border-color: @gray_10; background: @color_selected_row; background-image: none; color: @gray_0; font-weight: normal; } .ui-state-focus.ui-menu-item a {color:@gray_10} .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover{ .bordered(1px, 1px, 1px,1px); border-color: @gray_10; // background: #d0e5f5 url(images/ui-bg_glass_75_d0e5f5_1x400.png) 50% 50% repeat-x; background: @color_selected_row; background-image: none; // font-size: 105%; .color_0_gray; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited { .color_50_gray; text-decoration: none; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { .bordered(1px, 1px, 1px,1px); border-color: @gray_20; background-image: none; font-weight: bold; .color_50_gray; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { .color_50_gray; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { .bordered(1px, 1px, 1px,1px); border-color: @gray_30; // background: #fbec88 url(images/ui-bg_flat_55_fbec88_40x100.png) 50% 50% repeat-x; .color_50_gray; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { .color_10_gray; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { .bordered(1px, 1px, 1px,1px); border-color: @gray_10; // background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; .color_30_gray; } .ui-state-error a, .ui-widget-content .ui-state-error a,{ color: @red; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: @red; } // used in mail for drag and drop mails .drop-hover {background-color: @egw_color_1_e} .ui-icon-close{ /*visibility: hidden;*/ /*background-image: url(../images/search.png);*/ background-image: url("../images/cancel.svg"); background-repeat: no-repeat; background-color: @gray_0; background-size: 12px 12px; .dimension_width_height_s; margin: 2px; padding: 1px; margin-top: 1px; background-position: 0px 0px; .rounded (2px); &:hover{ background-color: transparent;} &:active { background-color: @color_cancel_action_active !important; } } span.ui-icon-close {margin-top: 0px; top: 5px;} .et2_link_entry .ui-icon-close {margin-top: -5px; top: 9px !important;} /*Schliessen x*/ .ui-icon-closethick { background-image: url(../images/close.svg) !important; background-repeat: no-repeat; background-color: @gray_0; background-size: contain; background-position: 0 0 !important; .color_0_gray; .dimension_height_s; &:hover{ background-color: @gray_10; color: @gray_90; .box_shadow_standard_light_hover;} &:active { .box_shadow_standard_light_active !important; background-color: @color_cancel_action_active !important; } } /*###########################################*/ /*Menu */ .ui-menu{ .ui-menu-item { padding: 0px; a { line-height: 24px; margin: 0px; padding: 2px 5px; input {padding: 0;} img {padding: 0;} } a.ui-state-focus { margin: 0px !important; line-height: 24px; padding: 2px 5px; border: none; } } } /*###########################################*/ /* col selection */ span.ui-multiselect-header {color: @gray_0;} span.ui-icon-search { background-image: url(../images/search.svg) !important; background-position: 0px; background-size: 10px 10px; } .ui-corner-all{.rounded(3px)} // e.g. Corner Favorites .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 3px; } // e.g. Corner Favorites .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 3px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 3px; } /*###########################################*/ /*Dialog: edit row*/ .ui-widget-overlay { background: @gray_20; } .ui-dialog { z-index: 1000; box-shadow: -2px 1px 9px 3px @gray_30; .ui-dialog-buttonpane { padding-left: .8em; padding-right: .8em; padding-top: 0.7em; } .ui-dialog-titlebar { padding-left: .8em; padding-right: .8em; font-size: 12pt; border: none; font-weight: normal; background: white; } .ui-dialog-titlebar-close { right: .8em; } } .ui-widget-content { border: 1px solid @gray_30; .et2_selectbox { button.et2_button_text, select.et2_selectbox {height: 20px;} button {background-image: none;} div.ui-widget-header { ul li label.ui-state-hover {background-color: @color_selected_row; font-weight: normal;} } } } button.ui-button { .Complete_Button_text_icon_before; border-color: @gray_30; outline: none; &:hover{ background-color: @gray_30; color: @gray_90;} .ui-button-icon-primary { &:hover{ background-color: @gray_30; color: @gray_90; box-shadow: none; } } } /*###########################################*/ /*Dialog: calendar edit series*/ .ui-dialog-buttonset{ button.ui-button-text-only { background-color: @gray_20; background: inherit; color: @gray_100 !important; font-weight: normal !important; &:hover{ background-color: @gray_30;} } button.ui-button{ .Complete_Button_text_icon_before; &:hover{ background-color: @gray_30; color: @gray_90;} } } /*###########################################*/ /*Dialog: calendar edit series*/ // Kalender Widget div#ui-datepicker-div { .rounded (3px); border: 1px solid @gray_30; .box_shadow_standard_light_inset; } .ui-datepicker-header { background-color: transparent;} .ui-datepicker { .ui-state-default { border: none; padding: 2px; text-align: center; } .ui-state-highlight {.color_90_gray; font-weight: bold;} .ui-datepicker-close {border:1px solid #b4b4b4;} // Kalender Tabelle table.ui-datepicker-calendar { //aktiver Tag .ui-state-active {background-color: @egw_color_2_a;color: @gray_0;} } div.ui-timepicker-div { padding: 3px; //Uhrzeit - Label dt.ui_tpicker_time_label {font-size: 0.9em;margin-top:6px;} //Uhrzeit dd.ui_tpicker_time { padding-left: 75px; background-color: @egw_color_1_a; input {font-size: 1.3em;} } //Stunde - Label dt.ui_tpicker_time_label {font-size: 0.9em} // Minute - Label dt.ui_tpicker_minute_label {font-size: 0.9em} // Schieberegler div.ui_tpicker_hour_slider { span.ui-slider-handle {background-color: @egw_color_2_a;padding: 1px;outline: none;} } div.ui_tpicker_minute_slider { span.ui-slider-handle {background-color: @egw_color_2_a;padding: 1px;outline: none;} } } //Buttons div.ui-datepicker-buttonpane {background-color: @color_button_panel_bg_color;} button.ui-datepicker-current .ui-state-hover { background-color: @color_positive_action_active !important; &:active {background-color: @color_positive_action_active;} } } // Button now .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { &:active {background-color: @color_positive_action_active;} } // Button close .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close { &:hover { background-color: @color_cancel_action_hover !important; color: @gray_100; } &:active { background-color: @color_cancel_action_active !important; color: @gray_80; } } // Overwrite not used / loadable background image .ui-widget-overlay, .ui-widget-shadow { background-image: none; }