Added option to change progress bar colors

README.md

@@ -36,6 +36,9 @@ Create file `theme.conf.user` in theme folder. See `slice/theme.conf` for refere
 * `color_icon_bg` - image elements background color. Defaults to `#11ffffff`.
 * `color_error_bg` - error message background color. Defaults to `#11ffffff`.
 * `color_error_text` - error message text color. Defaults to `#dddddd`.
+* `color_progress_bar` - progress bar color. Defaults to `#dddddd`.
+* `color_progress_bar_slider` - progress bar color. Defaults to `#dddddd`.
+* `color_progress_bar_bg` - progress bar background color. Defaults to `#888888`.
 
 ## License
 

slice/PageUsers.qml

@@ -275,7 +275,17 @@ Item
             width: parent.width
             height: 2
             opacity: hasLoginShown ? 1 : 0
-            color: config.color_text
+            color: config.color_progress_bar
+        }
+
+        Rectangle
+        {
+            id: progressBarBg
+            y: progressBar.y
+            width: parent.width
+            height: 2
+            opacity: 0
+            color: config.color_progress_bar_bg
         }
 
         Rectangle
@@ -286,7 +296,7 @@ Item
             width: parent.width / 5
             height: 2
             opacity: 0
-            color: config.color_text
+            color: config.color_progress_bar_slider
         }
 
         Rectangle
@@ -297,7 +307,7 @@ Item
             width: 0
             height: 2
             opacity: 0
-            color: config.color_text
+            color: config.color_progress_bar_slider
         }
 
         SlicedButton
@@ -543,9 +553,10 @@ Item
             NumberAnimation { target: passwordFieldPlaceholder; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
             NumberAnimation { target: buttonUserBack; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
             NumberAnimation { target: buttonUserLogin; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
-            NumberAnimation { target: progressBar; property: "opacity"; to: 0.5; duration: userListContainer.scrollDuration }
+            NumberAnimation { target: progressBar; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
             NumberAnimation { target: progressBarSlider1; property: "opacity"; to: 1; duration: userListContainer.scrollDuration }
             NumberAnimation { target: progressBarSlider2; property: "opacity"; to: 1; duration: userListContainer.scrollDuration }
+            NumberAnimation { target: progressBarBg; property: "opacity"; to: 1; duration: userListContainer.scrollDuration }
             NumberAnimation { target: middleItem; property: "y"; to: pageRoot.height / 2.3; duration: userListContainer.scrollDuration }
 
         }
@@ -562,6 +573,7 @@ Item
             NumberAnimation { target: progressBar; property: "opacity"; to: 1; duration: userListContainer.scrollDuration }
             NumberAnimation { target: progressBarSlider1; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
             NumberAnimation { target: progressBarSlider2; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
+            NumberAnimation { target: progressBarBg; property: "opacity"; to: 0; duration: userListContainer.scrollDuration }
             NumberAnimation { target: middleItem; property: "y"; to: pageRoot.height / 2.3 - 40; duration: userListContainer.scrollDuration }
 
             onStopped:

slice/theme.conf

@@ -16,4 +16,7 @@ color_selection_text=#dddddd
 color_text_bg=#22ffffff
 color_icon_bg=#11ffffff
 color_error_bg=#11ffffff
-color_error_text=#dddddd
+color_error_text=#dddddd
+color_progress_bar=#dddddd
+color_progress_bar_slider=#dddddd
+color_progress_bar_bg=#888888