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.
87 lines
2.5 KiB
87 lines
2.5 KiB
<template>
|
|
<div class="we-no-result">
|
|
<div class="preloader-2">
|
|
<span class="line line-1"></span>
|
|
<span class="line line-2"></span>
|
|
<span class="line line-3"></span>
|
|
<span class="line line-4"></span>
|
|
<span class="line line-5"></span>
|
|
<span class="line line-6"></span>
|
|
<span class="line line-7"></span>
|
|
<span class="line line-8"></span>
|
|
<span class="line line-9"></span>
|
|
</div>
|
|
<div class="Fa"> {{ textFa }} </div>
|
|
<div class="En"> {{ textEn }} </div>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
src: { default: '/images/Global/Animated/Loading.gif' },
|
|
textFa: { default: " درحال دریافت اطلاعات... لطفا شکیبا باشید " },
|
|
textEn: { default: " GATHERING DATA, PLEASE BE PATIENT " },
|
|
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.preloader-2 .line {
|
|
width: 6px;
|
|
height: 30px;
|
|
background: rgb(2,0,36);
|
|
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(238,12,119,1) 100%, rgba(0,212,255,1) 100%);
|
|
margin: 0 1px;
|
|
display: inline-block;
|
|
animation: opacity-2 1000ms infinite ease-in-out;
|
|
}
|
|
|
|
.preloader-1 .line-1, .preloader-2 .line-1 { animation-delay: 800ms; }
|
|
.preloader-1 .line-2, .preloader-2 .line-2 { animation-delay: 600ms; }
|
|
.preloader-1 .line-3, .preloader-2 .line-3 { animation-delay: 400ms; }
|
|
.preloader-1 .line-4, .preloader-2 .line-4 { animation-delay: 200ms; }
|
|
.preloader-1 .line-6, .preloader-2 .line-6 { animation-delay: 200ms; }
|
|
.preloader-1 .line-7, .preloader-2 .line-7 { animation-delay: 400ms; }
|
|
.preloader-1 .line-8, .preloader-2 .line-8 { animation-delay: 600ms; }
|
|
.preloader-1 .line-9, .preloader-2 .line-9 { animation-delay: 800ms; }
|
|
|
|
|
|
@keyframes opacity-2 {
|
|
0% {
|
|
opacity: 1;
|
|
height: 25px;
|
|
}
|
|
50% {
|
|
opacity: 0;
|
|
height: 22px;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
height: 25px;
|
|
}
|
|
}
|
|
|
|
|
|
.we-no-result {
|
|
text-align: center;
|
|
padding: 10px;
|
|
width: 100%;
|
|
}
|
|
.we-no-result img {
|
|
width: 300px;
|
|
border-radius: 150px;
|
|
}
|
|
.we-no-result .Fa {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.we-no-result .En {
|
|
direction: ltr;
|
|
font-size: 12px;
|
|
letter-spacing: 5px;
|
|
text-transform: uppercase;
|
|
}
|
|
</style>
|