@@ -202,51 +202,43 @@ Item {
202202 left: parent.left
203203 bottom: parent.bottom
204204 bottomMargin: units.gu(1)
205− right: cancelLabel.left
206− rightMargin: units.gu(1)
205+ right: settingsButton.left
206+ rightMargin: settingsButton.visible ? 0 : units.gu(2)
207207 }
208208
209− readonly property bool clearIsSettings: !searchTextField.focus && root.scopeHasFilters
210−
211− primaryItem: Label {
212− text: root.navigationTag
209+ primaryItem: Rectangle {
210+ color: "#F5F4F5"
211+ width: root.navigationTag != "" ? tagLabel.width + units.gu(2) : 0
212+ height: root.navigationTag != "" ? tagLabel.height + units.gu(1) : 0
213+ radius: units.gu(0.5)
214+ Label {
215+ id: tagLabel
216+ text: root.navigationTag
217+ anchors.centerIn: parent
218+ color: "#333333"
219+ }
213220 }
214221
215− secondaryItem: Row {
222+ secondaryItem: AbstractButton {
223+ id: clearButton
216224 height: searchTextField.height
217−
218− AbstractButton {
219− id: clearOrSettingsButton
220− height: parent.height
221− width: height
222− enabled: searchTextField.text.length > 0 || root.navigationTag != ""
223−
224− Image {
225− objectName: "clearIcon"
226− anchors.fill: parent
227− anchors.margins: units.gu(.75)
228− source: searchTextField.clearIsSettings ? "image://theme/settings" : "image://theme/clear"
229− opacity: parent.enabled
230− visible: opacity > 0
231− Behavior on opacity {
232− UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
233− }
234− }
235−
236− onClicked: {
237− if (searchTextField.clearIsSettings) {
238− root.showFiltersPopup(clearOrSettingsButton);
239− } else {
240− root.clearSearch(true);
241− }
225+ width: height
226+ enabled: searchTextField.text.length > 0 || root.navigationTag != ""
227+
228+ Image {
229+ objectName: "clearIcon"
230+ anchors.fill: parent
231+ anchors.margins: units.gu(1)
232+ source: "image://theme/clear"
233+ opacity: parent.enabled
234+ visible: opacity > 0
235+ Behavior on opacity {
236+ UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
242237 }
243238 }
244239
245− Label {
246− visible: searchTextField.clearIsSettings && root.activeFiltersCount > 0
247− height: parent.height
248− text: root.activeFiltersCount
249− verticalAlignment: Text.AlignVCenter
240+ onClicked: {
241+ root.clearSearch(true);
250242 }
251243 }
252244
@@ -264,22 +256,52 @@ Item {
264256 }
265257 }
266258
267− Label {
268− id: cancelLabel
269− text: i18n.tr("Cancel")
270− color: header.panelForegroundColor
271− verticalAlignment: Text.AlignVCenter
259+ AbstractButton {
260+ id: settingsButton
261+
262+ width: root.scopeHasFilters ? height : 0
263+ visible: width > 0
272264 anchors {
273265 top: parent.top
274− right: parent.right
266+ right: cancelButton.left
275267 bottom: parent.bottom
276− margins: units.gu(1)
268+ rightMargin: units.gu(-1)
277269 }
278− AbstractButton {
270+
271+ Icon {
279272 anchors.fill: parent
280− onClicked: {
281− root.clearSearch(false);
282− headerContainer.showSearch = false;
273+ anchors.margins: units.gu(2)
274+ name: "filters"
275+ color: root.activeFiltersCount > 0 ? UbuntuColors.orange : Qt.rgba(0.0, 0.0, 0.0, 0.0)
276+ }
277+
278+ onClicked: {
279+ root.showFiltersPopup(settingsButton);
280+ }
281+ }
282+
283+ AbstractButton {
284+ id: cancelButton
285+ width: cancelLabel.width + cancelLabel.anchors.rightMargin + cancelLabel.anchors.leftMargin
286+ anchors {
287+ top: parent.top
288+ right: parent.right
289+ bottom: parent.bottom
290+ }
291+ onClicked: {
292+ root.clearSearch(false);
293+ headerContainer.showSearch = false;
294+ }
295+ Label {
296+ id: cancelLabel
297+ text: i18n.tr("Cancel")
298+ color: header.panelForegroundColor
299+ verticalAlignment: Text.AlignVCenter
300+ anchors {
301+ verticalCenter: parent.verticalCenter
302+ right: parent.right
303+ rightMargin: units.gu(2)
304+ leftMargin: units.gu(1)
283305 }
284306 }
285307 }