diff --git a/pixelegg/content-element-library/cal_widgets.html b/pixelegg/content-element-library/cal_widgets.html
new file mode 100644
index 0000000000..be1023593a
--- /dev/null
+++ b/pixelegg/content-element-library/cal_widgets.html
@@ -0,0 +1,55 @@
+
+
+
+
+
+
+
+
+
+
+
+ [EGroupware] Content Element Library
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ CALENDAR WIDGET
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css
index 8f445be05d..b00c2b2ccf 100644
--- a/pixelegg/css/pixelegg.css
+++ b/pixelegg/css/pixelegg.css
@@ -2243,17 +2243,12 @@ action buttons, left aligned for "extra" controls
################################################################*/
/*ADD Button*/
#admin-categories-index_add {
- background-color: #0b5fa4 !important;
+ /*background-color: @egw_color_blue_lighter !important;*/
color: #FFF;
text-shadow: none;
/* height: auto;*/
background-image: none !important;
- -webkit-border-radius: 3px;
- -webkit-border-top-left-radius: 20px;
- -moz-border-radius: 3px;
- -moz-border-radius-topleft: 20px;
- border-radius: 3px;
- border-top-left-radius: 20px;
+ /*.border_radius_button_lefttop;*/
}
#admin-categories-index_add:before {
content: "+";
@@ -4446,17 +4441,12 @@ button[id="cancel"]:active {
*
######################################################################################## */
button.add {
- background-color: #0b5fa4 !important;
+ /*background-color: @egw_color_blue_lighter !important;*/
color: #FFF;
text-shadow: none;
/* height: auto;*/
background-image: none !important;
- -webkit-border-radius: 3px;
- -webkit-border-top-left-radius: 20px;
- -moz-border-radius: 3px;
- -moz-border-radius-topleft: 20px;
- border-radius: 3px;
- border-top-left-radius: 20px;
+ /*.border_radius_button_lefttop;*/
}
button.add:before {
content: "+";
@@ -5258,25 +5248,71 @@ img {
- Name / Date
###################################################*/
#egw_fw_topmenu_addons {
- /*hover*/
+ /* span#quick_add{
+ .Complete_Button_add;
+ .Button_size_square_16;
+ .border_normal;
+ .box_shadow_standard_light;
+ float: right;
+ position: fixed;
+ right: 83px;
+ top: 5px;
+ padding: 0.5em;
+ &:before {content: "+"; font-size: 2em; color: @egw_color_1; line-height: 0.6em}
+ &:focus {.box_shadow_standard_light_inset;};
+ .transition (0.2s, ease-out);
+
+ select#quick_add_selectbox{
+ position: fixed;
+ right: 83px;
+ .border_normal;
+ .box_shadow_standard_light;
+ height: 26px;
+ padding: 0 0 0 10px;
+ font-size: 0.9em;
+ line-height: 1.1em;
+
+ visibility: hidden;
+
+ transition-property: visibility;
+ transition-duration: 0s;
+ transition-timing-function: linear;
+ transition-delay: 0s;
+ }
+ }
+
+
+
+
+ hover
+ span#quick_add:hover {
+
+ width: 166px !important;
+ .box_shadow_standard_light_hover;
+
+ select#quick_add_selectbox {
+ .box_shadow_standard_light_hover;
+ .box_shadow_none;
+ border: none;
+ position: relative !important;
+ right: 1px !important;
+ top: -5px;
+ z-index: 200;
+ visibility: visible !important;
+ }
+
+ }*/
}
#egw_fw_topmenu_addons span#quick_add {
- /*.Complete_Button_add;*/
- width: 16px;
- height: 16px;
border: 1px solid rgba(0, 0, 0, 0.15);
- -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);
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
float: right;
+ padding: 0.5em;
position: fixed;
right: 83px;
top: 5px;
- padding: 0.5em;
- -webkit-transition: all 0.2s ease-out;
- -moz-transition: all 0.2s ease-out;
- -o-transition: all 0.2s ease-out;
- transition: all 0.2s ease-out;
+ width: 16px;
+ height: 16px;
}
#egw_fw_topmenu_addons span#quick_add:before {
content: "+";
@@ -5284,43 +5320,13 @@ img {
color: #ffc200;
line-height: 0.6em;
}
-#egw_fw_topmenu_addons span#quick_add:focus {
- -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
- -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
- box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
-}
-#egw_fw_topmenu_addons span#quick_add select#quick_add_selectbox {
- position: fixed;
- right: 83px;
- /*.border_normal;*/
- /*.box_shadow_standard_light;*/
- /*height: 26px;*/
- padding: 0 0 0 10px;
- font-size: 0.9em;
- /*line-height: 1.1em;*/
+#egw_fw_topmenu_addons select#quick_add_selectbox {
visibility: hidden;
- transition-property: visibility;
- transition-duration: 0s;
- transition-timing-function: linear;
- transition-delay: 0s;
-}
-#egw_fw_topmenu_addons span#quick_add:hover {
- width: 166px !important;
- -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
- -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
- box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-}
-#egw_fw_topmenu_addons span#quick_add:hover select#quick_add_selectbox {
- /*.box_shadow_standard_light_hover;*/
- -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);
- border: none;
+ border: medium none;
+ box-shadow: 0 0 0 rgba(0, 0, 0, 0);
position: relative !important;
right: 1px !important;
top: -5px;
- z-index: 200;
- visibility: visible !important;
}
#egw_fw_logout {
background-image: url(../images/logout.png);
diff --git a/pixelegg/js/slider.js b/pixelegg/js/slider.js
index 80c6ab4ed3..642275f72e 100644
--- a/pixelegg/js/slider.js
+++ b/pixelegg/js/slider.js
@@ -87,6 +87,49 @@ egw_LAB.wait(function() {
+
+// ADD
+
+ function addListeners(){
+
+ if(window.addEventListener) {
+ // ADD
+ document.getElementById('quick_add').addEventListener("mouseover",quick_add_func_over,false);
+ document.getElementById('quick_add').addEventListener("mouseout",quick_add_func_out,false);
+
+
+
+ } else if (window.attachEvent){ // Added For Inetenet Explorer versions previous to IE9
+
+ document.getElementById('quick_add').attachEvent("onmouseover",quick_add_func_over);
+ document.getElementById('quick_add').attachEvent("onmouseout",quick_add_func_out);
+ }
+
+ // Write your functions here
+
+ function quick_add_func_over(){
+ this.style.transition = "0.2s ease-out 0s";
+ this.style.width = "166px";
+ this.style.borderTopLeftRadius = "20px";
+ this.style.backgroundColor = "#0B5FA4";
+ quick_add_selectbox.style.transition = "0.1s linear 0.2s";
+ quick_add_selectbox.style.visibility = "visible";
+ }
+
+ function quick_add_func_out(){
+ this.style.transition = "0.2s ease-out 0s";
+ this.style.width = "16px";
+ this.style.borderTopLeftRadius = "0px";
+ this.style.backgroundColor = "transparent";
+ quick_add_selectbox.style.transition = "0s linear 0s";
+ quick_add_selectbox.style.visibility = "hidden";
+ }
+
+
+
+ }
+ window.onload = addListeners;
+
/* #egw_fw_topmenu_info_items {
bottom: 0;
display: flex;
diff --git a/pixelegg/less/def_buttons.less b/pixelegg/less/def_buttons.less
index 424e7fc1f1..1a9fae8f2f 100755
--- a/pixelegg/less/def_buttons.less
+++ b/pixelegg/less/def_buttons.less
@@ -59,13 +59,15 @@
.box_shadow_standard_light_inset;
}
+
+/*ADD / Hinzufügen*/
.Complete_Button_add {
- background-color: @egw_color_blue_lighter !important;
+ /*background-color: @egw_color_blue_lighter !important;*/
color: #FFF;
text-shadow: none;
/* height: auto;*/
background-image: none !important;
- .border_radius_button_lefttop;
+ /*.border_radius_button_lefttop;*/
&:before {content: "+";font-size: 1.5em;color: @egw_color_1; line-height: 1.1em;}
}
@@ -77,6 +79,8 @@
.border_radius_button_lefttop;
}
+
+
.Complete_Button_hinweis{
.Button_size_square_32;
.border_normal;
diff --git a/pixelegg/less/def_design_pattern_color_font_shadow.less b/pixelegg/less/def_design_pattern_color_font_shadow.less
index 0ad1165d78..466daf9d27 100755
--- a/pixelegg/less/def_design_pattern_color_font_shadow.less
+++ b/pixelegg/less/def_design_pattern_color_font_shadow.less
@@ -386,7 +386,15 @@
}
- /*Icon Buttons ################## */
+ /*Icon Buttons ################## */
+
+ @mass_xs : 12px;
+ @mass_s : 16px;
+ @mass_m : 24px;
+ @mass_l : 32px;
+ @mass_xl : 40px;
+ @mass_xxl: 48px;
+
/* ##############
# big Icon #
@@ -395,47 +403,11 @@
# #
# #
################*/
-
-.dimension_width_height_xl{
-
- width: 32px;
- height: 32px;
-}
-
-/* ###########
- # medium #
- # Icon #
- # #
- # 24 x 24 #
- # #
- #############*/
-
-.dimension_width_height_m{
-
- width: 24px;
- height: 24px;
-}
-
-/* ########
- # small #
- # Icon #
- # 16x16 #
- ##########*/
-
-.dimension_width_height_s{
-
- width: 16px;
- height: 16px;
-}
-
-/* ####
- #xs#
- ####*/
-.dimension_width_height_xs{
-
- width: 12px;
- height: 12px;
-}
+.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_s{width: @mass_s; height: @mass_s;}
+.dimension_width_height_xs{width: @mass_xs; height: @mass_xs;}
/* only Buttons ################## */
@@ -447,35 +419,14 @@
# N x 32 #
############################*/
-.dimension_height_xl{ height: 40px; }
+.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_s{ height: @mass_s;}
+.dimension_height_xs{ height: @mass_xs;}
-/* ##########################
- # large Button #
- # #
- # #
- # #
- # N x 32 #
- ############################*/
-
-.dimension_height_l{ height: 32px; }
-
-/* ##########################
- # medium Button #
- # #
- # N x 24 #
- ############################*/
-
-.dimension_height_m{ height: 24px; }
-
-/* ##########################
- # small Button #
- # #
- # N x 16 #
- ############################*/
-
-.dimension_height_s{ height: 16px; }
-
// Rahmen für Schaltflächen
@@ -668,4 +619,4 @@
//
-//
\ No newline at end of file
+//
\ No newline at end of file
diff --git a/pixelegg/less/etemplate2.less b/pixelegg/less/etemplate2.less
index e5742e9746..1cf792b6d3 100755
--- a/pixelegg/less/etemplate2.less
+++ b/pixelegg/less/etemplate2.less
@@ -619,7 +619,7 @@ div.et2_link_entry input.ui-autocomplete-input {
float: left;
margin: 0.5em 2em;
padding: 0.5em;
- .dimension_width_height_xl;
+ .dimension_width_height_l;
&:hover {.Complete_Button_Icon_hover;}
&:active {.Complete_Button_Icon_active; }
diff --git a/pixelegg/less/layout_raster.less b/pixelegg/less/layout_raster.less
index 5eab344ce6..4dd5430961 100644
--- a/pixelegg/less/layout_raster.less
+++ b/pixelegg/less/layout_raster.less
@@ -89,6 +89,7 @@
/*.Button_size_square_32;*/
padding: 0.3em 0.4em;
.Complete_Button_normal;
+
&:hover{.Complete_Button_hover;.color_100_gray;}
&:active {.Complete_Button_active;}
@@ -267,9 +268,34 @@
// ########################################
// quick_add
+
+ span#quick_add {
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
+ float: right;
+ padding: 0.5em;
+ position: fixed;
+ right: 83px;
+ top: 5px;
+ .dimension_width_height_s;
+ &:before {content: "+"; font-size: 2em; color: @egw_color_1; line-height: 0.6em}
+ }
+
+ select#quick_add_selectbox {
+
+ visibility: hidden;
+ border: medium none;
+ box-shadow: 0 0 0 rgba(0, 0, 0, 0);
+ position: relative !important;
+ right: 1px !important;
+ top: -5px;
- span#quick_add{
- /*.Complete_Button_add;*/
+}
+
+
+
+/* span#quick_add{
+ .Complete_Button_add;
.Button_size_square_16;
.border_normal;
.box_shadow_standard_light;
@@ -285,12 +311,12 @@
select#quick_add_selectbox{
position: fixed;
right: 83px;
- /*.border_normal;*/
- /*.box_shadow_standard_light;*/
- /*height: 26px;*/
+ .border_normal;
+ .box_shadow_standard_light;
+ height: 26px;
padding: 0 0 0 10px;
font-size: 0.9em;
- /*line-height: 1.1em;*/
+ line-height: 1.1em;
visibility: hidden;
@@ -304,14 +330,14 @@
- /*hover*/
+ hover
span#quick_add:hover {
width: 166px !important;
.box_shadow_standard_light_hover;
select#quick_add_selectbox {
- /*.box_shadow_standard_light_hover;*/
+ .box_shadow_standard_light_hover;
.box_shadow_none;
border: none;
position: relative !important;
@@ -321,7 +347,7 @@
visibility: visible !important;
}
- }
+ }*/
}