extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-26 16:48:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

WIP toggle sidebar menu:

Browse Source 
- Fix toggle button style
This commit is contained in:
Hadi Nategh 2015-09-09 12:56:33 +00:00
parent b24dc04138
commit 2d0a6859b3
3 changed files with 27 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
pixelegg/css/mobile.css
View File

@ -2196,7 +2196,6 @@ body {
* @package pixelegg
* @version $Id$
*/
@import-once "def_colors.less";
#socialMedia {
position: relative;
bottom: 20px;
@ -4990,19 +4989,6 @@ td.message span.message {
float: right;
margin-right: 5px;
}
#egw_fw_sidebar #egw_fw_toggler:hover span {
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler:hover span:before {
transition-duration: 0.7s;
transform: rotate(156deg) translate(7px, 1px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler:hover span:after {
transition-duration: 0.7s;
transform: rotate(-150deg) translate(10px, -1px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span {
background-color: transparent;
position: relative;
@ -5014,8 +5000,9 @@ td.message span.message {
top: 11px;
}
#egw_fw_sidebar #egw_fw_toggler span:before {
transition-duration: 1s;
transform: rotate(45deg) translate(5px, 5px);
transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span:before,
#egw_fw_sidebar #egw_fw_toggler span:after {
@ -5023,8 +5010,8 @@ td.message span.message {
position: absolute;
left: 0;
top: -9px;
width: 100%;
height: 5px;
width: 12px;
height: 3px;
background-color: #b3b3b3;
backface-visibility: hidden;
border-radius: 2px;
@ -5032,7 +5019,8 @@ td.message span.message {
#egw_fw_sidebar #egw_fw_toggler span:after {
top: 9px;
transition-duration: 0.7s;
transform: rotate(-45deg) translate(7px, -8px);
transform: rotate(-145deg) translate(8px, 2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn {
/* toggler button*/
@ -5049,6 +5037,8 @@ td.message span.message {
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span:before,
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span:after {
transform: none;
width: 100%;
height: 5px;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span {
background-color: #b4b4b4;

28
pixelegg/css/pixelegg.css
View File

@ -2185,7 +2185,6 @@ body {
* @package pixelegg
* @version $Id$
*/
@import-once "def_colors.less";
#socialMedia {
position: relative;
bottom: 20px;
@ -4979,19 +4978,6 @@ td.message span.message {
float: right;
margin-right: 5px;
}
#egw_fw_sidebar #egw_fw_toggler:hover span {
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler:hover span:before {
transition-duration: 0.7s;
transform: rotate(156deg) translate(7px, 1px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler:hover span:after {
transition-duration: 0.7s;
transform: rotate(-150deg) translate(10px, -1px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span {
background-color: transparent;
position: relative;
@ -5003,8 +4989,9 @@ td.message span.message {
top: 11px;
}
#egw_fw_sidebar #egw_fw_toggler span:before {
transition-duration: 1s;
transform: rotate(45deg) translate(5px, 5px);
transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span:before,
#egw_fw_sidebar #egw_fw_toggler span:after {
@ -5012,8 +4999,8 @@ td.message span.message {
position: absolute;
left: 0;
top: -9px;
width: 100%;
height: 5px;
width: 12px;
height: 3px;
background-color: #b3b3b3;
backface-visibility: hidden;
border-radius: 2px;
@ -5021,7 +5008,8 @@ td.message span.message {
#egw_fw_sidebar #egw_fw_toggler span:after {
top: 9px;
transition-duration: 0.7s;
transform: rotate(-45deg) translate(7px, -8px);
transform: rotate(-145deg) translate(8px, 2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn {
/* toggler button*/
@ -5038,6 +5026,8 @@ td.message span.message {
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span:before,
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span:after {
transform: none;
width: 100%;
height: 5px;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span {
background-color: #b4b4b4;

29
pixelegg/less/layout_raster_sidebar.less
View File

@ -339,34 +339,20 @@
float: right;
margin-right:5px;
&:hover {
span {
background-color: #b4b4b4;
&:before {
transition-duration: 0.7s;
transform: rotate(156deg) translate(7px, 1px);
background-color: #b4b4b4;
}
&:after {
transition-duration: 0.7s;
transform: rotate(-150deg) translate(10px, -1px);
background-color: #b4b4b4;
}
}
}
span {
background-color: transparent;
&:before{
transition-duration: 1s;
transform: rotate(45deg) translate(5px, 5px);
transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
&:before, &:after {
content: "";
position: absolute;
left: 0;
top: -9px;
width: 100%;
height: 5px;
width:12px;
height: 3px;
background-color: #b3b3b3;
backface-visibility: hidden;
border-radius: 2px;
@ -374,7 +360,8 @@
&:after {
top:9px;
transition-duration: 0.7s;
transform: rotate(-45deg) translate(7px, -8px);
transform: rotate(-145deg) translate(8px, 2px);
background-color: #b4b4b4;
}
position: relative;
display: block;
@ -395,6 +382,8 @@
transition: all 0.3s;
&:before, &:after {
transform:none;
width:100%;
height:5px;
}
}
&:hover {