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

View File

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

View File

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