use dropdown for wallet settings

ui/app/AppLayouts/Wallet/WalletHeader.qml

@@ -1,5 +1,6 @@
 import QtQuick 2.3
 import QtQuick.Controls 2.3
+import QtQuick.Controls 2.12 as QQC2
 import QtQuick.Layouts 1.3
 import "../../../imports"
 import "../../../shared"
@@ -148,14 +149,45 @@ Item {
                 fillMode: Image.PreserveAspectFit
                 source: "../../img/settings.svg"
             }
+
             MouseArea {
                 anchors.rightMargin: -Theme.smallPadding
                 anchors.leftMargin: -Theme.smallPadding
                 anchors.bottomMargin: -Theme.smallPadding
                 anchors.topMargin: -Theme.smallPadding
                 anchors.fill: parent
-                onClicked: settingsModal.open()
+                acceptedButtons: Qt.LeftButton | Qt.RightButton
                 cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    let x = settingsImg.x + settingsImg.width / 2 - newSettingsMenu.width / 2
+                    newSettingsMenu.popup(x, settingsImg.height + 10)
+                }
+
+                PopupMenu {
+                    id: newSettingsMenu
+                    width: 280
+                    QQC2.Action {
+                        text: qsTr("Account Settings")
+                        icon.source: "../../img/account_settings.svg"
+                        onTriggered: {
+                            console.log("TODO: AccountSettings")
+                        }
+                    }
+                    QQC2.Action {
+                        text: qsTr("Add/Remove Tokens")
+                        icon.source: "../../img/add_remove_token.svg"
+                        onTriggered: {
+                            console.log("TODO: Add/Remove Tokens")
+                        }
+                    }
+                    QQC2.Action {
+                        text: qsTr("Set Currency")
+                        icon.source: "../../img/set_currency.svg"
+                        onTriggered: {
+                            settingsModal.open()
+                        }
+                    }
+                }
             }
         }
     }

ui/app/img/account_settings.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 4.21333C0 2.92999 0.914 1.82866 2.17533 1.59266L9.87733 0.147995C10.2873 0.0713282 10.6667 0.385995 10.6667 0.803328V1.99999C10.6667 2.36866 10.368 2.66666 10 2.66666H2.412C2.15933 2.66666 1.92867 2.80933 1.816 3.03533L1.66667 3.33333C1.51333 3.64 1.736 3.99999 2.07867 3.99999H11.3333C11.7013 3.99999 12 4.29866 12 4.66666V11.3333C12 11.702 11.7013 12 11.3333 12H2.66667C1.194 12 0 10.8067 0 9.33333V4.21333ZM8.66667 8C8.66667 8.55266 9.11467 9 9.66667 9C10.2187 9 10.6667 8.55266 10.6667 8C10.6667 7.448 10.2187 7 9.66667 7C9.11467 7 8.66667 7.448 8.66667 8Z" fill="white"/>
+</svg>

ui/app/img/add_remove_token.svg

@@ -0,0 +1,4 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.66665 5.66666H7.66665V9.66666H6.33331V5.66666H4.33331V4.33333H9.66665V5.66666Z" fill="#4360DF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.99998 13.6667C3.31801 13.6667 0.333313 10.6819 0.333313 7C0.333313 3.31811 3.31801 0.333328 6.99998 0.333328C10.6819 0.333328 13.6666 3.31811 13.6666 7C13.6666 10.6819 10.6819 13.6667 6.99998 13.6667ZM6.99998 12.3333C9.94546 12.3333 12.3333 9.94555 12.3333 7C12.3333 4.05444 9.94546 1.66666 6.99998 1.66666C4.0545 1.66666 1.66665 4.05444 1.66665 7C1.66665 9.94555 4.0545 12.3333 6.99998 12.3333Z" fill="#4360DF"/>
+</svg>

ui/app/img/set_currency.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.99998 13.6667C10.6819 13.6667 13.6666 10.6819 13.6666 7C13.6666 3.3181 10.6819 0.333328 6.99998 0.333328C3.31808 0.333328 0.333313 3.3181 0.333313 7C0.333313 10.6819 3.31808 13.6667 6.99998 13.6667ZM12.2921 6.33333C12.0667 4.52579 10.9367 2.99916 9.36957 2.22066C9.41289 2.30748 9.45463 2.3962 9.49481 2.4866C9.95466 3.52127 10.249 4.86398 10.3178 6.33333H12.2921ZM12.2921 7.66666C12.0667 9.4742 10.9367 11.0008 9.36957 11.7793C9.41289 11.6925 9.45463 11.6038 9.49481 11.5134C9.95466 10.4787 10.249 9.13601 10.3178 7.66666H12.2921ZM8.98287 6.33333C8.91508 5.02231 8.6507 3.8703 8.27639 3.02811C8.05773 2.53614 7.81464 2.17928 7.57838 1.95443C7.34555 1.73286 7.15125 1.66666 6.99998 1.66666C6.84871 1.66666 6.65441 1.73286 6.42158 1.95443C6.18532 2.17928 5.94222 2.53614 5.72357 3.02811C5.34926 3.8703 5.08488 5.02231 5.01709 6.33333H8.98287ZM5.01709 7.66666H8.98287C8.91508 8.97768 8.6507 10.1297 8.27639 10.9719C8.05773 11.4639 7.81464 11.8207 7.57838 12.0456C7.34555 12.2671 7.15125 12.3333 6.99998 12.3333C6.84871 12.3333 6.65441 12.2671 6.42158 12.0456C6.18532 11.8207 5.94222 11.4639 5.72357 10.9719C5.34926 10.1297 5.08488 8.97768 5.01709 7.66666ZM3.68216 6.33333C3.75094 4.86398 4.0453 3.52127 4.50515 2.4866C4.54533 2.3962 4.58707 2.30748 4.63039 2.22066C3.06321 2.99916 1.93331 4.52579 1.70791 6.33333H3.68216ZM1.70791 7.66666H3.68216C3.75094 9.13601 4.0453 10.4787 4.50515 11.5134C4.54533 11.6038 4.58707 11.6925 4.63039 11.7793C3.06321 11.0008 1.93331 9.4742 1.70791 7.66666Z" fill="#4360DF"/>
+</svg>