@@ -55,12 +55,14 @@ Row {
5555 spacing: margins;
5656 height: root.fixedHeaderHeight != -1 ? root.fixedHeaderHeight : implicitHeight;
5757 anchors { top: parent.top;
58− topMargin: units.gu(1);
59−left: parent.left;
60− }
58+ topMargin: units.gu(1);
59+ left: parent.left;
60+ }
6161 anchors.right: parent.right;
6262 anchors.margins: margins;
63− data: [ Image {
63+ anchors.rightMargin: 0;
64+ data: [
65+Image {
6466 id: mascotImage;
6567 objectName: "mascotImage";
6668 anchors { verticalCenter: parent.verticalCenter; }
@@ -75,16 +77,19 @@ left: parent.left;
7577 visible: showHeader;
7678 }
7779
78− ,
79− Column {
80− anchors.verticalCenter: parent.verticalCenter;
81− spacing: units.dp(2);
82− width: parent.width - x;
83− data: [
84− Label {
80+,Item {
81+ id: headerTitleContainer;
82+ anchors { verticalCenter: parent.verticalCenter; }
83+ width: parent.width - x;
84+ implicitHeight: titleLabel.height + subtitleLabel.height + attributesRow.height;
85+ data: [
86+ Label {
8587 id: titleLabel;
8688 objectName: "titleLabel";
87− anchors { left: parent.left; right: parent.right }
89+ anchors { right: parent.right;
90+ rightMargin: units.gu(1);
91+ left: parent.left;
92+ top: parent.top; }
8893 elide: Text.ElideRight;
8994 fontSize: "small";
9095 wrapMode: Text.Wrap;
@@ -96,11 +101,15 @@ left: parent.left;
96101 font.weight: components && components["subtitle"] ? Font.DemiBold : Font.Normal;
97102 horizontalAlignment: root.headerAlignment;
98103 }
99−,
100−Label {
104+,Label {
101105 id: subtitleLabel;
102106 objectName: "subtitleLabel";
103− anchors { left: parent.left; right: parent.right }
107+ anchors { right: parent.right;
108+ left: parent.left;
109+ rightMargin: units.gu(1);
110+ top: titleLabel.bottom;
111+ }
112+ anchors.topMargin: units.dp(2);
104113 elide: Text.ElideRight;
105114 fontSize: "small";
106115 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale);
@@ -110,11 +119,14 @@ Label {
110119 font.weight: Font.Light;
111120 horizontalAlignment: root.headerAlignment;
112121 }
113−,
114−CardAttributes {
122+,CardAttributes {
115123 id: attributesRow;
116124 objectName: "attributesRow";
117− anchors { left: parent.left; right: parent.right }
125+ anchors { right: parent.right;
126+ left: parent.left;
127+ rightMargin: units.gu(1);
128+ top: subtitleLabel.bottom;
129+ }
118130 color: backgroundLoader.active && backgroundLoader.item && backgroundLoader.item.luminance < 0.7 ? "white" : (root.scopeStyle ? root.scopeStyle.foreground : "grey");
119131 model: cardData["attributes"];
120132 }