extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-22 06:30:59 +01:00
Code Issues Packages Projects Releases Wiki Activity

Improve styling for quick add

Browse Source
This commit is contained in:
Hadi Nategh 2019-03-25 16:36:21 +01:00
parent 5110e999b5
commit 53bff47792
7 changed files with 213 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
pixelegg/css/mobile.css
View File

@ -5097,14 +5097,40 @@ td.message span.message {
-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_info_items #topmenu_info_quick_add .chzn-container {
position: fixed;
right: 15px !important;
top: 40px;
width: 160px !important;
background: #FFFFFF;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #aaa;
margin-bottom: 12px;
margin-left: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #ffffff;
margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add 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: -3px;
left: 35px;
}
#egw_fw_topmenu_info_items img#topmenu_info_error {
width: 16px;

38
pixelegg/css/monochrome.css
View File

@ -5086,14 +5086,40 @@ td.message span.message {
-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_info_items #topmenu_info_quick_add .chzn-container {
position: fixed;
right: 15px !important;
top: 40px;
width: 160px !important;
background: #FFFFFF;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #aaa;
margin-bottom: 12px;
margin-left: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #ffffff;
margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add 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: -3px;
left: 35px;
}
#egw_fw_topmenu_info_items img#topmenu_info_error {
width: 16px;

38
pixelegg/css/pixelegg.css
View File

@ -5097,14 +5097,40 @@ td.message span.message {
-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_info_items #topmenu_info_quick_add .chzn-container {
position: fixed;
right: 15px !important;
top: 40px;
width: 160px !important;
background: #FFFFFF;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #aaa;
margin-bottom: 12px;
margin-left: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #ffffff;
margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add 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: -3px;
left: 35px;
}
#egw_fw_topmenu_info_items img#topmenu_info_error {
width: 16px;

2
pixelegg/js/fw_pixelegg.js
View File

@ -53,7 +53,7 @@
jQuery('#egw_fw_print').click(function(){window.framework.print();});
jQuery('#egw_fw_logout').click(function(){ window.framework.redirect(this.getAttribute('data-logout-url')); });
jQuery('form[name^="tz_selection"]').children().on('change', function(){framework.tzSelection(this.value); return false;});
window.egw.link_quick_add('quick_add');
window.egw.link_quick_add('topmenu_info_quick_add');
// allowing javascript urls in topmenu and sidebox only under CSP by binding click handlers to them
var href_regexp = /^javascript:([^\(]+)\((.*)?\);?$/;

57
pixelegg/js/slider.js
View File

@ -124,56 +124,33 @@ egw_LAB.wait(function() {
jQuery('#quick_add').on({
mouseover: function(ev){
// do NOT react on bubbeling events from contained selectbox
if (ev.relatedTarget && ev.relatedTarget.id != 'quick_add_selectbox' && ev.target.id !='quick_add_selectbox')
var $select = jQuery('#quick_add_selectbox');
var $chosen_div = $select.next();
if ($chosen_div.hasClass('chzn-container'))
{
jQuery(this).css({
transition: "0.2s ease-out 0s",
width: "166px",
'border-top-left-radius': "20px",
'background-color': "#0B5FA4"
});
jQuery('select', this).css({
transition: "0.1s linear 0.2s",
visibility: "visible",
width:"120px"
});
$chosen_div.show();
}
else
{
$select.chosen({
disable_search: true
});
$chosen_div = $select.next();
}
$select.trigger('liszt:open');
$select.on('liszt:hiding_dropdown', function(e){
$chosen_div.hide();
});
ev.stopPropagation();
},
mouseout: function(ev){
// do NOT react on bubbeling events from contained selectbox
if (ev.target && ev.relatedTarget && ev.target.id != 'quick_add_selectbox'
&& ev.relatedTarget.id != 'quick_add'
&& ev.relatedTarget.id !='quick_add_selectbox'
&& ev.relatedTarget.tagName != "OPTION")
&& !jQuery(ev.relatedTarget).hasClass('chzn-container'))
{
jQuery(this).css({
transition: "0.6s ease-out 0s",
width: "16px",
'border-top-left-radius': "0px",
'background-color': "transparent"
});
jQuery('select', this).css({
transition: "0s linear 0s",
visibility: "hidden",
width:"10px"
});
jQuery('#quick_add_selectbox').next().hide();
}
ev.stopPropagation();
},
focusout: function (ev)
{
jQuery(this).css({
transition: "0.6s ease-out 0s",
width: "16px",
'border-top-left-radius': "0px",
'background-color': "transparent"
});
jQuery('select', this).css({
transition: "0s linear 0s",
visibility: "hidden",
width:"10px"
});
}
});

44
pixelegg/less/layout_raster_buttons.less
View File

@ -196,16 +196,44 @@
// ##############################################################################
// quick_add selectbox
// ADD different APPs
.chzn-container {
position: fixed;
right: 15px !important;
top: 40px;
width: 160px !important;
background: @gray_0;
&:before {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #aaa;
margin-bottom: 12px;
margin-left: 0px;
}
&:after {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #ffffff;
margin-bottom: 11px;
}
}
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: -3px;
left: 35px;
}
}

38
pixelegg/mobile/fw_mobile.css
View File

@ -5108,14 +5108,40 @@ td.message span.message {
-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_info_items #topmenu_info_quick_add .chzn-container {
position: fixed;
right: 15px !important;
top: 40px;
width: 160px !important;
background: #FFFFFF;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #aaa;
margin-bottom: 12px;
margin-left: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after {
content: '';
position: absolute;
bottom: 50%;
left: 42%;
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-bottom: 12px solid #ffffff;
margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add 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: -3px;
left: 35px;
}
#egw_fw_topmenu_info_items img#topmenu_info_error {
width: 16px;