Fix aligment emoji + message on Windows.

Signed-off-by: Camila <hello@camila.codes>

src/gui/accountstate.h

@@ -170,7 +170,7 @@ public:
     /** Returns the user status Message (text)
     */
     QString statusMessage() const;
-    
+
     /** Returns the user status icon url
     */
     QUrl statusIcon() const;

src/gui/tray/UserLine.qml

@@ -99,23 +99,27 @@ MenuItem {
 
                     Column {
                         id: accountLabels
-                        spacing: 4
+                        spacing: Style.accountLabelsSpacing
                         Layout.alignment: Qt.AlignLeft
-                        Layout.leftMargin: 9
+                        Layout.leftMargin: Style.accountLabelsLayoutMargin
+                        anchors.top: accountAvatar.top
+                        anchors.topMargin: Style.userStatusAnchorsMargin
+                        anchors.left: accountAvatar.right
+                        anchors.leftMargin: Style.accountLabelsAnchorsMargin
                         Label {
                             id: accountUser
                             width: 128
                             text: name
                             elide: Text.ElideRight
                             color: "black"
-                            font.pixelSize: 12
+                            font.pixelSize: Style.topLinePixelSize
                             font.bold: true
                         }
                         Row {
                             id: userStatus
-                            spacing: 8
                             visible: model.isConnected && 
                                      model.serverHasUserStatus
+                            anchors.top: accountUser.bottom
                             Label {
                                 id: emoji
                                 visible: model.statusEmoji !== ""
@@ -125,21 +129,27 @@ MenuItem {
                             Label {
                                 id: message
                                 anchors.bottom: emoji.bottom
+                                anchors.left: emoji.right
+                                anchors.leftMargin: emoji.width + Style.userStatusSpacing
                                 visible: model.statusMessage !== ""
-                                width: 128
+                                width: Style.currentAccountLabelWidth
                                 text: statusMessage
                                 elide: Text.ElideRight
                                 color: "black"
-                                font.pixelSize: 10
+                                font.pixelSize: Style.subLinePixelSize
                             }
                         }
                         Label {
                             id: accountServer
-                            width: 128
+                            anchors.top: userStatus.bottom
+                            anchors.topMargin: message.visible
+                                               ? message.height + Style.accountServerAnchorsMargin
+                                               : Style.userStatusAnchorsMargin
+                            width: Style.currentAccountLabelWidth
                             text: server
                             elide: Text.ElideRight
                             color: "black"
-                            font.pixelSize: 10
+                            font.pixelSize: Style.subLinePixelSize
                         }
                     }
                 }

src/gui/tray/Window.qml

@@ -359,12 +359,13 @@ Window {
 
                         Column {
                             id: accountLabels
-                            spacing: 4
+                            spacing: Style.userStatusSpacing
                             Layout.alignment: Qt.AlignLeft
-                            Layout.leftMargin: 6
+                            Layout.leftMargin: Style.userStatusSpacing
+                            anchors.top: currentAccountAvatar.top
+                            anchors.topMargin: Style.userStatusSpacing
                             Label {
                                 id: currentAccountUser
-
                                 width: Style.currentAccountLabelWidth
                                 text: UserModel.currentUser.name
                                 elide: Text.ElideRight
@@ -374,9 +375,9 @@ Window {
                             }
                             Row {
                                 id: currentUserStatus
-                                spacing: 8
                                 visible: UserModel.currentUser.isConnected &&
                                          UserModel.currentUser.serverHasUserStatus
+                                anchors.top: currentAccountUser.bottom
                                 Label {
                                     id: emoji
                                     visible: UserModel.currentUser.statusEmoji !== ""
@@ -386,6 +387,8 @@ Window {
                                 Label {
                                     id: message
                                     anchors.bottom: emoji.bottom
+                                    anchors.left: emoji.right
+                                    anchors.leftMargin: emoji.width + Style.userStatusSpacing
                                     visible: UserModel.currentUser.statusMessage !== ""
                                     width: Style.currentAccountLabelWidth
                                     text: UserModel.currentUser.statusMessage !== ""

theme/Style/Style.qml

@@ -46,6 +46,12 @@ QtObject {
     property int activityLabelBaseWidth: 240
     
     property int userStatusEmojiSize: 8
+    property int userStatusSpacing: 6
+    property int userStatusAnchorsMargin: 2
+    property int accountServerAnchorsMargin: 10
+    property int accountLabelsSpacing: 4
+    property int accountLabelsAnchorsMargin: 7
+    property int accountLabelsLayoutMargin: 9
 
     // Visual behaviour
     property bool hoverEffectsEnabled: true