diff --git a/src/js/components/Notifications.js b/src/js/components/Notifications.js
index a9817da0..4ca8c553 100755
--- a/src/js/components/Notifications.js
+++ b/src/js/components/Notifications.js
@@ -50,7 +50,9 @@ export default class Notifications extends React.Component{
return(
{process.message}
{this.props.uiActions.cancelProcess(process.key)}} />
diff --git a/src/js/services/mopidy/middleware.js b/src/js/services/mopidy/middleware.js
index a5e42c1f..bb503aa7 100755
--- a/src/js/services/mopidy/middleware.js
+++ b/src/js/services/mopidy/middleware.js
@@ -337,7 +337,15 @@ const MopidyMiddleware = (function(){
next(action)
// start our processor
- store.dispatch(uiActions.startProcess('MOPIDY_ENQUEUE_URIS_PROCESSOR', 'Adding '+action.uris.length+' URI(s)', {batches: batches}))
+ store.dispatch(uiActions.startProcess(
+ 'MOPIDY_ENQUEUE_URIS_PROCESSOR',
+ 'Adding '+action.uris.length+' URI(s)',
+ {
+ batches: batches,
+ remaining: action.uris.length,
+ total: action.uris.length
+ }
+ ))
break
case 'MOPIDY_ENQUEUE_URIS_PROCESSOR':
@@ -352,7 +360,13 @@ const MopidyMiddleware = (function(){
total_uris += batches[i].uris.length
}
batches.shift()
- store.dispatch(uiActions.updateProcess('MOPIDY_ENQUEUE_URIS_PROCESSOR', 'Adding '+total_uris+' URI(s)'))
+ store.dispatch(uiActions.updateProcess(
+ 'MOPIDY_ENQUEUE_URIS_PROCESSOR',
+ 'Adding '+total_uris+' URI(s)',
+ {
+ remaining: total_uris
+ }
+ ))
// no batches means we're done here
} else {
diff --git a/src/js/views/Debug.js b/src/js/views/Debug.js
index 72da664b..e24032a5 100755
--- a/src/js/views/Debug.js
+++ b/src/js/views/Debug.js
@@ -113,7 +113,7 @@ class Debug extends React.Component{
diff --git a/src/scss/components/_notifications.scss b/src/scss/components/_notifications.scss
index f362fbdb..ddb24180 100755
--- a/src/scss/components/_notifications.scss
+++ b/src/scss/components/_notifications.scss
@@ -78,7 +78,6 @@
left: 18px;
opacity: 1;
z-index: 2;
- border-radius: 50%;
&:before {
border-color: transparent;
@@ -89,15 +88,22 @@
}
.progress {
- background: $light_blue;
position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- border: 0px solid $blue;
- box-sizing: border-box;
+ top: 4px;
+ left: 4px;
+ bottom: 4px;
+ right: 4px;
border-radius: 50%;
+ overflow: hidden;
+
+ .fill {
+ background: $white;
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ opacity: 0.35;
+ }
}
}
}