caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added effects on menu/document buttons

Browse Source
This commit is contained in:
Benoit Schweblin 2013-09-26 18:17:49 -04:00
parent 547968ebbc
commit b91e52530f
1 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
res/styles/main.less
View File

@ -361,7 +361,7 @@ body {
.menu-panel { .menu-panel {
width: @menu-panel-width !important; width: @menu-panel-width !important;
margin-left: (-@menu-panel-width - 35); margin-left: (-@menu-panel-width - 23);
-webkit-transition: margin-left 0.35s ease; -webkit-transition: margin-left 0.35s ease;
-moz-transition: margin-left 0.35s ease; -moz-transition: margin-left 0.35s ease;
-o-transition: margin-left 0.35s ease; -o-transition: margin-left 0.35s ease;
@ -371,13 +371,23 @@ body {
} }
&.in { &.in {
margin-left: 0; margin-left: 0;
.collapse-button {
padding-right: 16px;
}
} }
.collapse-button { .collapse-button {
right: -83px; right: -75px;
position: absolute; position: absolute;
margin-top: 6px; margin-top: 6px;
padding: 2px 20px;
z-index: -1; z-index: -1;
padding: 2px 24px 2px 16px;
-webkit-transition: padding-right 0.35s ease;
-moz-transition: padding-right 0.35s ease;
-o-transition: padding-right 0.35s ease;
transition: padding-right 0.35s ease;
&:hover {
padding-right: 16px;
}
} }
.panel-content { .panel-content {
background-color: @panel-bg; background-color: @panel-bg;
@ -389,20 +399,30 @@ body {
.document-panel { .document-panel {
right: 0; right: 0;
width: @document-panel-width !important; width: @document-panel-width !important;
margin-right: (-@document-panel-width - 35); margin-right: (-@document-panel-width - 27);
-webkit-transition: margin-right 0.35s ease; -webkit-transition: margin-right 0.35s ease;
-moz-transition: margin-right 0.35s ease; -moz-transition: margin-right 0.35s ease;
-o-transition: margin-right 0.35s ease; -o-transition: margin-right 0.35s ease;
transition: margin-right 0.35s ease; transition: margin-right 0.35s ease;
&.in { &.in {
margin-right: 0; margin-right: 0;
.collapse-button {
padding-left: 10px;
}
} }
.collapse-button { .collapse-button {
left: -83px; left: -75px;
position: absolute; position: absolute;
margin-top: 6px; margin-top: 6px;
padding: 7px 18px; padding: 7px 10px 7px 18px;
z-index: -1; z-index: -1;
-webkit-transition: padding-left 0.35s ease;
-moz-transition: padding-left 0.35s ease;
-o-transition: padding-left 0.35s ease;
transition: padding-left 0.35s ease;
&:hover {
padding-left: 10px;
}
i.icon-folder-open { i.icon-folder-open {
font-size: 22px; font-size: 22px;
} }