Make toggle class accessible

This commit is contained in:
Hadi Nategh 2018-06-06 11:05:19 +02:00
parent 9e31fa65dc
commit f7165e2bca
6 changed files with 176 additions and 174 deletions

View File

@ -32,7 +32,7 @@ if ($GLOBALS['egw_info']['user']['apps']['notifications'])
echo '
<div id="egwpopup" style="display: none; z-index: 999;">
<div id="egwpopup_header">'.lang('Notifications').
'<span class="egwpopup_toggle"></span><span class="egwpopup_seenall" title="'. lang('mark all as read').'"></span>'.
'<span class="button_right_toggle"></span><span class="egwpopup_seenall" title="'. lang('mark all as read').'"></span>'.
'<span class="egwpopup_deleteall" title="'.lang('delete all messages').'"></span></div>
<div id="egwpopup_list"></div>
</div>

View File

@ -632,7 +632,7 @@
};
window.app.notifications = new self();
// toggle notifications bar
jQuery('.egwpopup_toggle', '#egwpopup').click(function(){window.app.notifications.toggle();});
jQuery('.button_right_toggle', '#egwpopup').click(function(){window.app.notifications.toggle();});
$egwpopup_fw.click(function(){window.app.notifications.toggle();});
jQuery(".egwpopup_deleteall", '#egwpopup').click(function(){
et2_dialog.show_dialog( function(_button){

View File

@ -3772,49 +3772,6 @@ td.lettersearch {
text-align: center;
padding: 15px;
}
#egwpopup div#egwpopup_header .egwpopup_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
#egwpopup div#egwpopup_header .egwpopup_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:before,
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:after {
background-color: gray;
}
#egwpopup div#egwpopup_header .egwpopup_seenall {
float: right;
width: 10px;
@ -3948,6 +3905,49 @@ td.message span.message {
height: auto;
width: 100%;
}
.button_right_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
.button_right_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
.button_right_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
.button_right_toggle:hover:before,
.button_right_toggle:hover:after {
background-color: gray;
}
/**
* EGroupware: Stylite Pixelegg template
*

View File

@ -3761,49 +3761,6 @@ td.lettersearch {
text-align: center;
padding: 15px;
}
#egwpopup div#egwpopup_header .egwpopup_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
#egwpopup div#egwpopup_header .egwpopup_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:before,
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:after {
background-color: gray;
}
#egwpopup div#egwpopup_header .egwpopup_seenall {
float: right;
width: 10px;
@ -3937,6 +3894,49 @@ td.message span.message {
height: auto;
width: 100%;
}
.button_right_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
.button_right_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
.button_right_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
.button_right_toggle:hover:before,
.button_right_toggle:hover:after {
background-color: gray;
}
/**
* EGroupware: Stylite Pixelegg template
*

View File

@ -204,48 +204,6 @@
color: silver;
text-align: center;
padding: 15px;
.egwpopup_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position:relative;
margin-top: 1px;
margin-left: -20px;
float:left;
&:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
&:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
&:hover:before, &:hover:after {
background-color: gray;
}
}
.egwpopup_seenall {
float: right;
width: 10px;
@ -385,4 +343,48 @@ td.message {
height: auto;
width: 100%;
}
}
}
.button_right_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position:relative;
margin-top: 1px;
margin-left: -20px;
float:left;
&:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
&:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
&:hover:before, &:hover:after {
background-color: gray;
}
}

View File

@ -3783,49 +3783,6 @@ td.lettersearch {
text-align: center;
padding: 15px;
}
#egwpopup div#egwpopup_header .egwpopup_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
#egwpopup div#egwpopup_header .egwpopup_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:before,
#egwpopup div#egwpopup_header .egwpopup_toggle:hover:after {
background-color: gray;
}
#egwpopup div#egwpopup_header .egwpopup_seenall {
float: right;
width: 10px;
@ -3959,6 +3916,49 @@ td.message span.message {
height: auto;
width: 100%;
}
.button_right_toggle {
height: 32px;
width: 32px;
cursor: pointer;
position: relative;
margin-top: 1px;
margin-left: -20px;
float: left;
}
.button_right_toggle:after {
content: "";
position: absolute;
left: 13px;
top: 5px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(145deg) translate(8px, -1px);
-ms-transform: rotate(145deg) translate(8px, -1px);
-moz-transform: rotate(145deg) translate(8px, -1px);
-webkit-transform: rotate(145deg) translate(8px, -1px);
}
.button_right_toggle:before {
content: "";
position: absolute;
left: 0px;
top: 0px;
width: 10px;
height: 2px;
background-color: silver;
backface-visibility: hidden;
border-radius: 6px;
transform: rotate(45deg) translate(8px, -2px);
-ms-transform: rotate(45deg) translate(8px, -2px);
-moz-transform: rotate(45deg) translate(8px, -2px);
-webkit-transform: rotate(45deg) translate(8px, -2px);
}
.button_right_toggle:hover:before,
.button_right_toggle:hover:after {
background-color: gray;
}
/**
* EGroupware: Stylite Pixelegg template
*