YunoHost/yunohost-admin
1
0
Fork 0
mirror of https://github.com/YunoHost/yunohost-admin.git synced 2024-09-03 20:06:15 +02:00
Code Issues Projects Releases Packages Wiki Activity

Improve progress bar display using strips for the 'ongoing' part

Browse source
This commit is contained in:
Alexandre Aubin 2019-05-17 19:32:03 +02:00
parent 83ea279b7a
commit 5d34b374dc
2 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/css/style.less
View file

@ -558,6 +558,14 @@ input[type='radio'].nice-radio {
border-radius: 5px;
}
.messages .progress-bar-striped {
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 75%, transparent 75%, transparent);
}
.messages .progress-bar.active {
animation-direction: reverse;
}
/** custom badges **/
.badge {
&.badge-default {

2
src/js/yunohost/helpers.js
View file

@ -50,7 +50,7 @@
done = done * 100 / total;
ongoing = ongoing * 100 / total;
// Actually build the message with the progress bar
message = '<div class="progress"><div class="progress-bar progress-bar-success" role="progressbar" style="width:'+done+'%"></div><div class="progress-bar" role="progressbar" style="width:'+ongoing+'%;"></div></div><p style="display: inline-block;">' + message + '</p>';
message = '<div class="progress"><div class="progress-bar progress-bar-success" role="progressbar" style="width:'+done+'%"></div><div class="progress-bar progress-bar-striped active" role="progressbar" style="width:'+ongoing+'%;"></div></div><p style="display: inline-block;">' + message + '</p>';
}
else
{