[ui] more dialogs

icons, new font

18 files changed, 217 insertions, 53 deletions

diff --git a/gui/components/About.qml b/gui/components/About.qml
new file mode 100644
index 0000000..8642578
--- /dev/null
+++ b/gui/components/About.qml
@@ -0,0 +1,95 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+import QtQuick.Controls.Material 2.1
+
+import "../themes/themes.js" as Theme
+
+ThemedPage {
+
+    title: qsTr("About")
+
+    Rectangle {
+        anchors.horizontalCenter: parent.horizontalCenter
+        width: root.appWidth * 0.9
+        height: root.appHeight - 100
+        radius: 10
+        color: "white"
+
+        anchors {
+            fill: parent
+            margins: 10
+        }
+
+        Column {
+            id: aboutCol
+            padding: 20
+            width: parent.width 
+
+            Text {
+                width: parent.width - 40
+                font.pixelSize: 11
+                wrapMode: Label.Wrap
+                text: getText()
+                anchors.horizontalCenter: parent.horizontalCenter
+                onLinkActivated: Qt.openUrlExternally(link)
+            }
+
+            VerticalSpacer {
+                visible: true
+                height: 20
+            }
+
+            Image {
+                height: 80
+                source: "../resources/icon-noshield.svg"
+                fillMode: Image.PreserveAspectFit
+                anchors.horizontalCenter: parent.horizontalCenter
+            }
+
+            TextEdit {
+                width: parent.width - 40
+                font.pixelSize: 10
+                readOnly: true
+                selectByMouse: true
+                text: getVersion()
+                anchors.horizontalCenter: parent.horizontalCenter
+            }
+
+            VerticalSpacer {
+                visible: true
+                height: 50
+            }
+        } // end column
+    } // end rectangle
+
+    function getText() {
+        var _name = ctx ? ctx.appName : "vpn"
+        var _provider = ctx ? ctx.provider : "unknown"
+        var _donateURL = ctx ? ctx.donateURL : ""
+        var _tosURL = ctx ? ctx.tosURL : "…"
+        var _donateTXT = ""
+        if (_donateURL) {
+            //: donation text of the about dialog
+            _donateTXT = qsTr(
+                        "<p>This service is paid for entirely by donations from users like you. <a href=\"%1\">Please donate</a>.</p>").arg(
+                        _donateURL)
+        }
+        //: about dialog
+        //: %1 -> application name
+        //: %2 -> provider name
+        //: %3 -> donation text if activated
+        var _txt = qsTr(
+                    "<p>%1 is an easy, fast, and secure VPN service from %2. %1 does not require a user account, keep logs, or track you in any way.</p> %3 <p>By using this application, you agree to the <a href=\"%4\">Terms of Service</a>. This service is provided as-is, without any warranty, and is intended for people who work to make the world a better place.</p>").arg(
+                    _name).arg(_provider).arg(_donateTXT).arg(_tosURL)
+        return _txt
+    }
+
+    function getVersion() {
+        var _name = ctx ? ctx.appName : "vpn"
+        var _ver = ctx ? ctx.version : "unknown"
+        //: %1 -> application name
+        //: %2 -> version string
+        var _txt = qsTr("%1 version: %2").arg(_name).arg(_ver)
+        return _txt
+    }
+}
diff --git a/gui/components/BoldLabel.qml b/gui/components/BoldLabel.qml
index d4a6ba3..3c46998 100644
--- a/gui/components/BoldLabel.qml
+++ b/gui/components/BoldLabel.qml
@@ -8,7 +8,7 @@ Label {
 
     font {
         pixelSize: Theme.fontSize * 1.5
-        family: boldFont.name
+        family: boldFontMonserrat.name
         bold: true
     }
 
diff --git a/gui/components/Footer.qml b/gui/components/Footer.qml
index 893f4cf..1b0d8fa 100644
--- a/gui/components/Footer.qml
+++ b/gui/components/Footer.qml
@@ -21,9 +21,12 @@ ToolBar {
         ToolButton {
             id: gwButton
             visible: hasMultipleGateways()
+
             anchors {
                 verticalCenter: parent.verticalCenter
-                leftMargin: 20
+                leftMargin: 10
+                // TODO discuss where this should be aligned
+                //leftMargin: 22
                 left: parent.left
                 verticalCenterOffset: 5
             }
@@ -40,6 +43,7 @@ ToolBar {
         Label {
             id: locationLabel
             anchors.left: gwButton.right
+            anchors.leftMargin: -7
             anchors.verticalCenter: parent.verticalCenter
             anchors.verticalCenterOffset: 7
             text: locationStr()
diff --git a/gui/components/Help.qml b/gui/components/Help.qml
index aced273..460dde4 100644
--- a/gui/components/Help.qml
+++ b/gui/components/Help.qml
@@ -1,32 +1,33 @@
 import QtQuick 2.9
 import QtQuick.Controls 2.2
 
-Page {
+ThemedPage {
     title: qsTr("Help")
+    property var issueTracker: "https://0xacab.org/leap/bitmask-vpn/issues"
 
     Column {
         anchors.centerIn: parent
         spacing: 10
 
-        Button {
+        Text {
+            font.pixelSize: 14
             anchors.horizontalCenter: parent.horizontalCenter
-            text: qsTr("Donate")
-            onClicked: stackView.push("Donate.qml")
+            text: getDummyLink(qsTr("Troubleshooting and support"))
+            onLinkActivated: Qt.openUrlExternally(ctx.helpURL)
         }
-        Button {
+        Text {
+            font.pixelSize: 14
             anchors.horizontalCenter: parent.horizontalCenter
-            text: qsTr("Terms of Service")
-            onClicked: stackView.push("Donate.qml")
+            text: getDummyLink(qsTr("Report a bug"))
+            onLinkActivated: Qt.openUrlExternally(issueTracker)
         }
         Button {
             anchors.horizontalCenter: parent.horizontalCenter
-            text: qsTr("Contact Support")
-            onClicked: stackView.push("Donate.qml")
-        }
-        Button {
-            anchors.horizontalCenter: parent.horizontalCenter
-            text: qsTr("Report bug")
-            onClicked: stackView.push("Donate.qml")
+            text: qsTr("Open logs")
         }
     }
+
+    function getDummyLink(text) {
+        return "<a href='#'>" + text + "</a>"
+    }
 }
diff --git a/gui/components/InitErrors.qml b/gui/components/InitErrors.qml
index 2859168..1f1f439 100644
--- a/gui/components/InitErrors.qml
+++ b/gui/components/InitErrors.qml
@@ -11,7 +11,7 @@ ErrorBox {
             name: "noerror"
             when: root.error == ""
             PropertyChanges {
-                target: splashSpinner
+                target: splashProgress
                 visible: true
             }
             PropertyChanges {
@@ -23,7 +23,7 @@ ErrorBox {
             name: "nohelpers"
             when: root.error == "nohelpers"
             PropertyChanges {
-                target: splashSpinner
+                target: splashProgress
                 visible: false
             }
             PropertyChanges {
diff --git a/gui/components/Locations.qml b/gui/components/Locations.qml
index 955da26..a0e7a30 100644
--- a/gui/components/Locations.qml
+++ b/gui/components/Locations.qml
@@ -47,11 +47,13 @@ ThemedPage {
         height: 100
         radius: 10
         color: "white"
+
         anchors {
             horizontalCenter: parent.horizontalCenter
             top: parent.top
             margins: 10
         }
+
         Rectangle {
             anchors {
                 fill: parent
diff --git a/gui/components/MainView.qml b/gui/components/MainView.qml
index 5407178..bae34fb 100644
--- a/gui/components/MainView.qml
+++ b/gui/components/MainView.qml
@@ -51,7 +51,7 @@ Page {
                     text: qsTr("Donate")
                     icon: "../resources/donate.svg"
                     triggered: function () {
-                        aboutDialog.open()
+                        donateDialog.open()
                     }
                 }
                 ListElement {
@@ -66,7 +66,8 @@ Page {
                     text: qsTr("About")
                     icon: "../resources/about.svg"
                     triggered: function () {
-                        aboutDialog.open()
+                        stackView.push("About.qml")
+                        settingsDrawer.close()
                     }
                 }
                 ListElement {
@@ -90,14 +91,53 @@ Page {
     }
 
     Dialog {
-        id: aboutDialog
-        title: qsTr("About")
-        Label {
-            anchors.fill: parent
-            text: qsTr("RiseupVPN\nhttps://riseupvpn.net/vpn")
+        id: donateDialog 
+        width: 350
+        title: qsTr("Please donate!")
+        standardButtons: Dialog.Ok
+
+        Text {
+            id: donateText
+            width: 300
+            wrapMode: Text.Wrap
             horizontalAlignment: Text.AlignHCenter
+            anchors {
+                topMargin: 20
+                bottomMargin: 40
+                horizontalCenter: parent.horizontalCenter
+            }
+            font.pixelSize: 12
+            text: qsTr("This service is paid for entirely by donations from users like you. The cost of running the VPN is approximately 5 USD per person every month, but every little bit counts.")
         }
 
-        standardButtons: StandardButton.Ok
+        Label {
+            id: donateURL
+            anchors {
+                top: donateText.bottom
+                topMargin: 20
+                horizontalCenter: parent.horizontalCenter
+            }
+            font.pixelSize: 14
+            text: getLink(ctx.donateURL)
+            onLinkActivated: Qt.openUrlExternally(ctx.donateURL)
+        }
+
+
+        Image {
+            height: 50
+            source: "../resources/donate.svg"
+            fillMode: Image.PreserveAspectFit
+            anchors {
+                topMargin: 20
+                top: donateURL.bottom
+                horizontalCenter: parent.horizontalCenter
+            }
+        }
+
+        onAccepted: Qt.openUrlExternally(ctx.donateURL)
+    }
+
+    function getLink(url) {
+        return "<a href='#'>" + url + "</a>"
     }
 }
diff --git a/gui/components/Splash.qml b/gui/components/Splash.qml
index 8cc9bd9..16f1b9d 100644
--- a/gui/components/Splash.qml
+++ b/gui/components/Splash.qml
@@ -14,7 +14,7 @@ Page {
 
         VerticalSpacer {
             visible: true
-            height: root.height * 0.10
+            height: root.height * 0.25
         }
 
         Image {
@@ -27,10 +27,11 @@ Page {
 
         VerticalSpacer {
             visible: true
-            height: root.height * 0.22
+            height: root.height * 0.05
         }
 
         ProgressBar {
+            id: splashProgress
             anchors.horizontalCenter: parent.horizontalCenter
             indeterminate: true
         }
diff --git a/gui/components/StatusBox.qml b/gui/components/StatusBox.qml
index 2f56faf..c4a4a08 100644
--- a/gui/components/StatusBox.qml
+++ b/gui/components/StatusBox.qml
@@ -29,6 +29,7 @@ Item {
         height: 300
         radius: 10
         antialiasing: true
+
         anchors {
             fill: parent
             margins: 20
@@ -76,7 +77,7 @@ Item {
         height: 45
         anchors {
             top: statusBoxBackground.top
-            topMargin: 40
+            topMargin: 25
             horizontalCenter: parent.horizontalCenter
         }
         BoldLabel {
@@ -96,7 +97,7 @@ Item {
         VerticalSpacer {
             id: spacerPreImg
             visible: true
-            height: 150
+            height: 120
         }
 
         Image {
@@ -110,7 +111,8 @@ Item {
         VerticalSpacer {
             id: spacerPostImg
             visible: true
-            height: 30
+            height: 20
+            Layout.alignment: Qt.AlignBottom
         }
 
         MaterialButton {
@@ -128,7 +130,7 @@ Item {
             }
 
             onClicked: {
-                if (vpn.state === "on") {
+                if (vpn.state === "on" | vpn.state === "starting") {
                     backend.switchOff()
                 } else if (vpn.state === "off") {
                     vpn.startingUI = true
diff --git a/gui/gui.qrc b/gui/gui.qrc
index 7c0a418..67da45c 100644
--- a/gui/gui.qrc
+++ b/gui/gui.qrc
@@ -11,6 +11,7 @@
         <file>components/Home.qml</file>
         <file>components/Header.qml</file>
         <file>components/Footer.qml</file>
+        <file>components/About.qml</file>
         <file>components/WrappedRadioButton.qml</file>
         <file>components/StatusBox.qml</file>
         <file>components/Spinner.qml</file>
@@ -54,8 +55,9 @@
         <file>resources/alert.svg</file>
 
         <!-- fonts -->
-        <file alias="montserrat-light.ttf">resources/fonts/Montserrat-Regular.ttf</file>
-        <file alias="montserrat-bold.ttf">resources/fonts/Montserrat-SemiBold.ttf</file>
+        <file alias="poppins-light.ttf">resources/fonts/Poppins-Thin.ttf</file>
+        <file alias="poppins-bold.ttf">resources/fonts/Poppins-Light.ttf</file>
+        <file alias="monserrat-bold.ttf">resources/fonts/Montserrat-SemiBold.ttf</file>
 
         <!-- begin, to remove -->
         <file>qml/VpnState.qml</file>
diff --git a/gui/main.qml b/gui/main.qml
index 515330a..d8bfb91 100644
--- a/gui/main.qml
+++ b/gui/main.qml
@@ -9,7 +9,7 @@
  - [x] font: monserrat
  - [x] nested states
  - [x] splash init errors
- - [.] gateway selector
+ - [x] gateway selector
  - [ ] bridges
  - [ ] minimize/hide from systray
  - [ ] control actions from systray
@@ -29,14 +29,19 @@ import "./components"
 ApplicationWindow {
 
     id: root
-
     visible: true
-    width: 360
-    height: 520
-    minimumWidth: 300
-    maximumWidth: 300
-    minimumHeight: 500
-    maximumHeight: 500
+
+    property int appHeight: 460
+    property int appWidth: 260
+
+    width: appWidth
+    minimumWidth: appWidth
+    maximumWidth: appWidth
+
+    height: appHeight
+    minimumHeight: appHeight
+    maximumHeight: appHeight
+
 
     title: ctx ? ctx.appName : "VPN"
     Material.accent: Material.Green
@@ -60,12 +65,17 @@ ApplicationWindow {
 
     FontLoader {
         id: lightFont
-        source: "qrc:/montserrat-light.ttf"
+        source: "qrc:/poppins-light.ttf"
     }
 
     FontLoader {
         id: boldFont
-        source: "qrc:/montserrat-bold.ttf"
+        source: "qrc:/poppins-bold.ttf"
+    }
+
+    FontLoader {
+        id: boldFontMonserrat
+        source: "qrc:/monserrat-bold.ttf"
     }
 
     font.family: lightFont.name
diff --git a/gui/providers/providers.json b/gui/providers/providers.json
index 52fcbf9..964599a 100644
--- a/gui/providers/providers.json
+++ b/gui/providers/providers.json
@@ -15,7 +15,7 @@
             "apiURL": "https://api.black.riseup.net/",
             "geolocationAPI": "https://api.black.riseup.net:9001/json",
             "caCertString": "-----BEGIN CERTIFICATE-----\nMIIFjTCCA3WgAwIBAgIBATANBgkqhkiG9w0BAQ0FADBZMRgwFgYDVQQKDA9SaXNl\ndXAgTmV0d29ya3MxGzAZBgNVBAsMEmh0dHBzOi8vcmlzZXVwLm5ldDEgMB4GA1UE\nAwwXUmlzZXVwIE5ldHdvcmtzIFJvb3QgQ0EwHhcNMTQwNDI4MDAwMDAwWhcNMjQw\nNDI4MDAwMDAwWjBZMRgwFgYDVQQKDA9SaXNldXAgTmV0d29ya3MxGzAZBgNVBAsM\nEmh0dHBzOi8vcmlzZXVwLm5ldDEgMB4GA1UEAwwXUmlzZXVwIE5ldHdvcmtzIFJv\nb3QgQ0EwggIiMA0GCSqGSIb3DQEBAQUAA4ICDwAwggIKAoICAQC76J4ciMJ8Sg0m\nTP7DF2DT9zNe0Csk4myoMFC57rfJeqsAlJCv1XMzBmXrw8wq/9z7XHv6n/0sWU7a\n7cF2hLR33ktjwODlx7vorU39/lXLndo492ZBhXQtG1INMShyv+nlmzO6GT7ESfNE\nLliFitEzwIegpMqxCIHXFuobGSCWF4N0qLHkq/SYUMoOJ96O3hmPSl1kFDRMtWXY\niw1SEKjUvpyDJpVs3NGxeLCaA7bAWhDY5s5Yb2fA1o8ICAqhowurowJpW7n5ZuLK\n5VNTlNy6nZpkjt1QycYvNycffyPOFm/Q/RKDlvnorJIrihPkyniV3YY5cGgP+Qkx\nHUOT0uLA6LHtzfiyaOqkXwc4b0ZcQD5Vbf6Prd20Ppt6ei0zazkUPwxld3hgyw58\nm/4UIjG3PInWTNf293GngK2Bnz8Qx9e/6TueMSAn/3JBLem56E0WtmbLVjvko+LF\nPM5xA+m0BmuSJtrD1MUCXMhqYTtiOvgLBlUm5zkNxALzG+cXB28k6XikXt6MRG7q\nhzIPG38zwkooM55yy5i1YfcIi5NjMH6A+t4IJxxwb67MSb6UFOwg5kFokdONZcwj\nshczHdG9gLKSBIvrKa03Nd3W2dF9hMbRu//STcQxOailDBQCnXXfAATj9pYzdY4k\nha8VCAREGAKTDAex9oXf1yRuktES4QIDAQABo2AwXjAdBgNVHQ4EFgQUC4tdmLVu\nf9hwfK4AGliaet5KkcgwDgYDVR0PAQH/BAQDAgIEMAwGA1UdEwQFMAMBAf8wHwYD\nVR0jBBgwFoAUC4tdmLVuf9hwfK4AGliaet5KkcgwDQYJKoZIhvcNAQENBQADggIB\nAGzL+GRnYu99zFoy0bXJKOGCF5XUXP/3gIXPRDqQf5g7Cu/jYMID9dB3No4Zmf7v\nqHjiSXiS8jx1j/6/Luk6PpFbT7QYm4QLs1f4BlfZOti2KE8r7KRDPIecUsUXW6P/\n3GJAVYH/+7OjA39za9AieM7+H5BELGccGrM5wfl7JeEz8in+V2ZWDzHQO4hMkiTQ\n4ZckuaL201F68YpiItBNnJ9N5nHr1MRiGyApHmLXY/wvlrOpclh95qn+lG6/2jk7\n3AmihLOKYMlPwPakJg4PYczm3icFLgTpjV5sq2md9bRyAg3oPGfAuWHmKj2Ikqch\nTd5CHKGxEEWbGUWEMP0s1A/JHWiCbDigc4Cfxhy56CWG4q0tYtnc2GMw8OAUO6Wf\nXu5pYKNkzKSEtT/MrNJt44tTZWbKV/Pi/N2Fx36my7TgTUj7g3xcE9eF4JV2H/sg\ntsK3pwE0FEqGnT4qMFbixQmc8bGyuakr23wjMvfO7eZUxBuWYR2SkcP26sozF9PF\ntGhbZHQVGZUTVPyvwahMUEhbPGVerOW0IYpxkm0x/eaWdTc4vPpf/rIlgbAjarnJ\nUN9SaWRlWKSdP4haujnzCoJbM7dU9bjvlGZNyXEekgeT0W2qFeGGp+yyUWw8tNsp\n0BuC1b7uW/bBn/xKm319wXVDvBgZgcktMolak39V7DVO\n-----END CERTIFICATE-----",
-            "timeStamp": "2021-08-25 00:56:22"
+            "timeStamp": "2021-09-16 17:22:20"
         }
     ]
 }
\ No newline at end of file
diff --git a/gui/resources/donate.svg b/gui/resources/donate.svg
index 35d7c2b..67c7f77 100644
--- a/gui/resources/donate.svg
+++ b/gui/resources/donate.svg
@@ -1,4 +1,14 @@
-<?xml version="1.0" standalone="no"?>
-<svg width="1024px" height="1024px" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" class="icon">
-  <path d="M880 310H732.4c13.6-21.4 21.6-46.8 21.6-74 0-76.1-61.9-138-138-138-41.4 0-78.7 18.4-104 47.4-25.3-29-62.6-47.4-104-47.4-76.1 0-138 61.9-138 138 0 27.2 7.9 52.6 21.6 74H144c-17.7 0-32 14.3-32 32v200c0 4.4 3.6 8 8 8h40v344c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V550h40c4.4 0 8-3.6 8-8V342c0-17.7-14.3-32-32-32zm-334-74c0-38.6 31.4-70 70-70s70 31.4 70 70-31.4 70-70 70h-70v-70zm-138-70c38.6 0 70 31.4 70 70v70h-70c-38.6 0-70-31.4-70-70s31.4-70 70-70zM180 482V378h298v104H180zm48 68h250v308H228V550zm568 308H546V550h250v308zm48-376H546V378h298v104z"/>
+<?xml version='1.0' encoding='iso-8859-1'?>
+<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 449.266 449.266" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 449.266 449.266">
+  <g>
+    <path d="m0,162.677c1.471-7.672 2.659-15.411 4.468-23.001 4.669-19.586 14.721-36.449 27.524-51.675 16.709-19.87 38.465-32.482 62.675-40.637 8.353-2.814 17.695-3.199 26.638-3.652 18.842-0.955 37.613-0.287 55.572,6.583 14.91,5.704 30.113,10.913 41.032,23.648 16.92-19.999 36.441-36.317 60.027-46.447 12.027-5.166 25.635-6.879 38.676-9.388 13.591-2.615 27.112-1.139 40.261,3.191 16.364,5.389 31.001,12.737 43.184,26.065 15.368,16.811 28.572,34.731 37.842,55.362 9.344,20.794 12.648,42.712 10.93,65.634-3.164,42.205-20.91,78.961-41.387,114.809-13.325,23.326-30.344,43.968-47.652,64.329-19.597,23.054-39.643,45.727-59.548,68.518-3.76,4.305-7.264,9.076-11.785,12.416-7.268,5.37-15.815,4.838-23.723,1.5-21.905-9.246-43.803-18.547-65.371-28.544-34.706-16.086-67.663-35.396-98.008-58.645-28.136-21.556-55.436-44.294-74.035-75.377-11.468-19.168-20.81-39.222-24.84-61.381-1.131-6.219-1.67-12.545-2.48-18.822 0-8.162 0-16.324 0-24.486zm138.093,118.407c0.798,0.049 1.597,0.098 2.395,0.147 0,2.093 0.282,4.23-0.044,6.271-2.958,18.517-6.069,37.011-8.975,55.536-0.25,1.596 0.076,4.171 1.122,4.933 5.693,4.145 11.696,7.864 17.813,11.875 3.782-20.45 7.414-40.086 11.046-59.722 0.816,0.104 1.632,0.209 2.448,0.313 3.69,21.588-6.297,41.888-7.588,63.512 6.1,3.017 12.435,6.151 19.356,9.575 0.534-17.943 2.253-34.93 6.903-51.596 1.294,4.038 1.505,8.007 1.254,11.947-0.718,11.255-1.11,22.569-2.639,33.721-0.999,7.29 1.874,10.644 8.054,13.312 27.057,11.685 54.067,23.485 80.912,35.646 5.566,2.522 8.832,1.563 12.667-2.846 12.496-14.368 25.695-28.134 37.992-42.665 17.168-20.287 34.472-40.524 50.457-61.733 29.574-39.238 52.764-81.684 60.977-131.008 3.612-21.694 2.07-42.988-5.508-63.548-7.515-20.391-19.57-37.989-33.886-54.446-10.653-12.247-22.702-20.907-38.049-26.045-14.674-4.912-29.379-4.857-44.163-2.506-12.976,2.064-25.656,5.14-37.222,12.332-16.857,10.482-32.584,22.14-45.908,36.935-5.756,6.392-7.795,6.488-14.974,1.486-5.733-3.995-11.054-8.809-17.244-11.874-15.132-7.492-30.697-14.43-47.942-14.91-13.772-0.383-28.119-1.981-41.261,1.062-36.026,8.343-62.722,29.891-80.286,62.742-9.521,17.807-12.187,36.847-11.692,56.546 0.251,9.977 1.408,19.931 2.156,29.895 6.996-18.871 11.089-38.264 19.718-56.249 0.663,3.048 0.665,5.967-0.062,8.692-4.731,17.734-9.652,35.416-14.424,53.139-0.711,2.642-1.995,5.746-1.239,8.055 2.75,8.395 6.254,16.542 9.474,24.783-0.004-19.996 13.682-63.895 21.754-66.771 0.071,0.547 0.304,1.107 0.181,1.574-5.599,21.333-11.2,42.665-16.917,63.966-0.388,1.447-1.675,2.652-2.952,4.589 2.849,4.983 6.17,10.79 9.708,16.977 5.582-23.415 11.955-45.637 20.018-67.32 0.947,0.235 1.894,0.471 2.841,0.706-0.908,4.953-1.48,9.996-2.785,14.842-4.633,17.202-9.585,34.318-14.228,51.517-0.679,2.517-1.435,6.01-0.264,7.844 3.593,5.626 8.106,10.665 12.416,16.127 1.821-8.665 3.142-16.663 5.225-24.458 3.073-11.499 6.578-22.888 10.152-34.244 0.836-2.658 2.686-4.997 4.069-7.483 0.668,0.273 1.337,0.545 2.005,0.818-0.185,1.672-0.174,3.394-0.585,5.009-4.02,15.816-8.143,31.607-12.173,47.42-4.55,17.851-4.278,18.864 7.809,29.365 2.162,1.878 4.535,3.512 6.942,5.359 3.763-31.091 12.602-64.735 18.446-68.037-0.305,3.505-0.256,6.623-0.887,9.597-4.164,19.626-8.484,39.22-12.713,58.832-0.25,1.157-0.691,2.969-0.128,3.496 4.727,4.412 9.668,8.595 14.581,12.88 3.488-21.351 7.569-41.653 13.545-61.555 3.454,8.652 0.594,16.914-0.768,25.161-1.918,11.608-4.526,23.1-6.551,34.693-0.403,2.306-0.416,5.915 0.954,7.074 4.826,4.081 10.332,7.356 16.043,11.253 3.929-21.481 5.576-42.61 12.624-62.538z"/>
+    <path d="m323.215,180.532c-11.437,0.54-21.869-7.32-24.496-19.698-2.074-9.769 0.643-20.268 14.992-27.034 16.595-7.825 38.338,2.266 41.542,19.456 1.241,6.661-1.597,12.154-5.984,16.317-6.883,6.532-14.978,11.249-26.054,10.959z"/>
+    <path d="m138.898,167.131c10.239,0.462 18.598,4.189 24.964,12.702 8.553,11.437 4.653,30.666-13.57,34.835-11.712,2.68-22.732-0.233-30.92-9.83-6.064-7.108-7.682-15.335-4.207-24.161 3.714-9.432 12.03-12.042 20.963-13.526 0.9-0.15 1.846-0.02 2.77-0.02z"/>
+    <path d="m233.191,201.992c-18.463-0.352-33.732-13.583-33.995-29.657-0.069-4.211 0.406-8.07 5.452-8.782 4.457-0.629 6.549,2.393 7.9,6.115 2.375,6.541 5.583,12.351 12.453,15.308 7.538,3.245 14.041,1.509 20.36-3.255 6.251-4.712 6.39-11.098 4.713-17.471-1.391-5.288 0.388-8.403 4.769-10.206 4.253-1.75 9.037,1.207 10.836,6.156 7.199,19.813-5.703,34.627-22.764,40.173-3.09,1.006-6.475,1.103-9.724,1.619z"/>
+    <path d="m201.168,384.698c-0.87-2.062-2.637-4.202-2.466-6.174 1.224-14.102 2.828-28.172 4.369-42.246 0.096-0.879 0.683-1.705 1.041-2.555 0.868,0.363 1.736,0.726 2.604,1.088-1.047,16.37-2.093,32.739-3.14,49.109-0.803,0.26-1.605,0.519-2.408,0.778z"/>
+    <path d="m222.055,387.444c-4.873-5.745-5.046-15.022-1.052-37.842 3.141,2.956 4.044,30.448 1.052,37.842z"/>
+    <path d="m240.862,361.741c-0.458,6.595-0.916,13.19-1.402,20.177-4.79-3.306-4.603-11.907-0.192-20.378 0.531,0.067 1.062,0.134 1.594,0.201z"/>
+    <path d="m257.434,380.447c-4.179-5.294-3.756-9.74 1.05-14.765-0.375,5.277-0.661,9.306-1.05,14.765z"/>
+  </g>
 </svg>
diff --git a/gui/resources/fonts/Montserrat-Regular.ttf b/gui/resources/fonts/Montserrat-Regular.ttf
deleted file mode 100644
index 8d443d5..0000000
--- a/gui/resources/fonts/Montserrat-Regular.ttf
+++ /dev/null
diff --git a/gui/resources/fonts/Poppins-Light.ttf b/gui/resources/fonts/Poppins-Light.ttf
new file mode 100644
index 0000000..2ab0221
--- /dev/null
+++ b/gui/resources/fonts/Poppins-Light.ttf
diff --git a/gui/resources/fonts/Poppins-Thin.ttf b/gui/resources/fonts/Poppins-Thin.ttf
new file mode 100644
index 0000000..f5c0fdd
--- /dev/null
+++ b/gui/resources/fonts/Poppins-Thin.ttf
diff --git a/gui/resources/help.svg b/gui/resources/help.svg
index 06569c8..3d2fdd9 100644
--- a/gui/resources/help.svg
+++ b/gui/resources/help.svg
@@ -1,4 +1 @@
-<?xml version="1.0" standalone="no"?>
-<svg width="1024px" height="1024px" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" class="icon">
-  <path d="M824.2 699.9a301.55 301.55 0 0 0-86.4-60.4C783.1 602.8 812 546.8 812 484c0-110.8-92.4-201.7-203.2-200-109.1 1.7-197 90.6-197 200 0 62.8 29 118.8 74.2 155.5a300.95 300.95 0 0 0-86.4 60.4C345 754.6 314 826.8 312 903.8a8 8 0 0 0 8 8.2h56c4.3 0 7.9-3.4 8-7.7 1.9-58 25.4-112.3 66.7-153.5A226.62 226.62 0 0 1 612 684c60.9 0 118.2 23.7 161.3 66.8C814.5 792 838 846.3 840 904.3c.1 4.3 3.7 7.7 8 7.7h56a8 8 0 0 0 8-8.2c-2-77-33-149.2-87.8-203.9zM612 612c-34.2 0-66.4-13.3-90.5-37.5a126.86 126.86 0 0 1-37.5-91.8c.3-32.8 13.4-64.5 36.3-88 24-24.6 56.1-38.3 90.4-38.7 33.9-.3 66.8 12.9 91 36.6 24.8 24.3 38.4 56.8 38.4 91.4 0 34.2-13.3 66.3-37.5 90.5A127.3 127.3 0 0 1 612 612zM361.5 510.4c-.9-8.7-1.4-17.5-1.4-26.4 0-15.9 1.5-31.4 4.3-46.5.7-3.6-1.2-7.3-4.5-8.8-13.6-6.1-26.1-14.5-36.9-25.1a127.54 127.54 0 0 1-38.7-95.4c.9-32.1 13.8-62.6 36.3-85.6 24.7-25.3 57.9-39.1 93.2-38.7 31.9.3 62.7 12.6 86 34.4 7.9 7.4 14.7 15.6 20.4 24.4 2 3.1 5.9 4.4 9.3 3.2 17.6-6.1 36.2-10.4 55.3-12.4 5.6-.6 8.8-6.6 6.3-11.6-32.5-64.3-98.9-108.7-175.7-109.9-110.9-1.7-203.3 89.2-203.3 199.9 0 62.8 28.9 118.8 74.2 155.5-31.8 14.7-61.1 35-86.5 60.4-54.8 54.7-85.8 126.9-87.8 204a8 8 0 0 0 8 8.2h56.1c4.3 0 7.9-3.4 8-7.7 1.9-58 25.4-112.3 66.7-153.5 29.4-29.4 65.4-49.8 104.7-59.7 3.9-1 6.5-4.7 6-8.7z"/>
-</svg>
+<svg width="21px" height="21px" viewBox="0 0 21 21" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><circle cx="10.5" cy="10.5" r="8"/><circle cx="10.5" cy="10.5" r="4"/><path d="m13.5 7.5 2.5-2.5"/><path d="m13.5 13.5 2.5 2.5"/><path d="m7.5 13.5-2.5 2.5"/><path d="m7.5 7.5-2.5-2.5"/></g></svg>
\ No newline at end of file
diff --git a/gui/themes/themes.js b/gui/themes/themes.js
index 0e9293a..1c7a7c8 100644
--- a/gui/themes/themes.js
+++ b/gui/themes/themes.js
@@ -48,7 +48,7 @@ const blueButton = {
     "focusBorder": blueFocusBorder,
 };
 
-const buttonFontSize = 20;
+const buttonFontSize = 18;
 const buttonColor = "#eeeeee";
 
 const bgColor = "#f3f3f3";