blob: b4d59c7d5ddd0af9a2525b25a7d915261bce1c17 [file] [log] [blame]
/*
* Copyright 2017-present Open Networking Foundation
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
.row + .row {
margin-top: 20px;
}
/* ANIMATIONS */
.animate-vertical.ng-hide-add {
animation:0.5s slideOutDown ease-in-out;
}
.animate-vertical.ng-hide-remove {
animation:0.5s slideInUp ease-in-out;
}
@keyframes slideInUp {
from {
transform: translate3d(0, 100%, 0);
opacity: 0;
}
to {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes slideOutDown {
from {
transform: translate3d(0, 0, 0);
opacity: 1;
}
to {
opacity: 0;
transform: translate3d(0, 100%, 0);
}
}
/* LOADER */
.loader {
font-size: 10px;
margin: 0 auto;
text-indent: -9999em;
width: 11em;
height: 11em;
border-radius: 50%;
background: #ffffff;
background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
position: relative;
animation: load3 1.4s infinite linear;
transform: translateZ(0);
}
.loader:before {
width: 50%;
height: 50%;
background: #105E9E;
border-radius: 100% 0 0 0;
position: absolute;
top: 0;
left: 0;
content: '';
}
.loader:after {
background: #fff;
width: 75%;
height: 75%;
border-radius: 50%;
content: '';
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
@keyframes load3 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}