You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
248 lines
4.3 KiB
248 lines
4.3 KiB
/*!
|
|
* angular-aside - v1.1.1
|
|
* https://github.com/dbtek/angular-aside
|
|
* 2014-11-25
|
|
* Copyright (c) 2014 İsmail Demirbilek
|
|
* License: MIT
|
|
*/
|
|
|
|
/*!
|
|
Animate.css - http://daneden.me/animate
|
|
Licensed under the MIT license - http://opensource.org/licenses/MIT
|
|
|
|
Copyright (c) 2014 Daniel Eden
|
|
*/
|
|
|
|
@-webkit-keyframes fadeInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-100%, 0, 0);
|
|
transform: translate3d(-100%, 0, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-100%, 0, 0);
|
|
-ms-transform: translate3d(-100%, 0, 0);
|
|
transform: translate3d(-100%, 0, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
-ms-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.fadeInLeft {
|
|
-webkit-animation-name: fadeInLeft;
|
|
animation-name: fadeInLeft;
|
|
}
|
|
|
|
@-webkit-keyframes fadeInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(100%, 0, 0);
|
|
transform: translate3d(100%, 0, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(100%, 0, 0);
|
|
-ms-transform: translate3d(100%, 0, 0);
|
|
transform: translate3d(100%, 0, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
-ms-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.fadeInRight {
|
|
-webkit-animation-name: fadeInRight;
|
|
animation-name: fadeInRight;
|
|
}
|
|
|
|
@-webkit-keyframes fadeInTop {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -100%, 0);
|
|
transform: translate3d(0, -100%, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInTop {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -100%, 0);
|
|
-ms-transform: translate3d(0, -100%, 0);
|
|
transform: translate3d(0, -100%, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
-ms-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.fadeInTop {
|
|
-webkit-animation-name: fadeInTop;
|
|
animation-name: fadeInTop;
|
|
}
|
|
|
|
@-webkit-keyframes fadeInBottom {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 100%, 0);
|
|
transform: translate3d(0, 100%, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInBottom {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 100%, 0);
|
|
-ms-transform: translate3d(0, 100%, 0);
|
|
transform: translate3d(0, 100%, 0);
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: none;
|
|
-ms-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.fadeInBottom {
|
|
-webkit-animation-name: fadeInBottom;
|
|
animation-name: fadeInBottom;
|
|
}
|
|
.ng-aside {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ng-aside.horizontal {
|
|
transition: none;
|
|
-webkit-transition: none;
|
|
transform: none;
|
|
-webkit-transform: none;
|
|
height: 100%;
|
|
}
|
|
|
|
.ng-aside.horizontal.left.in {
|
|
animation: fadeInLeft 150ms;
|
|
-webkit-animation: fadeInLeft 150ms;
|
|
}
|
|
|
|
.ng-aside.horizontal.right.in {
|
|
animation: fadeInRight 150ms;
|
|
-webkit-animation: fadeInRight 150ms;
|
|
}
|
|
|
|
.ng-aside.horizontal .modal-dialog {
|
|
position: absolute;
|
|
top: 0;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
transition: none;
|
|
-webkit-transition: none;
|
|
transform: none;
|
|
-webkit-transform: none;
|
|
}
|
|
|
|
.ng-aside.horizontal.left .modal-dialog {
|
|
left: 0;
|
|
}
|
|
|
|
.ng-aside.horizontal.right .modal-dialog {
|
|
right: 0;
|
|
}
|
|
|
|
.ng-aside.horizontal .modal-dialog .modal-content {
|
|
height: 100%;
|
|
border: none;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.ng-aside.vertical {
|
|
transition: none;
|
|
-webkit-transition: none;
|
|
transform: none;
|
|
-webkit-transform: none;
|
|
width: 100%!important;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ng-aside.vertical .modal-dialog {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
width: 100%!important;
|
|
transition: none;
|
|
-webkit-transition: none;
|
|
transform: none;
|
|
-webkit-transform: none;
|
|
}
|
|
|
|
.ng-aside.vertical.top.in {
|
|
animation: fadeInTop 150ms;
|
|
-webkit-animation: fadeInTop 150ms;
|
|
}
|
|
|
|
.ng-aside.vertical.bottom.in {
|
|
animation: fadeInBottom 150ms;
|
|
-webkit-animation: fadeInBottom 150ms;
|
|
}
|
|
|
|
.ng-aside.vertical.bottom .modal-dialog {
|
|
bottom: 0;
|
|
}
|
|
|
|
.ng-aside.vertical.top .modal-dialog {
|
|
top: 0;
|
|
}
|
|
|
|
.ng-aside.vertical .modal-dialog .modal-content {
|
|
border: none;
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 0;
|
|
}
|