Fixed element stack order

slice/LoopListPowerItem.qml

@@ -29,6 +29,13 @@ Item
     property string icon: "icons/no_avatar.svg"
     property string title: ""
 
+    Rectangle
+    {
+        width: descriptionLabel.height + 10
+        height: descriptionLabel.height + 10
+        color: ( hover ? colors.iconBgHover : colors.iconBg )
+    }
+
     Image
     {
         id: powerItemIcon
@@ -49,9 +56,10 @@ Item
 
     Rectangle
     {
-        width: descriptionLabel.height + 10
+        x: descriptionLabel.height + 10 + 2
+        width: parent.width - descriptionLabel.height + 10 - 2
         height: descriptionLabel.height + 10
-        color: ( hover ? colors.iconBgHover : colors.iconBg )
+        color: ( hover ? colors.textBgHover : colors.textBg )
     }
 
     Text
@@ -68,14 +76,6 @@ Item
         y: 5
     }
 
-    Rectangle
-    {
-        x: descriptionLabel.height + 10 + 2
-        width: parent.width - descriptionLabel.height + 10 - 2
-        height: descriptionLabel.height + 10
-        color: ( hover ? colors.textBgHover : colors.textBg )
-    }
-
     MouseArea
     {
         width: descriptionLabel.x + descriptionLabel.width

slice/LoopListSessionItem.qml

@@ -12,6 +12,15 @@ Item
     property string sessionName: ""
     property bool hover: false
 
+    Rectangle
+    {
+        x: sessionNameLabel.x - 10
+        y: sessionNameLabel.y - 5
+        width: sessionNameLabel.width + 20
+        height: sessionNameLabel.height + 10
+        color: ( hover ? colors.textBgHover : colors.textBg )
+    }
+
     Text
     {
         id: sessionNameLabel
@@ -24,13 +33,4 @@ Item
         x: parent.x + 10
         y: 5
     }
-
-    Rectangle
-    {
-        x: sessionNameLabel.x - 10
-        y: sessionNameLabel.y - 5
-        width: sessionNameLabel.width + 20
-        height: sessionNameLabel.height + 10
-        color: ( hover ? colors.textBgHover : colors.textBg )
-    }
 }

slice/LoopListUserItem.qml

@@ -24,6 +24,13 @@ Item
     property string userLogin: ""
     property string userAvatar: "icons/no_avatar.svg"
 
+    Rectangle
+    {
+        width: itemRoot.height
+        height: itemRoot.height
+        color: ( hoverEnabled && hover ? colors.iconBgHover : colors.iconBg )
+    }
+
     Image
     {
         id: profilePicture
@@ -34,14 +41,6 @@ Item
         y: 4
     }
 
-    Rectangle
-    {
-        width: itemRoot.height
-        height: itemRoot.height
-        color: ( hoverEnabled && hover ? colors.iconBgHover : colors.iconBg )
-    }
-
-
     Text
     {
         id: userNameText
@@ -58,6 +57,15 @@ Item
         width: itemRoot.width - itemRoot.height - 26
     }
 
+    Rectangle
+    {
+        x: itemRoot.height + 2
+        y: 0
+        width: parent.width - itemRoot.height - 2
+        height: itemRoot.height
+        color: ( hoverEnabled && hover ? colors.textBgHover : colors.textBg )
+    }
+
     Text
     {
         id: userLoginText
@@ -71,13 +79,4 @@ Item
 
         width: itemRoot.width - itemRoot.height - 26
     }
-
-    Rectangle
-    {
-        x: itemRoot.height + 2
-        y: 0
-        width: parent.width - itemRoot.height - 2
-        height: itemRoot.height
-        color: ( hoverEnabled && hover ? colors.textBgHover : colors.textBg )
-    }
 }

slice/PageUsers.qml

@@ -223,6 +223,16 @@ Item
             userAvatar: get_avatar(3)
         }
 
+        Rectangle
+        {
+            id: passwordFieldBg
+            y: middleItem.y + middleItem.height + 2
+            width: parent.width
+            height: Math.max(fonts.input.pointSize, fonts.placeholder.pointSize) + 20
+            opacity: hasLoginShown ? 1 : 0
+            color: colors.inputBg
+        }
+
         TextInput
         {
             id: passwordField
@@ -260,15 +270,6 @@ Item
             text: localeText.password
         }
 
-        Rectangle {
-            id: passwordFieldBg
-            y: middleItem.y + middleItem.height + 2
-            width: parent.width
-            height: Math.max(fonts.input.pointSize, fonts.placeholder.pointSize) + 20
-            opacity: hasLoginShown ? 1 : 0
-            color: colors.inputBg
-        }
-
         Rectangle
         {
             id: progressBar
@@ -342,6 +343,19 @@ Item
             font: fonts.slicesLoginButtons
         }
 
+        Rectangle
+        {
+            id: errorMessageBg
+            x: errorMessage.x - 10
+            y: errorMessage.y - 5
+            width: errorMessage.width + 20
+            height: errorMessage.height + 10
+            color: colors.errorBg
+            opacity: 0
+
+            Behavior on opacity { NumberAnimation { duration: userListContainer.scrollDuration } }
+        }
+
         Text
         {
             id: errorMessage
@@ -358,19 +372,6 @@ Item
 
         }
 
-        Rectangle
-        {
-            id: errorMessageBg
-            x: errorMessage.x - 10
-            y: errorMessage.y - 5
-            width: errorMessage.width + 20
-            height: errorMessage.height + 10
-            color: colors.errorBg
-            opacity: 0
-
-            Behavior on opacity { NumberAnimation { duration: userListContainer.scrollDuration } }
-        }
-
         ParallelAnimation
         {
             id: progressBarLoop