|
Server : LiteSpeed System : Linux srv104790275 5.15.0-161-generic #171-Ubuntu SMP Sat Oct 11 08:17:01 UTC 2025 x86_64 User : dewac4139 ( 1077) PHP Version : 8.0.30 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory : /usr/local/CyberCP/public/static/baseTemplate/assets/widgets/loading-bar/ |
Upload File : |
#loadingbar {
position: fixed;
z-index: 2147483647;
top: 0;
left: -6px;
width: 1%;
height: 4px;
-webkit-transition: all 500ms ease-in-out;
-moz-transition: all 500ms ease-in-out;
-ms-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
#loadingbar.left {
right: 0;
left: 100%;
width: 100%;
}
#loadingbar.up {
top: 100%;
bottom: 0;
left: 0;
width: 5px;
height: 100%;
}
#loadingbar.down {
left: 0;
width: 5px;
height: 0;
}
#loadingbar.waiting dd,
#loadingbar.waiting dt {
-webkit-animation: pulse 2s ease-out 0s infinite;
-moz-animation: pulse 2s ease-out 0s infinite;
-ms-animation: pulse 2s ease-out 0s infinite;
-o-animation: pulse 2s ease-out 0s infinite;
animation: pulse 2s ease-out 0s infinite;
}
#loadingbar dt {
right: -80px;
clip: rect(-6px, 90px, 14px, -6px);
width: 180px;
opacity: .6;
}
#loadingbar dd {
right: 0;
clip: rect(-6px, 22px, 14px, 10px);
width: 20px;
opacity: .6;
}
#loadingbar dd,
#loadingbar dt {
position: absolute;
top: 0;
height: 2px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
-webkit-box-shadow: #ff6439 1px 0 6px 1px;
-moz-box-shadow: #fa7753 1px 0 6px 1px;
box-shadow: #ff6439 1px 0 6px 1px;
-ms-box-shadow: #fa7753 1px 0 6px 1px;
}
#loadingbar.left dt {
left: -4px;
clip: rect(-6px, 185px, 14px, 25px);
width: 180px;
opacity: .6;
}
#loadingbar.left dd {
left: 0;
clip: rect(-6px, 22px, 14px, 0px);
width: 20px;
margin: 0;
opacity: .6;
}
#loadingbar.left dd,
#loadingbar.left dt {
top: 0;
height: 2px;
}
#loadingbar.down dt {
top: auto;
bottom: -47px;
clip: rect(-6px, 20px, 130px, -6px);
height: 180px;
opacity: .6;
}
#loadingbar.down dd {
top: auto;
bottom: 0;
clip: rect(-6px, 22px, 20px, 10px);
height: 20px;
margin: 0;
opacity: .6;
}
#loadingbar.down dd,
#loadingbar.down dt {
right: auto;
left: -5px;
width: 10px;
}
#loadingbar.up dt {
top: -10px;
bottom: auto;
clip: rect(13px, 20px, 190px, -6px);
height: 180px;
opacity: .6;
}
#loadingbar.up dd {
top: 0;
bottom: auto;
clip: rect(-6px, 22px, 25px, 10px);
height: 20px;
margin: 0;
opacity: .6;
}
#loadingbar.up dd,
#loadingbar.up dt {
right: auto;
left: -5px;
width: 10px;
}
@keyframes pulse {
30% {
opacity: .6;
}
60% {
opacity: 0;
}
100% {
opacity: .6;
}
}
@-moz-keyframes pulse {
30% {
opacity: .6;
}
60% {
opacity: 0;
}
100% {
opacity: .6;
}
}
@-ms-keyframes pulse {
30% {
opacity: .6;
}
60% {
opacity: 0;
}
100% {
opacity: .6;
}
}
@-webkit-keyframes pulse {
30% {
opacity: .6;
}
60% {
opacity: 0;
}
100% {
opacity: .6;
}
}