WIP toggle sidebar menu:

- Fix some styles for Safari and IE
This commit is contained in:
Hadi Nategh 2015-09-24 09:24:06 +00:00
parent 17afd5d508
commit 35ef38e040
3 changed files with 45 additions and 0 deletions

View File

@ -4986,7 +4986,12 @@ td.message span.message {
}
#egw_fw_sidebar #egw_fw_toggler span:before {
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
-ms-transform: rotate(145deg) translate(8px, -2px);
-moz-transform: rotate(145deg) translate(8px, -2px);
-webkit-transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span:before,
@ -5004,7 +5009,12 @@ td.message span.message {
#egw_fw_sidebar #egw_fw_toggler span:after {
top: 9px;
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(-145deg) translate(8px, 2px);
-ms-transform: rotate(-145deg) translate(8px, 2px);
-moz-transform: rotate(-145deg) translate(8px, 2px);
-webkit-transform: rotate(-145deg) translate(8px, 2px);
background-color: #606060;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn {
@ -5018,10 +5028,15 @@ td.message span.message {
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span {
background-color: #b4b4b4;
transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
}
#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;
-ms-transform: none;
-moz-transform: none;
-webkit-transform: none;
width: 100%;
height: 5px;
background-color: #b4b4b4;

View File

@ -4975,7 +4975,12 @@ td.message span.message {
}
#egw_fw_sidebar #egw_fw_toggler span:before {
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
-ms-transform: rotate(145deg) translate(8px, -2px);
-moz-transform: rotate(145deg) translate(8px, -2px);
-webkit-transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
#egw_fw_sidebar #egw_fw_toggler span:before,
@ -4993,7 +4998,12 @@ td.message span.message {
#egw_fw_sidebar #egw_fw_toggler span:after {
top: 9px;
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(-145deg) translate(8px, 2px);
-ms-transform: rotate(-145deg) translate(8px, 2px);
-moz-transform: rotate(-145deg) translate(8px, 2px);
-webkit-transform: rotate(-145deg) translate(8px, 2px);
background-color: #606060;
}
#egw_fw_sidebar .egw_fw_sidebar_toggleOn {
@ -5007,10 +5017,15 @@ td.message span.message {
#egw_fw_sidebar .egw_fw_sidebar_toggleOn #egw_fw_toggler span {
background-color: #b4b4b4;
transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
}
#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;
-ms-transform: none;
-moz-transform: none;
-webkit-transform: none;
width: 100%;
height: 5px;
background-color: #b4b4b4;

View File

@ -346,7 +346,12 @@
background-color: transparent;
&:before{
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(145deg) translate(8px, -2px);
-ms-transform: rotate(145deg) translate(8px, -2px);
-moz-transform: rotate(145deg) translate(8px, -2px);
-webkit-transform: rotate(145deg) translate(8px, -2px);
background-color: #b4b4b4;
}
&:before, &:after {
@ -363,7 +368,12 @@
&:after {
top:9px;
transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transform: rotate(-145deg) translate(8px, 2px);
-ms-transform: rotate(-145deg) translate(8px, 2px);
-moz-transform: rotate(-145deg) translate(8px, 2px);
-webkit-transform: rotate(-145deg) translate(8px, 2px);
background-color: #606060;
}
position: relative;
@ -383,8 +393,13 @@
span {
background-color: #b4b4b4;
transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
&:before, &:after {
transform:none;
-ms-transform: none;
-moz-transform: none;
-webkit-transform: none;
width:100%;
height:5px;
background-color: #b4b4b4;