diff --git a/src/qml/NavigationActionBar.qml b/src/qml/NavigationActionBar.qml
--- a/src/qml/NavigationActionBar.qml
+++ b/src/qml/NavigationActionBar.qml
@@ -18,8 +18,7 @@
 import QtQml 2.2
 import QtQuick 2.7
 import QtQuick.Layouts 1.3
-import QtQuick.Controls 2.2
-import QtQuick.Controls 1.4 as Controls1
+import QtQuick.Controls 2.3
 
 FocusScope {
     id: navigationBar
@@ -45,18 +44,18 @@
     signal showArtist();
     signal sort(var order);
 
-    Controls1.Action {
+    Action {
         id: goPreviousAction
         text: i18nc("navigate back in the views stack", "Back")
-        iconName: (Qt.application.layoutDirection == Qt.RightToLeft) ? "go-next" : "go-previous"
+        icon.name: (Qt.application.layoutDirection == Qt.RightToLeft) ? "go-next" : "go-previous"
         onTriggered: goBack()
     }
 
-    Controls1.Action {
+    Action {
         id: showFilterAction
         shortcut: findAction.shortcut
         text: !navigationBar.expandedFilterView ? i18nc("Show filters in the navigation bar", "Show Search Options") : i18nc("Hide filters in the navigation bar", "Hide Search Options")
-        iconName: !navigationBar.expandedFilterView ? "go-down-search" : "go-up-search"
+        icon.name: !navigationBar.expandedFilterView ? "go-down-search" : "go-up-search"
         onTriggered: {
             persistentSettings.expandedFilterView = !persistentSettings.expandedFilterView
             expandedFilterView = persistentSettings.expandedFilterView
@@ -66,10 +65,10 @@
         }
     }
 
-    Controls1.Action {
+    Action {
         id: sortAction
         text: i18nc("Toggle between ascending and descending order", "Toggle sort order")
-        iconName: sortOrder ? "view-sort-ascending" : "view-sort-descending"
+        icon.name: sortOrder ? "view-sort-ascending" : "view-sort-descending"
         onTriggered: sortOrder ? sort(Qt.DescendingOrder) : sort(Qt.AscendingOrder)
     }
 
@@ -87,11 +86,13 @@
             Layout.minimumHeight: elisaTheme.navigationBarHeight
             Layout.maximumHeight: elisaTheme.navigationBarHeight
 
-            Controls1.ToolButton {
+            FlatButtonWithToolTip {
                 action: goPreviousAction
                 objectName: 'goPreviousButton'
                 Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
                 Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
+                implicitHeight: elisaTheme.smallControlButtonSize
+                implicitWidth: elisaTheme.smallControlButtonSize
                 visible: enableGoBack
             }
 
@@ -190,36 +191,35 @@
                     spacing: 0
                     Layout.bottomMargin: secondaryTitle !== "" ? 0 : 14
 
-                    Controls1.Button {
+                    Button {
                         objectName: 'enqueueButton'
                         text: i18nc("Add current list to playlist", "Enqueue")
-                        iconName: "media-track-add-amarok"
+                        icon.name: "media-track-add-amarok"
 
                         onClicked: enqueue()
 
                         Layout.leftMargin: 0
                         Layout.rightMargin: 0
                     }
 
-                    Controls1.Button {
+                    Button {
                         objectName: 'replaceAndPlayButton'
                         text: i18nc("Clear playlist and play", "Replace and Play")
-                        tooltip: i18nc("Clear playlist and add current list to it", "Replace PlayList and Play Now")
-                        iconName: "media-playback-start"
+                        icon.name: "media-playback-start"
 
                         onClicked: replaceAndPlay()
 
                         Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
                         Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
                     }
 
-                    Controls1.Button {
+                    Button {
                         objectName: 'showArtistButton'
                         id: showArtistButton
 
                         visible: allowArtistNavigation
                         text: i18nc("Button to navigate to the artist of the album", "Display Artist")
-                        iconName: "view-media-artist"
+                        icon.name: "view-media-artist"
 
                         onClicked: showArtist()
 
@@ -231,13 +231,15 @@
                         Layout.fillWidth: true
                     }
 
-                    Controls1.ToolButton {
+                    FlatButtonWithToolTip {
                         action: showFilterAction
                         objectName: 'showFilterButton'
 
                         Layout.alignment: Qt.AlignRight
                         Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
                         Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
+                        implicitHeight: elisaTheme.smallControlButtonSize
+                        implicitWidth: elisaTheme.smallControlButtonSize
                     }
                 }
             }
@@ -352,13 +354,15 @@
                 implicitWidth: elisaTheme.layoutHorizontalMargin * 4
             }
 
-            Controls1.ToolButton {
+            FlatButtonWithToolTip {
                 action: sortAction
                 objectName: 'sortAscendingButton'
 
                 Layout.alignment: Qt.AlignRight
                 Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
                 Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0
+                implicitHeight: elisaTheme.smallControlButtonSize
+                implicitWidth: elisaTheme.smallControlButtonSize
                 visible: enableSorting
             }
         }