the-djmaze/snappymail
1
1
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2024-12-28 18:41:34 +08:00
Code Issues Projects Releases Packages Wiki Activity

Added nano scroller shadow

Browse source
This commit is contained in:
RainLoop Team 2014-04-23 20:09:56 +04:00
parent 3da3861545
commit 54a4c2657a
14 changed files with 302 additions and 292 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dev/Styles/FolderList.less
View file

@ -19,7 +19,7 @@
.b-footer {
position: absolute;
bottom: 20px;
bottom: 18px;
right: 0;
left: 0;
height: 20px;

2
dev/Styles/MessageList.less
View file

@ -465,7 +465,7 @@ html.rl-no-preview-pane {
&.selected {
background-color: #DFEFFF;
z-index: 102;
z-index: 101;
.sidebarParent {
background-color: #398CF2 !important;

39
dev/Styles/Scroll.less
View file

@ -1,29 +1,24 @@
/**
::-webkit-scrollbar {
height: 10px;
width: 10px;
overflow: visible;
.nano:before, .nano:after {
display: none;
content: "";
position: absolute;
left: 0;
width: 100%;
height: 2px;
z-index: 102;
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
}
::-webkit-scrollbar-button {
height: 0;
width: 0;
.nano:before {
top: -2px;
}
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-track {
background-color: transparent;
background-clip: padding-box;
border-width: 1px 1px 1px 6px;
min-height: 18px;
.nano:after {
bottom: -2px;
}
::-webkit-scrollbar-thumb {
background-color: #bbb;
background-color: rgba(0, 0, 0, 0.2);
border: 2px solid transparent;
.nano.nano-scrolllimit-top:before, .nano.nano-scrolllimit-bottom:after {
display: block;
}
::-webkit-scrollbar-corner {
background: transparent;
}
/**/

4
dev/Styles/_BootstrapFix.less
View file

@ -80,12 +80,14 @@ select {
text-shadow: 0 1px 0 #fff;
border-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.25);
// &:active {
// .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.3), 0 0 0 rgba(0,0,0,.1)");
// }
}
.btn.btn-dark-disabled-border {
.btn, .btn.btn-dark-disabled-border {
&.disabled, &[disabled] {
border-color: #aaa;
}

25
dev/Styles/_FontasticToBoot.less
View file

@ -71,18 +71,15 @@
}
@-webkit-keyframes rotation {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(359deg);}
to {-webkit-transform: rotate(1turn);}
}
@-moz-keyframes rotation {
from {-moz-transform: rotate(0deg);}
to {-moz-transform: rotate(359deg);}
to {-moz-transform: rotate(1turn);}
}
@keyframes rotation {
from {transform: rotate(0deg);}
to {transform: rotate(359deg);}
to {transform: rotate(1turn);}
}
.icon-spinner {
@ -90,6 +87,14 @@
height: 16px;
&:before {
-webkit-transform-origin: 8px 8px;
-moz-transform-origin: 8px 8px;
transform-origin: 8px 8px;
margin-top: 1px;
display: inline-block;
font-size: 16px;
line-height: 100%;
}
@ -107,8 +112,8 @@ html.no-cssanimations .icon-spinner {
}
}
html.cssanimations .icon-spinner.animated {
-webkit-animation: rotation 1s infinite linear;
-moz-animation: rotation 1s infinite linear;
animation: rotation 1s infinite linear;
html.cssanimations .icon-spinner.animated:before {
-webkit-animation: rotation 1s infinite steps(40);
-moz-animation: rotation 1s infinite steps(40);
animation: rotation 1s infinite steps(40);
}

80
rainloop/v/0.0.0/static/css/app.css
View file

@ -6170,27 +6170,18 @@ a.badge:hover {
line-height: 20px;
}
@-webkit-keyframes rotation {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(359deg);
-webkit-transform: rotate(1turn);
}
}
@-moz-keyframes rotation {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(359deg);
-moz-transform: rotate(1turn);
}
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
transform: rotate(1turn);
}
}
.icon-spinner {
@ -6198,6 +6189,11 @@ a.badge:hover {
height: 16px;
}
.icon-spinner:before {
-webkit-transform-origin: 8px 8px;
-moz-transform-origin: 8px 8px;
transform-origin: 8px 8px;
margin-top: 1px;
display: inline-block;
font-size: 16px;
line-height: 100%;
}
@ -6212,10 +6208,10 @@ html.no-cssanimations .icon-spinner:before {
html.no-cssanimations .icon-spinner.animated {
background-image: url('images/sync.gif');
}
html.cssanimations .icon-spinner.animated {
-webkit-animation: rotation 1s infinite linear;
-moz-animation: rotation 1s infinite linear;
animation: rotation 1s infinite linear;
html.cssanimations .icon-spinner.animated:before {
-webkit-animation: rotation 1s infinite steps(40);
-moz-animation: rotation 1s infinite steps(40);
animation: rotation 1s infinite steps(40);
}
body {
background-color: transparent;
@ -6285,6 +6281,7 @@ select {
padding-left: 13px;
padding-right: 13px;
text-shadow: 0 1px 0 #fff;
border-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.25);
}
.btn.disabled,
.btn[disabled] {
@ -6294,7 +6291,9 @@ select {
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
}
.btn.disabled,
.btn.btn-dark-disabled-border.disabled,
.btn[disabled],
.btn.btn-dark-disabled-border[disabled] {
border-color: #aaa;
}
@ -7087,35 +7086,30 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
background-image: none;
display: none;
}
/**
::-webkit-scrollbar {
height: 10px;
width: 10px;
overflow: visible;
.nano:before,
.nano:after {
display: none;
content: "";
position: absolute;
left: 0;
width: 100%;
height: 2px;
z-index: 102;
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
}
::-webkit-scrollbar-button {
height: 0;
width: 0;
.nano:before {
top: -2px;
}
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-track {
background-color: transparent;
background-clip: padding-box;
border-width: 1px 1px 1px 6px;
min-height: 18px;
.nano:after {
bottom: -2px;
}
::-webkit-scrollbar-thumb {
background-color: #bbb;
background-color: rgba(0, 0, 0, 0.2);
border: 2px solid transparent;
.nano.nano-scrolllimit-top:before,
.nano.nano-scrolllimit-bottom:after {
display: block;
}
::-webkit-scrollbar-corner {
background: transparent;
}
/**/.b-system-drop-down .b-toolbar {
.b-system-drop-down .b-toolbar {
position: absolute;
top: 0;
right: 0;
@ -7263,7 +7257,7 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
}
.b-folders .b-footer {
position: absolute;
bottom: 20px;
bottom: 18px;
right: 0;
left: 0;
height: 20px;
@ -7878,7 +7872,7 @@ html.rl-no-preview-pane .messageList.message-selected {
}
.messageList .b-content .messageListItem.selected {
background-color: #DFEFFF;
z-index: 102;
z-index: 101;
}
.messageList .b-content .messageListItem.selected .sidebarParent {
background-color: #398CF2 !important;

2
rainloop/v/0.0.0/static/css/app.min.css vendored
View file

File diff suppressed because one or more lines are too long

6
rainloop/v/0.0.0/static/js/admin.min.js vendored
View file

File diff suppressed because one or more lines are too long

12
rainloop/v/0.0.0/static/js/app.min.js vendored
View file

File diff suppressed because one or more lines are too long

2
rainloop/v/0.0.0/static/js/libs.js
View file

File diff suppressed because one or more lines are too long

2
vendors/jquery-nanoscroller/jquery.nanoscroller-0.7.min.js vendored
View file

File diff suppressed because one or more lines are too long

24
vendors/jquery-nanoscroller/jquery.nanoscroller.js vendored
View file

@ -344,12 +344,14 @@
var _this = this;
_this.pane.addClass('activescroll');
_this.pane2.addClass('activescroll');
_this.$el.addClass('nano-scrollevent');
_this.pane.addClass('activescroll');
_this.pane2.addClass('activescroll');
this.scrollClassTimer = window.setTimeout(function () {
_this.pane.removeClass('activescroll');
_this.pane2.removeClass('activescroll');
_this.$el.removeClass('nano-scrollevent');
_this.pane.removeClass('activescroll');
_this.pane2.removeClass('activescroll');
}, 1000);
};
@ -371,7 +373,7 @@
NanoScroll.prototype.updateScrollValues = function() {
var content;
var content, limit = 8;
content = this.content;
this.maxScrollTop = content.scrollHeight - content.clientHeight;
this.maxScroll2Left = content.scrollWidth - content.clientWidth;
@ -382,6 +384,18 @@
this.maxSlider2Left = this.pane2Width - this.slider2Width;
this.sliderTop = this.contentScrollTop * this.maxSliderTop / this.maxScrollTop;
this.slider2Left = this.contentScroll2Left * this.maxSlider2Left / this.maxScroll2Left;
if (limit < this.sliderTop) {
this.$el.addClass('nano-scrolllimit-top');
} else {
this.$el.removeClass('nano-scrolllimit-top');
}
if (this.contentScrollTop + limit >= this.maxScrollTop) {
this.$el.removeClass('nano-scrolllimit-bottom');
} else {
this.$el.addClass('nano-scrolllimit-bottom');
}
}
};