diff --git a/qml.qrc b/qml.qrc
index 19294fa..50e5297 100644
--- a/qml.qrc
+++ b/qml.qrc
@@ -95,5 +95,6 @@
         <file>src/wizardview/components/HoverableGradientButton.qml</file>
         <file>src/commoncomponents/AccountMigrationDialog.qml</file>
         <file>src/mainview/components/RecordBox.qml</file>
+        <file>src/commoncomponents/ElidedTextLabel.qml</file>
     </qresource>
 </RCC>
diff --git a/src/commoncomponents/ElidedTextLabel.qml b/src/commoncomponents/ElidedTextLabel.qml
new file mode 100644
index 0000000..b94435d
--- /dev/null
+++ b/src/commoncomponents/ElidedTextLabel.qml
@@ -0,0 +1,44 @@
+/*
+ * Copyright (C) 2020 by Savoir-faire Linux
+ * Author: Albert Babí <albert.babig@savoirfairelinux.com>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.14
+import QtQuick.Controls 1.4
+import net.jami.Models 1.0
+
+
+Label {
+    property string eText : ""
+    property int maxWidth: 100
+    property int fontSize: JamiTheme.textFontSize
+
+    font.pointSize: fontSize
+    font.kerning: true
+
+    text: elided.elidedText
+
+    horizontalAlignment: Text.AlignLeft
+    verticalAlignment: Text.AlignVCenter
+    color: "black"
+
+    TextMetrics {
+        id: elided
+        elide: Text.ElideRight
+        elideWidth: maxWidth
+        text: eText
+    }
+}
diff --git a/src/commoncomponents/PhotoboothView.qml b/src/commoncomponents/PhotoboothView.qml
index 4b006fa..3a76bc8 100644
--- a/src/commoncomponents/PhotoboothView.qml
+++ b/src/commoncomponents/PhotoboothView.qml
@@ -13,7 +13,7 @@
     property string imgBase64: ""
     property string fileName: ""
 
-    property int boothWidht: 224
+    property int boothWidth: 224
 
     signal imageAcquired
     signal imageCleared
@@ -65,7 +65,7 @@
                 return
             }
             imgBase64 = ClientWrapper.utilsAdaptor.getCroppedImageBase64FromFile(
-                        ClientWrapper.utilsAdaptor.getAbsPath(fileName),boothWidht)
+                        ClientWrapper.utilsAdaptor.getAbsPath(fileName),boothWidth)
             imageAcquired()
             stopBooth()
         }
@@ -73,9 +73,9 @@
 
     spacing: 0
 
-    Layout.maximumWidth: boothWidht
-    Layout.preferredWidth: boothWidht
-    Layout.minimumWidth: boothWidht
+    Layout.maximumWidth: boothWidth
+    Layout.preferredWidth: boothWidth
+    Layout.minimumWidth: boothWidth
 
     Layout.maximumHeight: 0
 
@@ -86,13 +86,13 @@
 
         visible: !takePhotoState
 
-        Layout.maximumWidth: boothWidht
-        Layout.preferredWidth: boothWidht
-        Layout.minimumWidth: boothWidht
+        Layout.maximumWidth: boothWidth
+        Layout.preferredWidth: boothWidth
+        Layout.minimumWidth: boothWidth
 
-        Layout.maximumHeight: boothWidht
-        Layout.preferredHeight: boothWidht
-        Layout.minimumHeight: boothWidht
+        Layout.maximumHeight: boothWidth
+        Layout.preferredHeight: boothWidth
+        Layout.minimumHeight: boothWidth
 
         Layout.alignment: Qt.AlignHCenter
 
@@ -139,13 +139,13 @@
         focus: visible
 
         Layout.alignment: Qt.AlignHCenter
-        Layout.maximumWidth: boothWidht
-        Layout.preferredWidth: boothWidht
-        Layout.minimumWidth: boothWidht
+        Layout.maximumWidth: boothWidth
+        Layout.preferredWidth: boothWidth
+        Layout.minimumWidth: boothWidth
 
-        Layout.maximumHeight: boothWidht
-        Layout.preferredHeight: boothWidht
-        Layout.minimumHeight: boothWidht
+        Layout.maximumHeight: boothWidth
+        Layout.preferredHeight: boothWidth
+        Layout.minimumHeight: boothWidth
 
         layer.enabled: true
         layer.effect: OpacityMask {
@@ -233,7 +233,7 @@
                     flashAnimation.restart()
 
                     // run concurrent function call to take photo
-                    imgBase64 = previewWidget.takeCroppedPhotoToBase64(boothWidht)
+                    imgBase64 = previewWidget.takeCroppedPhotoToBase64(boothWidth)
                     hasAvatar = true
                     imageAcquired()
                     stopBooth()
diff --git a/src/constant/JamiTheme.qml b/src/constant/JamiTheme.qml
index 0f8bff2..5fa324d 100644
--- a/src/constant/JamiTheme.qml
+++ b/src/constant/JamiTheme.qml
@@ -75,9 +75,17 @@
 
     property int splitViewHandlePreferredWidth: 4
     property int textFontSize: 9
+    property int settingsFontSize: 10
+    property int buttonFontSize: 9
+    property int headerFontSize: 13
     property int titleFontSize: 16
     property int menuFontSize: 12
 
+    property int maximumWidthSettingsView: 800
+    property int preferredButtonWidth: 200
+    property int preferredFieldHeight: 32
+    property int preferredMarginSize: 16
+
 
     /*
      * Place holder text.
diff --git a/src/mainview/MainView.qml b/src/mainview/MainView.qml
index aa9dcec..1e6b422 100644
--- a/src/mainview/MainView.qml
+++ b/src/mainview/MainView.qml
@@ -249,7 +249,7 @@
             handle: Rectangle {
                 implicitWidth: JamiTheme.splitViewHandlePreferredWidth
                 implicitHeight: splitView.height
-                color:"transparent"
+                color:"white"
                 Rectangle {
                     implicitWidth: 1
                     implicitHeight: splitView.height
diff --git a/src/mainview/components/RecordBox.qml b/src/mainview/components/RecordBox.qml
index 274e28d..1091327 100644
--- a/src/mainview/components/RecordBox.qml
+++ b/src/mainview/components/RecordBox.qml
@@ -82,7 +82,7 @@
             var device = ClientWrapper.avmodel.getDefaultDevice()
             var settings = ClientWrapper.settingsAdaptor.get_Video_Settings_Size(device)
             var res = settings.split("x")
-            var aspectRatio = res[1]/res[0]
+            var aspectRatio = res[1] / res[0]
             if (aspectRatio) {
                 height = preferredWidth*aspectRatio
             } else {
diff --git a/src/settingsview/components/AdvancedSIPSettingsView.qml b/src/settingsview/components/AdvancedSIPSettingsView.qml
index 5ebcf84..b552ca3 100644
--- a/src/settingsview/components/AdvancedSIPSettingsView.qml
+++ b/src/settingsview/components/AdvancedSIPSettingsView.qml
@@ -332,94 +332,101 @@
         }
     }
 
-    spacing: 6
-    Layout.preferredWidth: 532
-    Layout.maximumWidth: 532
+    id: advancedSIPSettingsViewLayout
+    Layout.fillWidth: true
+    spacing: 24
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 24
-        Layout.preferredHeight: 24
-        Layout.maximumHeight: 24
-    }
+    property int preferredColumnWidth : sipAccountViewRect.width / 2 - 50
+    property int preferredSettingsWidth: sipAccountViewRect.width - 80
 
     // call setting section
     ColumnLayout {
-        spacing: 6
+
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            text: qsTr("Call Settings")
-
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
+            eText: qsTr("Call Settings")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
-            Layout.leftMargin: 20
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
             ToggleSwitch {
                 id: checkBoxAutoAnswerSIP
-                labelText: qsTr("Auto Answer Call")
-                fontPointSize: 10
 
-                Layout.leftMargin: 20
+                labelText: autoAnswerCallsText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setAutoAnswerCalls(checked)
                 }
             }
 
+            TextMetrics {
+                id: autoAnswerCallsText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Auto Answer Calls")
+            }
+
+            ToggleSwitch {
+                id: checkBoxCustomRingtoneSIP
+
+                labelText: enableCustomRingtoneSIPElidedText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setEnableRingtone(checked)
+                    btnRingtoneSIP.enabled = checked
+                }
+            }
+
+            TextMetrics {
+                id: enableCustomRingtoneSIPElidedText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Enable Custom Ringtone")
+            }
+
+
             RowLayout {
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
-                Layout.maximumHeight: 30
 
-                ToggleSwitch {
-                    id: checkBoxCustomRingtoneSIP
-                    labelText: qsTr("Enable Custom Ringtone")
-                    fontPointSize: 10
-
-                    Layout.maximumWidth: 164
-                    Layout.preferredWidth: 164
-                    Layout.minimumWidth: 164
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setEnableRingtone(checked)
-                        btnRingtoneSIP.enabled = checked
-                    }
-                }
-
-                Item {
-                    Layout.fillHeight: true
+                ElidedTextLabel {
                     Layout.fillWidth: true
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("Select Custom Ringtone")
+                    maxWidth: preferredColumnWidth
+                    fontSize: JamiTheme.settingsFontSize
                 }
 
                 HoverableRadiusButton {
                     id: btnRingtoneSIP
 
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
                     radius: height / 2
 
-                    Layout.maximumWidth: 164
-                    Layout.preferredWidth: 164
-                    Layout.minimumWidth: 164
-
-                    Layout.maximumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.minimumHeight: 30
-
                     icon.source: "qrc:/images/icons/round-folder-24px.svg"
                     icon.width: 16
                     icon.height: 16
@@ -432,63 +439,37 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
-
     // voice mail section
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            text: qsTr("Voicemail")
-
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 13
-            Layout.preferredHeight: 13
-            Layout.maximumHeight: 13
+            eText: qsTr("Voicemail")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         RowLayout {
             Layout.fillWidth: true
-            Layout.leftMargin: 20
-            Layout.maximumHeight: 30
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Label {
-                Layout.maximumWidth: 162
-                Layout.preferredWidth: 162
-                Layout.minimumWidth: 162
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.minimumHeight: 28
-                Layout.preferredHeight: 28
-                Layout.maximumHeight: 28
-
-                text: qsTr("Voicemail Dial Code")
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                eText: qsTr("Voicemail Dial Code")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             Item {
@@ -499,12 +480,12 @@
             InfoLineEdit {
                 id: lineEditVoiceMailDialCode
 
-                fieldLayoutWidth: 250
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
-                horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
                 onEditingFinished: {
@@ -514,62 +495,32 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
-
     // security section
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            text: qsTr("Security")
-
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
+            eText: qsTr("Security")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
-        Item {
+        ColumnLayout {
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Layout.maximumHeight: 13
-            Layout.preferredHeight: 13
-            Layout.minimumHeight: 13
-        }
-
-        GridLayout {
-            Layout.leftMargin: 20
-            Layout.fillWidth: true
-
-            rowSpacing: 6
-            columnSpacing: 6
-
-            rows: 14
-            columns: 3
-
-            // First row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: encryptMediaStreamsToggle
 
-                labelText: qsTr("Encrypt Media Streams(SRTP)")
-                fontPointSize: 10
-
-                Layout.row: 0
-                Layout.column: 0
+                labelText: encryptMediaStreamsText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseSRTP(checked)
@@ -578,78 +529,54 @@
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 0
-                Layout.column: 1
+            TextMetrics {
+                id: encryptMediaStreamsText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Encrypt Media Streams (SRTP)")
             }
 
-            // second row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: enableSDESToggle
 
-                labelText: qsTr("Enable SDES(Key Exchange)")
-                fontPointSize: 10
-
-                Layout.row: 1
-                Layout.column: 0
+                labelText: enableSDESText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseSDES(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 1
-                Layout.column: 1
+            TextMetrics {
+                id: enableSDESText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Enable SDES(Key Exchange)")
             }
 
-            // third row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: fallbackRTPToggle
 
-                labelText: qsTr("Can Fallback on RTP")
-                fontPointSize: 10
-
-                Layout.row: 2
-                Layout.column: 0
+                labelText: fallbackRTPText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseRTPFallback(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 2
-                Layout.column: 1
+            TextMetrics {
+                id: fallbackRTPText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Can Fallback on RTP")
             }
 
-            // fourth row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: encryptNegotitationToggle
 
-                labelText: qsTr("Encrypt Negotiation(TLS)")
-                fontPointSize: 10
-
-                Layout.row: 3
-                Layout.column: 0
+                labelText: encryptNegotitationText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseTLS(checked)
@@ -660,754 +587,453 @@
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 3
-                Layout.column: 1
+            TextMetrics {
+                id: encryptNegotitationText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Encrypt Negotiation (TLS)")
             }
 
-            // fifth row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
+            GridLayout {
+                Layout.fillWidth: true
 
-                Layout.row: 4
-                Layout.column: 0
+                rowSpacing: 8
+                columnSpacing: 8
 
-                Item{
-                    Layout.fillHeight: true
+                rows: 4
+                columns: 2
 
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("CA Certificate")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
-                Label{
-                    Layout.maximumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.minimumHeight: 30
+                HoverableRadiusButton {
+                    id: btnSIPCACert
 
-                    Layout.maximumWidth: 209
-                    Layout.preferredWidth: 209
-                    Layout.minimumWidth: 209
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    text: qsTr("CA Certificate")
+                    radius: height / 2
 
-                    font.pointSize: 10
+                    icon.source: "qrc:/images/icons/round-folder-24px.svg"
+                    icon.width: 16
+                    icon.height: 16
+
+                    onClicked: {
+                        caCert_Dialog_SIP.open()
+                    }
+                }
+
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("User Certificate")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
+                }
+
+                HoverableRadiusButton {
+                    id: btnSIPUserCert
+
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    radius: height / 2
+
+                    icon.source: "qrc:/images/icons/round-folder-24px.svg"
+                    icon.width: 16
+                    icon.height: 16
+
+                    onClicked: {
+                        userCert_Dialog_SIP.open()
+                    }
+                }
+
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("Private Key")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
+                }
+
+                HoverableRadiusButton {
+                    id: btnSIPPrivateKey
+
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    radius: height / 2
+
+                    icon.source: "qrc:/images/icons/round-folder-24px.svg"
+                    icon.width: 16
+                    icon.height: 16
+
+                    onClicked: {
+                        privateKey_Dialog_SIP.open()
+                    }
+                }
+
+                // Private key password
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("Private Key Password")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
+                }
+
+
+                InfoLineEdit {
+                    id: lineEditSIPCertPassword
+
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
+
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
                     verticalAlignment: Text.AlignVCenter
+                    echoMode: TextInput.Password
+
+                    onEditingFinished: {
+                        ClientWrapper.settingsAdaptor.lineEditSIPCertPasswordLineEditTextChanged(text)
+                    }
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 4
-                Layout.column: 1
-            }
-
-            HoverableRadiusButton{
-                id: btnSIPCACert
-
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
-
-                Layout.maximumWidth: 250
-                Layout.preferredWidth: 250
-                Layout.minimumWidth: 250
-
-                radius: height / 2
-
-                icon.source: "qrc:/images/icons/round-folder-24px.svg"
-                icon.width: 16
-                icon.height: 16
-
-                Layout.row: 4
-                Layout.column: 2
-
-                onClicked: {
-                    caCert_Dialog_SIP.open()
-                }
-            }
-
-            // sixth row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
-
-                Layout.row: 5
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.minimumHeight: 30
-
-                    Layout.maximumWidth: 209
-                    Layout.preferredWidth: 209
-                    Layout.minimumWidth: 209
-
-                    text: qsTr("User Certificate")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 5
-                Layout.column: 1
-            }
-
-            HoverableRadiusButton{
-                id: btnSIPUserCert
-
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
-
-                Layout.maximumWidth: 250
-                Layout.preferredWidth: 250
-                Layout.minimumWidth: 250
-
-                radius: height / 2
-
-                icon.source: "qrc:/images/icons/round-folder-24px.svg"
-                icon.width: 16
-                icon.height: 16
-
-                Layout.row: 5
-                Layout.column: 2
-
-                onClicked: {
-                    userCert_Dialog_SIP.open()
-                }
-            }
-
-            // seventh row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
-
-                Layout.row: 6
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.minimumHeight: 30
-
-                    Layout.maximumWidth: 209
-                    Layout.preferredWidth: 209
-                    Layout.minimumWidth: 209
-
-                    text: qsTr("Private Key")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 6
-                Layout.column: 1
-            }
-
-            HoverableRadiusButton{
-                id: btnSIPPrivateKey
-
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
-
-                Layout.maximumWidth: 250
-                Layout.preferredWidth: 250
-                Layout.minimumWidth: 250
-
-                radius: height / 2
-
-                icon.source: "qrc:/images/icons/round-folder-24px.svg"
-                icon.width: 16
-                icon.height: 16
-
-                Layout.row: 6
-                Layout.column: 2
-
-                onClicked: {
-                    privateKey_Dialog_SIP.open()
-                }
-            }
-
-            // eight row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
-
-                Layout.row: 7
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.minimumHeight: 30
-
-                    Layout.maximumWidth: 209
-                    Layout.preferredWidth: 209
-                    Layout.minimumWidth: 209
-
-                    text: qsTr("Private Key Password")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 7
-                Layout.column: 1
-            }
-
-            InfoLineEdit {
-                id: lineEditSIPCertPassword
-
-                Layout.alignment: Qt.AlignCenter
-
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-
-                echoMode: TextInput.Password
-
-                Layout.row: 7
-                Layout.column: 2
-
-                onEditingFinished: {
-                    ClientWrapper.settingsAdaptor.lineEditSIPCertPasswordLineEditTextChanged(text)
-                }
-            }
-
-            // nineth row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: verifyIncomingCertificatesServerToogle
 
-                labelText: qsTr("Verify Certificates(Server Side)")
-                fontPointSize: 10
-
-                Layout.row: 8
-                Layout.column: 0
+                labelText: verifyIncomingCertificatesServerText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setVerifyCertificatesServer(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 8
-                Layout.column: 1
+            TextMetrics {
+                id: verifyIncomingCertificatesServerText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Verify Certificates (Server Side)")
             }
 
-            // tenth row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: verifyIncomingCertificatesClientToogle
 
-                labelText: qsTr("Verify Certificates(Client Side)")
-                fontPointSize: 10
-
-                Layout.row: 9
-                Layout.column: 0
+                labelText: verifyIncomingCertificatesClientText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setVerifyCertificatesClient(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 9
-                Layout.column: 1
+            TextMetrics {
+                id: verifyIncomingCertificatesClientText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Verify Certificates (Client Side)")
             }
 
-            //eleventh row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: requireCeritificateForTLSIncomingToggle
 
-                labelText: qsTr("TLS Connections Require Certificate")
-                fontPointSize: 10
-
-                Layout.row: 10
-                Layout.column: 0
+                labelText: requireCeritificateForTLSIncomingText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setRequireCertificatesIncomingTLS(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row:10
-                Layout.column: 1
+            TextMetrics {
+                id: requireCeritificateForTLSIncomingText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("TLS Connections Require Certificate")
             }
 
-            // twelveth row
-            Label{
+
+            GridLayout {
                 Layout.fillWidth: true
 
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
+                rowSpacing: 8
+                columnSpacing: 8
 
-                text: qsTr("TLS Protocol Method")
-                font.pointSize: 10
-                font.kerning: true
+                rows: 3
+                columns: 2
 
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.row: 11
-                Layout.column: 0
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 11
-                Layout.column: 1
-            }
-
-            SettingParaCombobox{
-                id:tlsProtocolComboBox
-
-                Layout.maximumWidth: 252
-                Layout.preferredWidth: 252
-                Layout.minimumWidth: 252
-
-                Layout.maximumHeight: 29
-                Layout.minimumHeight: 29
-                Layout.preferredHeight: 29
-
-                Layout.alignment: Qt.AlignCenter
-
-                font.pointSize: 10
-                font.kerning: true
-
-                Layout.row: 11
-                Layout.column: 2
-
-                textRole: "textDisplay"
-
-                model: ListModel{
-                    ListElement{textDisplay: "Default"; firstArg: "Default"; secondArg: 0}
-                    ListElement{textDisplay: "TLSv1"; firstArg: "TLSv1"; secondArg: 1}
-                    ListElement{textDisplay: "TLSv1.1"; firstArg: "TLSv1.1"; secondArg: 2}
-                    ListElement{textDisplay: "TLSv1.2"; firstArg: "TLSv1.2"; secondArg: 3}
+                    eText: qsTr("TLS Protocol Method")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
-                onActivated: {
-                    var indexOfOption = tlsProtocolComboBox.model.get(index).secondArg
-                    ClientWrapper.settingsAdaptor.tlsProtocolComboBoxIndexChanged(parseInt(indexOfOption))
+                SettingParaCombobox {
+                    id: tlsProtocolComboBox
+
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                    font.pointSize: JamiTheme.settingsFontSize
+                    font.kerning: true
+
+                    textRole: "textDisplay"
+
+                    model: ListModel {
+                        ListElement{textDisplay: "Default"; firstArg: "Default"; secondArg: 0}
+                        ListElement{textDisplay: "TLSv1"; firstArg: "TLSv1"; secondArg: 1}
+                        ListElement{textDisplay: "TLSv1.1"; firstArg: "TLSv1.1"; secondArg: 2}
+                        ListElement{textDisplay: "TLSv1.2"; firstArg: "TLSv1.2"; secondArg: 3}
+                    }
+
+                    onActivated: {
+                        var indexOfOption = tlsProtocolComboBox.model.get(index).secondArg
+                        ClientWrapper.settingsAdaptor.tlsProtocolComboBoxIndexChanged(parseInt(indexOfOption))
+                    }
                 }
-            }
 
-            // 13th row
-            Label{
-                Layout.fillWidth: true
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
-
-                text: qsTr("Outgoing TLS Server Name")
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-
-                Layout.row: 12
-                Layout.column: 0
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 12
-                Layout.column: 1
-            }
-
-            InfoLineEdit {
-                id: outgoingTLSServerNameLineEdit
-
-                Layout.alignment: Qt.AlignCenter
-
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-
-                Layout.row: 12
-                Layout.column: 2
-
-                onEditingFinished: {
-                    ClientWrapper.settingsAdaptor.outgoingTLSServerNameLineEditTextChanged(text)
+                    eText: qsTr("Outgoing TLS Server Name")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
-            }
 
-            // 14th row
-            Label{
-                Layout.fillWidth: true
+                InfoLineEdit {
+                    id: outgoingTLSServerNameLineEdit
 
-                Layout.maximumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.minimumHeight: 30
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                text: qsTr("Negotiation Timeout(seconds)")
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-
-                Layout.row: 13
-                Layout.column: 0
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 13
-                Layout.column: 1
-            }
-
-            SpinBox{
-                id:negotiationTimeoutSpinBox
-
-                Layout.maximumWidth: 252
-                Layout.preferredWidth: 252
-                Layout.minimumWidth: 252
-
-                Layout.maximumHeight: 30
-                Layout.minimumHeight: 30
-                Layout.preferredHeight: 30
-
-                Layout.alignment: Qt.AlignCenter
-
-                font.pointSize: 10
-                font.kerning: true
-
-                from: 0
-                to: 3000
-                stepSize: 1
-
-                Layout.row: 13
-                Layout.column: 2
-
-                onValueModified: {
-                    ClientWrapper.settingsAdaptor.negotiationTimeoutSpinBoxValueChanged(value)
-                }
-            }
-        }
-    }
-
-    Item{
-            Layout.fillWidth: true
-
-            Layout.maximumHeight: 20
-            Layout.preferredHeight: 20
-            Layout.minimumHeight: 20
-        }
-
-    // connectivity section
-    ColumnLayout{
-            spacing: 6
-            Layout.fillWidth: true
-
-            Label {
-                Layout.fillWidth: true
-
-                Layout.minimumHeight: 27
-                Layout.preferredHeight: 27
-                Layout.maximumHeight: 27
-
-                text: qsTr("Connectivity")
-
-                font.pointSize: 13
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-            }
-
-            Item {
-                Layout.fillWidth: true
-
-                Layout.maximumHeight: 10
-                Layout.preferredHeight: 10
-                Layout.minimumHeight: 10
-            }
-
-            GridLayout{
-                Layout.leftMargin: 20
-                Layout.fillWidth: true
-
-                rowSpacing: 6
-                columnSpacing: 6
-
-                rows: 9
-                columns: 3
-
-                // 1st row
-                Label{
-                    Layout.minimumWidth: 286
-                    Layout.preferredWidth: 286
-
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
-
-                    text: qsTr("Registration Expire Timeout(seconds)")
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
                     verticalAlignment: Text.AlignVCenter
 
-                    Layout.row: 0
-                    Layout.column: 0
+                    onEditingFinished: {
+                        ClientWrapper.settingsAdaptor.outgoingTLSServerNameLineEditTextChanged(text)
+                    }
                 }
 
-                Item{
-                    Layout.fillHeight: true
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-
-                    Layout.row: 0
-                    Layout.column: 1
+                    eText: qsTr("Negotiation Timeout (seconds)")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
-                SpinBox{
-                    id: registrationExpireTimeoutSpinBox
+                SpinBox {
+                    id: negotiationTimeoutSpinBox
 
-                    Layout.maximumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.minimumWidth: 250
+                    Layout.maximumWidth: preferredColumnWidth
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.maximumHeight: 30
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-
-                    Layout.alignment: Qt.AlignCenter
-
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     from: 0
                     to: 3000
                     stepSize: 1
 
-                    Layout.row: 0
-                    Layout.column: 2
+                    up.indicator.width: (width < 200) ? (width / 5) : 40
+                    down.indicator.width: (width < 200) ? (width / 5) : 40
 
                     onValueModified: {
-                        ClientWrapper.settingsAdaptor.registrationTimeoutSpinBoxValueChanged(value)
+                        ClientWrapper.settingsAdaptor.negotiationTimeoutSpinBoxValueChanged(value)
                     }
                 }
+            }
+        }
+    }
 
-                // 2nd row
-                Label{
-                    Layout.minimumWidth: 286
-                    Layout.preferredWidth: 286
+    // connectivity section
+    ColumnLayout {
+        spacing: 8
+        Layout.fillWidth: true
 
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
+        ElidedTextLabel {
+            Layout.fillWidth: true
 
-                    text: qsTr("Newtwork interface")
-                    font.pointSize: 10
-                    font.kerning: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+            eText: qsTr("Connectivity")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredSettingsWidth
+        }
 
-                    Layout.row: 1
-                    Layout.column: 0
+        GridLayout {
+            Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
+
+            rowSpacing: 8
+            columnSpacing: 8
+
+            rows: 9
+            columns: 2
+
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                eText: qsTr("Registration Expire Timeout (seconds)")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
+
+
+            SpinBox {
+                id: registrationExpireTimeoutSpinBox
+
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                Layout.alignment: Qt.AlignCenter
+
+                font.pointSize: JamiTheme.buttonFontSize
+                font.kerning: true
+
+                from: 0
+                to: 3000
+                stepSize: 1
+
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
+
+                onValueModified: {
+                    ClientWrapper.settingsAdaptor.registrationTimeoutSpinBoxValueChanged(value)
                 }
+            }
 
-                Item{
-                    Layout.fillHeight: true
+            // 2nd row
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
+                eText: qsTr("Newtwork interface")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
 
-                    Layout.row: 1
-                    Layout.column: 1
+            SpinBox {
+                id: networkInterfaceSpinBox
+
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                Layout.alignment: Qt.AlignCenter
+
+                font.pointSize: JamiTheme.buttonFontSize
+                font.kerning: true
+
+                from: 0
+                to: 65536
+                stepSize: 1
+
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
+
+                onValueModified: {
+                    ClientWrapper.settingsAdaptor.networkInterfaceSpinBoxValueChanged(value)
                 }
-
-                SpinBox{
-                    id: networkInterfaceSpinBox
-
-                    Layout.maximumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.minimumWidth: 250
-
-                    Layout.maximumHeight: 30
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-
-                    Layout.alignment: Qt.AlignCenter
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65536
-                    stepSize: 1
-
-                    Layout.row: 1
-                    Layout.column: 2
-
-                    onValueModified: {
-                        ClientWrapper.settingsAdaptor.networkInterfaceSpinBoxValueChanged(value)
-                    }
-                }
+            }
 
             // 3rd row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: checkBoxUPnPSIP
 
                 labelText: qsTr("Use UPnP")
-                fontPointSize: 10
+                fontPointSize: JamiTheme.settingsFontSize
 
-                Layout.row: 2
-                Layout.column: 0
+                Layout.columnSpan: 2
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseUPnP(checked)
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 2
-                Layout.column: 1
-            }
-
             // 4th row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: checkBoxTurnEnableSIP
 
                 labelText: qsTr("Use TURN")
-                fontPointSize: 10
+                fontPointSize: JamiTheme.settingsFontSize
 
-                Layout.row: 3
-                Layout.column: 0
+                Layout.columnSpan: 2
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseTURN(checked)
@@ -1418,217 +1044,87 @@
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 3
-                Layout.column: 1
-            }
-
             // 5th row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.row: 4
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 260
-                    Layout.preferredWidth: 260
-                    Layout.minimumWidth: 260
-
-                    text: qsTr("TURN Address")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
+                text: qsTr("TURN Address")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 4
-                Layout.column: 1
-            }
-
-
             InfoLineEdit {
                 id: lineEditTurnAddressSIP
 
-                Layout.alignment: Qt.AlignCenter
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
-                Layout.row: 4
-                Layout.column: 2
-
                 onEditingFinished: {
                     ClientWrapper.settingsAdaptor.setTURNAddress(text)
                 }
             }
 
             // 6th row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.row: 5
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 260
-                    Layout.preferredWidth: 260
-                    Layout.minimumWidth: 260
-
-                    text: qsTr("TURN Username")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 5
-                Layout.column: 1
+                eText: qsTr("TURN Username")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             InfoLineEdit {
                 id: lineEditTurnUsernameSIP
 
-                Layout.alignment: Qt.AlignCenter
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
-                Layout.row: 5
-                Layout.column: 2
-
                 onEditingFinished: {
                     ClientWrapper.settingsAdaptor.setTURNUsername(text)
                 }
             }
 
-            // 7th row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.row: 6
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 260
-                    Layout.preferredWidth: 260
-                    Layout.minimumWidth: 260
-
-                    text: qsTr("TURN Password")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 6
-                Layout.column: 1
+                eText: qsTr("TURN Password")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             InfoLineEdit {
                 id: lineEditTurnPsswdSIP
 
-                Layout.alignment: Qt.AlignCenter
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
-                Layout.row: 6
-                Layout.column: 2
-
                 echoMode: TextInput.Password
 
                 onEditingFinished: {
@@ -1637,82 +1133,42 @@
             }
 
             // 8th row
-            RowLayout{
-                spacing: 6
-                Layout.maximumHeight: 30
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.row: 7
-                Layout.column: 0
-
-                Item{
-                    Layout.fillHeight: true
-
-                    Layout.maximumWidth: 20
-                    Layout.preferredWidth: 20
-                    Layout.minimumWidth: 20
-                }
-
-                Label{
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 260
-                    Layout.preferredWidth: 260
-                    Layout.minimumWidth: 260
-
-                    text: qsTr("TURN Realm")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            Item{
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 7
-                Layout.column: 1
+                eText: qsTr("TURN Realm")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             InfoLineEdit {
                 id: lineEditTurnRealmSIP
 
-                Layout.alignment: Qt.AlignCenter
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
-                Layout.row: 7
-                Layout.column: 2
-
                 onEditingFinished: {
                     ClientWrapper.settingsAdaptor.setTURNRealm(text)
                 }
             }
 
             // 9th row
-            ToggleSwitch{
+            ToggleSwitch {
                 id: checkBoxSTUNEnableSIP
 
                 labelText: qsTr("Use STUN")
-                fontPointSize: 10
+                fontPointSize: JamiTheme.settingsFontSize
 
-                Layout.row: 8
-                Layout.column: 0
+                Layout.columnSpan: 2
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setUseSTUN(checked)
@@ -1720,34 +1176,30 @@
                 }
             }
 
-            Item{
-                Layout.fillHeight: true
+            // 10th row
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.maximumWidth: 20
-                Layout.preferredWidth: 20
-                Layout.minimumWidth: 20
-
-                Layout.row: 8
-                Layout.column: 1
+                eText: qsTr("STUN Address")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             InfoLineEdit {
                 id: lineEditSTUNAddressSIP
 
-                Layout.alignment: Qt.AlignCenter
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                fieldLayoutWidth: 250
-                fieldLayoutHeight: 29
-
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
-                Layout.row: 8
-                Layout.column: 2
-
                 onEditingFinished: {
                     ClientWrapper.settingsAdaptor.setSTUNAddress(text)
                 }
@@ -1755,800 +1207,582 @@
         }
     }
 
-        Item{
-            Layout.fillWidth: true
 
-            Layout.maximumHeight: 20
-            Layout.preferredHeight: 20
-            Layout.minimumHeight: 20
+    // public address section
+    ColumnLayout {
+        spacing: 8
+        Layout.fillWidth: true
+
+        ElidedTextLabel {
+            Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+            text: qsTr("Public Address")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredSettingsWidth
         }
 
-        // public address section
-        ColumnLayout{
-            spacing: 6
+        GridLayout {
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Label {
+            rowSpacing: 8
+            columnSpacing: 8
+
+            rows: 3
+            columns: 2
+
+            // 1st row
+            ToggleSwitch {
+                id: checkBoxCustomAddressPort
+
+                labelText: checkBoxCustomAddressPortText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
+
+                Layout.columnSpan: 2
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setUseCustomAddressAndPort(checked)
+                    lineEditSIPCustomAddress.enabled = checked
+                    customPortSIPSpinBox.enabled = checked
+                }
+            }
+
+            TextMetrics {
+                id: checkBoxCustomAddressPortText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Use Custom Address/Port")
+            }
+
+            //2nd row
+            ElidedTextLabel {
+                Layout.leftMargin: JamiTheme.preferredMarginSize
+
                 Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.minimumHeight: 27
-                Layout.preferredHeight: 27
-                Layout.maximumHeight: 27
+                eText: qsTr("Address")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
 
-                text: qsTr("Public Address")
+            InfoLineEdit {
+                id: lineEditSIPCustomAddress
 
-                font.pointSize: 13
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
+
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
+
+                onEditingFinished: {
+                    ClientWrapper.settingsAdaptor.lineEditSIPCustomAddressLineEditTextChanged(text)
+                }
             }
 
-            Item {
-                Layout.fillWidth: true
+            //3rd row
+            ElidedTextLabel {
+                Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                Layout.maximumHeight: 10
-                Layout.preferredHeight: 10
-                Layout.minimumHeight: 10
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                eText: qsTr("Port")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
-            GridLayout{
-                Layout.leftMargin: 20
-                Layout.fillWidth: true
+            SpinBox {
+                id: customPortSIPSpinBox
 
-                rowSpacing: 6
-                columnSpacing: 6
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
 
-                rows: 3
-                columns: 3
+                Layout.alignment: Qt.AlignCenter
 
-                // 1st row
-                ToggleSwitch{
-                    id: checkBoxCustomAddressPort
+                font.pointSize: JamiTheme.settingsFontSize
+                font.kerning: true
 
-                    Layout.maximumWidth: 88
-                    labelText: qsTr("Use Custom Address/Port")
-                    fontPointSize: 10
+                from: 0
+                to: 65535
+                stepSize: 1
 
-                    Layout.row: 0
-                    Layout.column: 0
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
 
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setUseCustomAddressAndPort(checked)
-                        lineEditSIPCustomAddress.enabled = checked
-                        customPortSIPSpinBox.enabled = checked
-                    }
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 0
-                    Layout.column: 1
-                }
-
-                //2nd row
-                Label{
-                    Layout.leftMargin: 26
-
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 60
-                    Layout.preferredWidth: 60
-                    Layout.minimumWidth: 60
-
-                    text: qsTr("Address")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 1
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 1
-                    Layout.column: 1
-                }
-
-                InfoLineEdit {
-                    id: lineEditSIPCustomAddress
-
-                    Layout.alignment: Qt.AlignCenter
-
-                    fieldLayoutWidth: 250
-                    fieldLayoutHeight: 29
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 1
-                    Layout.column: 2
-
-                    onEditingFinished: {
-                        ClientWrapper.settingsAdaptor.lineEditSIPCustomAddressLineEditTextChanged(text)
-                    }
-                }
-
-                //3rd row
-                Label{
-                    Layout.leftMargin: 26
-
-                    Layout.maximumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.minimumHeight: 27
-
-                    Layout.maximumWidth: 60
-                    Layout.preferredWidth: 60
-                    Layout.minimumWidth: 60
-
-                    text: qsTr("Port")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 2
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 2
-                    Layout.column: 1
-                }
-
-                SpinBox{
-                    id: customPortSIPSpinBox
-
-                    Layout.maximumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.minimumWidth: 250
-
-                    Layout.maximumHeight: 30
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-
-                    Layout.alignment: Qt.AlignCenter
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65535
-                    stepSize: 1
-
-                    Layout.row: 2
-                    Layout.column: 2
-
-                    onValueModified: {
-                        ClientWrapper.settingsAdaptor.customPortSIPSpinBoxValueChanged(value)
-                    }
+                onValueModified: {
+                    ClientWrapper.settingsAdaptor.customPortSIPSpinBoxValueChanged(value)
                 }
             }
         }
+    }
 
-        // media section
-        ColumnLayout{
-            spacing: 6
+    // media section
+    ColumnLayout {
+        spacing: 8
+        Layout.fillWidth: true
+
+        Label {
             Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            Label {
-                Layout.fillWidth: true
+            text: qsTr("Media")
 
-                Layout.minimumHeight: 27
-                Layout.preferredHeight: 27
-                Layout.maximumHeight: 27
+            font.pointSize: JamiTheme.headerFontSize
+            font.kerning: true
 
-                text: qsTr("Media")
+            horizontalAlignment: Text.AlignLeft
+            verticalAlignment: Text.AlignVCenter
+        }
 
-                font.pointSize: 13
-                font.kerning: true
+        ColumnLayout {
+            spacing: 8
+            Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-            }
+            ToggleSwitch {
+                id: videoCheckBoxSIP
 
-            Item {
-                Layout.fillWidth: true
+                labelText: videoCheckBoxSIPText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
-                Layout.maximumHeight: 10
-                Layout.preferredHeight: 10
-                Layout.minimumHeight: 10
-            }
-
-            ColumnLayout {
-                spacing: 6
-                Layout.fillWidth: true
-
-                ToggleSwitch {
-                    id: videoCheckBoxSIP
-
-                    Layout.leftMargin: 20
-
-                    labelText: qsTr("Enable Video")
-                    fontPointSize: 10
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setVideoState(checked)
-                    }
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setVideoState(checked)
                 }
+            }
 
-                RowLayout {
-                    spacing: 6
+            TextMetrics {
+                id: videoCheckBoxSIPText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Enable Video")
+            }
+
+
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+
+                ColumnLayout {
                     Layout.fillWidth: true
-                    Layout.leftMargin: 20
+                    Layout.fillHeight: true
 
-                    ColumnLayout {
-                        spacing: 6
-                        Layout.maximumWidth: 348
+                    RowLayout {
+                        Layout.fillWidth: true
+                        Layout.fillHeight: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        RowLayout {
-                            spacing: 6
+                        ElidedTextLabel {
                             Layout.fillWidth: true
 
-                            Layout.maximumHeight: 30
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.fillWidth: true
+                            maxWidth: preferredColumnWidth - 50
+                            eText:  qsTr("Video Codecs")
+                            fontSize: JamiTheme.settingsFontSize
+                        }
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
 
-                                text: qsTr("Video Codecs")
-                                font.pointSize: 10
-                                font.kerning: true
+                        HoverableRadiusButton {
+                            id: videoDownPushButtonSIP
 
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
 
-                            Item {
-                                Layout.fillHeight: true
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
-                                Layout.minimumWidth: 20
-                                Layout.preferredWidth: 20
-                                Layout.maximumWidth: 20
-                            }
+                            buttonImageHeight: height
+                            buttonImageWidth: height
+                            radius: height / 2
 
-                            HoverableRadiusButton {
-                                id: videoDownPushButtonSIP
+                            icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
+                            icon.width: 24
+                            icon.height: 24
 
-                                Layout.minimumWidth: 30
-                                Layout.preferredWidth: 30
-                                Layout.maximumWidth: 30
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                radius: height / 2
-                                scale: 1
-
-                                buttonImageHeight: height
-                                buttonImageWidth: height
-
-                                font.pointSize: 9
-                                font.kerning: true
-
-                                icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                                icon.width: 32
-                                icon.height: 32
-
-                                onClicked: {
-                                    decreaseVideoCodecPriority()
-                                }
-                            }
-
-                            HoverableRadiusButton {
-                                id: videoUpPushButtonSIP
-
-                                Layout.minimumWidth: 30
-                                Layout.preferredWidth: 30
-                                Layout.maximumWidth: 30
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                radius: height / 2
-
-                                buttonImageHeight: height
-                                buttonImageWidth: height
-
-                                font.pointSize: 9
-                                font.kerning: true
-
-                                icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                                icon.width: 32
-                                icon.height: 32
-
-                                onClicked: {
-                                    increaseVideoCodecPriority()
-                                }
+                            onClicked: {
+                                decreaseVideoCodecPriority()
                             }
                         }
 
-                        ListViewJami {
-                            id: videoListWidgetSIP
+                        HoverableRadiusButton {
+                            id: videoUpPushButtonSIP
 
-                            Layout.minimumWidth: 348
-                            Layout.preferredWidth: 348
-                            Layout.maximumWidth: 348
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
 
-                            Layout.minimumHeight: 192
-                            Layout.preferredHeight: 192
-                            Layout.maximumHeight: 192
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
-                            model: videoCodecListModelSIP
+                            buttonImageHeight: height
+                            buttonImageWidth: height
+                            radius: height / 2
 
-                            delegate: VideoCodecDelegate {
-                                id: videoCodecDelegate
+                            icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
+                            icon.width: 24
+                            icon.height: 24
 
-                                width: videoListWidgetSIP.width
-                                height: videoListWidgetSIP.height / 4
-
-                                videoCodecName : VideoCodecName
-                                isEnabled : IsEnabled
-                                videoCodecId: VideoCodecID
-
-                                onClicked: {
-                                    videoListWidgetSIP.currentIndex = index
-                                }
-
-                                onVideoCodecStateChange:{
-                                    ClientWrapper.settingsAdaptor.videoCodecsStateChange(idToSet , isToBeEnabled)
-                                    updateVideoCodecs()
-                                }
+                            onClicked: {
+                                increaseVideoCodecPriority()
                             }
                         }
                     }
 
-                    ColumnLayout {
-                        spacing: 6
-                        Layout.maximumWidth: 348
+                    ListViewJami {
+                        id: videoListWidgetSIP
 
-                        RowLayout {
-                            spacing: 6
+                        Layout.minimumWidth: preferredColumnWidth
+                        Layout.preferredWidth: preferredColumnWidth
+                        Layout.maximumWidth: preferredColumnWidth
+
+                        Layout.minimumHeight: 192
+                        Layout.preferredHeight: 192
+                        Layout.maximumHeight: 192
+
+                        model: videoCodecListModelSIP
+
+                        delegate: VideoCodecDelegate {
+                            id: videoCodecDelegate
+
+                            width: videoListWidgetSIP.width
+                            height: videoListWidgetSIP.height / 4
+
+                            videoCodecName : VideoCodecName
+                            isEnabled : IsEnabled
+                            videoCodecId: VideoCodecID
+
+                            onClicked: {
+                                videoListWidget.currentIndex = index
+                            }
+
+                            onVideoCodecStateChange:{
+                                ClientWrapper.settingsAdaptor.videoCodecsStateChange(idToSet , isToBeEnabled)
+                                updateVideoCodecs()
+                            }
+                        }
+                    }
+                }
+
+                ColumnLayout {
+                    Layout.fillWidth: true
+
+                    RowLayout {
+                        Layout.fillWidth: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        ElidedTextLabel {
                             Layout.fillWidth: true
 
-                            Layout.maximumHeight: 30
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.fillWidth: true
+                            maxWidth: preferredColumnWidth - 50
+                            eText:  qsTr("Audio Codecs")
+                            fontSize: JamiTheme.settingsFontSize
+                        }
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
 
-                                text: qsTr("Audio Codecs")
-                                font.pointSize: 10
-                                font.kerning: true
+                        HoverableRadiusButton {
+                            id: audioDownPushButtonSIP
 
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
 
-                            Item {
-                                Layout.fillHeight: true
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
-                                Layout.minimumWidth: 20
-                                Layout.preferredWidth: 20
-                                Layout.maximumWidth: 20
-                            }
+                            radius: height / 2
+                            buttonImageHeight: height
+                            buttonImageWidth: height
 
-                            HoverableRadiusButton {
-                                id: audioDownPushButtonSIP
+                            icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
+                            icon.width: 24
+                            icon.height: 24
 
-                                Layout.minimumWidth: 30
-                                Layout.preferredWidth: 30
-                                Layout.maximumWidth: 30
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                radius: height / 2
-
-                                buttonImageHeight: height
-                                buttonImageWidth: height
-
-                                font.pointSize: 9
-                                font.kerning: true
-
-                                icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                                icon.width: 32
-                                icon.height: 32
-
-                                onClicked: {
-                                    decreaseAudioCodecPriority()
-                                }
-                            }
-
-                            HoverableRadiusButton {
-                                id: audioUpPushButtonSIP
-
-                                Layout.minimumWidth: 30
-                                Layout.preferredWidth: 30
-                                Layout.maximumWidth: 30
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                radius: height / 2
-
-                                buttonImageHeight: height
-                                buttonImageWidth: height
-
-                                font.pointSize: 9
-                                font.kerning: true
-
-                                icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                                icon.width: 32
-                                icon.height: 32
-
-                                onClicked: {
-                                    increaseAudioCodecPriority()
-                                }
+                            onClicked: {
+                                decreaseAudioCodecPriority()
                             }
                         }
 
-                        ListViewJami {
-                            id: audioListWidgetSIP
+                        HoverableRadiusButton {
+                            id: audioUpPushButtonSIP
 
-                            Layout.minimumWidth: 348
-                            Layout.preferredWidth: 348
-                            Layout.maximumWidth: 348
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
 
-                            Layout.minimumHeight: 192
-                            Layout.preferredHeight: 192
-                            Layout.maximumHeight: 192
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
-                            model: audioCodecListModelSIP
+                            radius: height / 2
+                            buttonImageHeight: height
+                            buttonImageWidth: height
 
-                            delegate: AudioCodecDelegate {
-                                id: audioCodecDelegate
+                            icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
+                            icon.width: 24
+                            icon.height: 24
 
-                                width: audioListWidgetSIP.width
-                                height: audioListWidgetSIP.height / 4
+                            onClicked: {
+                                increaseAudioCodecPriority()
+                            }
+                        }
+                    }
 
-                                layer.mipmap: false
-                                clip: true
+                    ListViewJami {
+                        id: audioListWidgetSIP
 
-                                audioCodecName : AudioCodecName
-                                isEnabled : IsEnabled
-                                audioCodecId: AudioCodecID
-                                samplerRate: Samplerate
+                        Layout.minimumWidth: preferredColumnWidth
+                        Layout.preferredWidth: preferredColumnWidth
+                        Layout.maximumWidth: preferredColumnWidth
 
-                                onClicked: {
-                                    audioListWidgetSIP.currentIndex = index
-                                }
+                        Layout.minimumHeight: 192
+                        Layout.preferredHeight: 192
+                        Layout.maximumHeight: 192
 
-                                onAudioCodecStateChange:{
-                                    ClientWrapper.settingsAdaptor.audioCodecsStateChange(idToSet , isToBeEnabled)
-                                    updateAudioCodecs()
-                                }
+                        model: audioCodecListModelSIP
+
+                        delegate: AudioCodecDelegate {
+                            id: audioCodecDelegate
+
+                            width: audioListWidgetSIP.width
+                            height: audioListWidgetSIP.height / 4
+
+                            layer.mipmap: false
+                            clip: true
+
+                            audioCodecName : AudioCodecName
+                            isEnabled : IsEnabled
+                            audioCodecId: AudioCodecID
+                            samplerRate: Samplerate
+
+                            onClicked: {
+                                audioListWidget.currentIndex = index
+                            }
+
+                            onAudioCodecStateChange:{
+                                ClientWrapper.settingsAdaptor.audioCodecsStateChange(idToSet , isToBeEnabled)
+                                updateAudioCodecs()
                             }
                         }
                     }
                 }
             }
+        }
+    }
 
+    // SDP Session
+    ColumnLayout {
+        spacing: 8
+        Layout.fillWidth: true
+
+        ElidedTextLabel {
+            Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+            eText: qsTr("SDP Session Negotiation (ICE Fallback)")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredSettingsWidth
         }
 
-        Item {
+        ElidedTextLabel {
             Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Layout.maximumHeight: 20
-            Layout.preferredHeight: 20
-            Layout.minimumHeight: 20
+            eText: qsTr("Only used during negotiation in case ICE is not supported")
+            fontSize: JamiTheme.settingsFontSize
+            maxWidth: preferredSettingsWidth
         }
 
-        ColumnLayout{
-            spacing: 6
+        GridLayout {
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Label {
+            rowSpacing: 8
+            columnSpacing: 8
+
+            rows: 4
+            columns: 2
+
+            // 1st row
+            ElidedTextLabel {
                 Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.minimumHeight: 27
-                Layout.preferredHeight: 27
-                Layout.maximumHeight: 27
+                eText: qsTr("Audio RTP Min Port")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
 
-                text: qsTr("SDP Session Negotiation(ICE Fallback)")
+            SpinBox {
+                id:audioRTPMinPortSpinBox
 
-                font.pointSize: 13
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                from: 0
+                to: 65535
+                stepSize: 1
+
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
+
+                onValueModified: {
+                    audioRTPMinPortSpinBoxEditFinished(value)
+                }
             }
 
-            Label {
+            // 2nd row
+            ElidedTextLabel {
                 Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.minimumHeight: 21
-                Layout.preferredHeight: 21
-                Layout.maximumHeight: 21
+                eText: qsTr("Audio RTP Max Port")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
 
-                text: qsTr("Only used during negotiation in case ICE is not supported")
+            SpinBox {
+                id:audioRTPMaxPortSpinBox
 
-                font.pointSize: 10
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                from: 0
+                to: 65535
+                stepSize: 1
+
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
+
+                onValueModified: {
+                    audioRTPMaxPortSpinBoxEditFinished(value)
+                }
             }
 
-            Item {
+            // 3rd row
+            ElidedTextLabel {
                 Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.maximumHeight: 10
-                Layout.preferredHeight: 10
-                Layout.minimumHeight: 10
+                eText: qsTr("Video RTP Min Port")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
-            GridLayout{
-                Layout.leftMargin: 20
+            SpinBox {
+                id:videoRTPMinPortSpinBox
+
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                font.pointSize: JamiTheme.settingsFontSize
+                font.kerning: true
+
+                from: 0
+                to: 65535
+                stepSize: 1
+
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
+
+                onValueModified: {
+                    videoRTPMinPortSpinBoxEditFinished(value)
+                }
+            }
+
+            // 4th row
+            ElidedTextLabel {
                 Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                rowSpacing: 6
-                columnSpacing: 6
+                eText: qsTr("Video RTP Max Port")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
+            }
 
-                rows: 4
-                columns: 3
+            SpinBox {
+                id:videoRTPMaxPortSpinBox
 
-                // 1st row
-                Label{
-                    Layout.minimumWidth: 162
-                    Layout.preferredWidth: 162
-                    Layout.maximumWidth: 162
+                Layout.maximumWidth: preferredColumnWidth
+                Layout.minimumWidth: preferredColumnWidth
+                Layout.preferredWidth: preferredColumnWidth
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
+                font.pointSize: JamiTheme.settingsFontSize
+                font.kerning: true
 
-                    text: qsTr("Audio RTP Min Port")
-                    font.pointSize: 10
-                    font.kerning: true
+                from: 0
+                to: 65535
+                stepSize: 1
 
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                up.indicator.width: (width < 200) ? (width / 5) : 40
+                down.indicator.width: (width < 200) ? (width / 5) : 40
 
-                    Layout.row: 0
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 0
-                    Layout.column: 1
-                }
-
-                SpinBox{
-                    id:audioRTPMinPortSpinBox
-
-                    Layout.minimumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.maximumWidth: 250
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65535
-                    stepSize: 1
-
-                    Layout.row: 0
-                    Layout.column: 2
-
-                    onValueModified: {
-                        audioRTPMinPortSpinBoxEditFinished(value)
-                    }
-                }
-
-                // 2nd row
-                Label{
-                    Layout.minimumWidth: 162
-                    Layout.preferredWidth: 162
-                    Layout.maximumWidth: 162
-
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
-
-                    text: qsTr("Audio RTP Max Port")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 1
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 1
-                    Layout.column: 1
-                }
-
-                SpinBox{
-                    id:audioRTPMaxPortSpinBox
-
-                    Layout.minimumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.maximumWidth: 250
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65535
-                    stepSize: 1
-
-                    Layout.row: 1
-                    Layout.column: 2
-
-                    onValueModified: {
-                        audioRTPMaxPortSpinBoxEditFinished(value)
-                    }
-                }
-
-                // 3rd row
-                Label{
-                    Layout.minimumWidth: 162
-                    Layout.preferredWidth: 162
-                    Layout.maximumWidth: 162
-
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
-
-                    text: qsTr("Video RTP Min Port")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 2
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 2
-                    Layout.column: 1
-                }
-
-                SpinBox{
-                    id:videoRTPMinPortSpinBox
-
-                    Layout.minimumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.maximumWidth: 250
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65535
-                    stepSize: 1
-
-                    Layout.row: 2
-                    Layout.column: 2
-
-                    onValueModified: {
-                        videoRTPMinPortSpinBoxEditFinished(value)
-                    }
-                }
-
-                // 4th row
-                Label{
-                    Layout.minimumWidth: 162
-                    Layout.preferredWidth: 162
-                    Layout.maximumWidth: 162
-
-                    Layout.minimumHeight: 28
-                    Layout.preferredHeight: 28
-                    Layout.maximumHeight: 28
-
-                    text: qsTr("Video RTP Max Port")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-
-                    Layout.row: 3
-                    Layout.column: 0
-                }
-
-                Item{
-                    Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.row: 3
-                    Layout.column: 1
-                }
-
-                SpinBox{
-                    id:videoRTPMaxPortSpinBox
-
-                    Layout.minimumWidth: 250
-                    Layout.preferredWidth: 250
-                    Layout.maximumWidth: 250
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    from: 0
-                    to: 65535
-                    stepSize: 1
-
-                    Layout.row: 3
-                    Layout.column: 2
-
-                    onValueModified: {
-                        videoRTPMaxPortSpinBoxEditFinished(value)
-                    }
+                onValueModified: {
+                    videoRTPMaxPortSpinBoxEditFinished(value)
                 }
             }
         }
-
-        // spacers
-        Item {
-            Layout.fillWidth: true
-
-            Layout.maximumHeight: 48
-            Layout.preferredHeight: 48
-            Layout.minimumHeight: 48
-        }
-
-        Item {
-            Layout.fillHeight: true
-            Layout.fillWidth: true
-        }
+    }
 }
 
 
diff --git a/src/settingsview/components/AdvancedSettingsView.qml b/src/settingsview/components/AdvancedSettingsView.qml
index 003869b..0510145 100644
--- a/src/settingsview/components/AdvancedSettingsView.qml
+++ b/src/settingsview/components/AdvancedSettingsView.qml
@@ -262,105 +262,112 @@
         }
     }
 
-    spacing: 6
+    id: advancedSettingsViewLayout
+    Layout.fillWidth: true
 
-    Layout.preferredWidth: 532
-    Layout.maximumWidth: 532
-
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 24
-        Layout.preferredHeight: 24
-        Layout.maximumHeight: 24
-    }
+    property int preferredColumnWidth : accountViewRect.width / 2 - 50
 
     ColumnLayout {
-        spacing: 6
+
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            text: qsTr("Call Settings")
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
+            eText: qsTr("Call Settings")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
             ToggleSwitch {
                 id: checkBoxUntrusted
 
-                Layout.leftMargin: 20
-
-                labelText: qsTr("Allow incoming calls from unknown contacts")
-                fontPointSize: 10
+                labelText: allowIncomingCallsText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setCallsUntrusted(checked)
                 }
             }
 
+            TextMetrics {
+                id: allowIncomingCallsText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Allow incoming calls from unknown contacts")
+            }
+
             ToggleSwitch {
                 id: checkBoxAutoAnswer
 
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
 
-                labelText: qsTr("Auto Answer Calls")
-                fontPointSize: 10
+                labelText: autoAnswerCallsElidedText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setAutoAnswerCalls(checked)
                 }
             }
 
+            TextMetrics {
+                id: autoAnswerCallsElidedText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Auto Answer Calls")
+            }
+
+            ToggleSwitch {
+                id: checkBoxCustomRingtone
+
+                labelText: enableCustomRingtoneElidedText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setEnableRingtone(checked)
+                    btnRingtone.enabled = checked
+                }
+            }
+
+            TextMetrics {
+                id: enableCustomRingtoneElidedText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Enable Custom Ringtone")
+            }
+
             RowLayout {
-                spacing: 6
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
-                Layout.maximumHeight: 30
 
-                ToggleSwitch {
-                    id: checkBoxCustomRingtone
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    labelText: qsTr("Enable Custom Ringtone")
-                    fontPointSize: 10
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setEnableRingtone(checked)
-                        btnRingtone.enabled = checked
-                    }
+                    eText: qsTr("Select Custom Ringtone")
+                    maxWidth: preferredColumnWidth
+                    fontSize: JamiTheme.settingsFontSize
                 }
 
                 HoverableRadiusButton {
                     id: btnRingtone
 
-                    Layout.minimumWidth: 300
-                    Layout.preferredWidth: 300
-                    Layout.maximumWidth: 300
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                     radius: height / 2
 
@@ -376,60 +383,35 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
-
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
-
-            text: qsTr("Name Server")
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
+            eText: qsTr("Name Server")
+            maxWidth: preferredColumnWidth
+            fontSize: JamiTheme.headerFontSize
         }
 
         RowLayout {
             Layout.fillWidth: true
-            Layout.leftMargin: 20
-            Layout.maximumHeight: 29
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            Label {
-                Layout.minimumWidth: 60
+            ElidedTextLabel {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                Layout.minimumHeight: 29
-                Layout.preferredHeight: 29
-                Layout.maximumHeight: 29
-
-                text: qsTr("Address")
-
-                font.pointSize: 10
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                eText: qsTr("Address")
+                fontSize: JamiTheme.settingsFontSize
+                maxWidth: preferredColumnWidth
             }
 
             Item {
@@ -440,13 +422,12 @@
             InfoLineEdit {
                 id: lineEditNameServer
 
-                fieldLayoutWidth: 300
-                fieldLayoutHeight: 29
+                fieldLayoutWidth: preferredColumnWidth
+                fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                font.pointSize: 10
+                font.pointSize: JamiTheme.settingsFontSize
                 font.kerning: true
 
-                horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
                 onEditingFinished: {
@@ -456,74 +437,59 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
 
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
-
-            text: qsTr("OpenDHT Configuration")
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
+            eText: qsTr("OpenDHT Configuration")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
+
+            ToggleSwitch {
+                id: checkBoxEnableProxy
+
+                labelText: qsTr("Enable proxy")
+                fontPointSize: JamiTheme.settingsFontSize
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setEnableProxy(checked)
+                    lineEditProxy.enabled = checked
+                }
+            }
 
             RowLayout {
-                spacing: 6
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
 
-                ToggleSwitch {
-                    id: checkBoxEnableProxy
-
-                    labelText: qsTr("Enable proxy")
-                    fontPointSize: 10
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setEnableProxy(checked)
-                        lineEditProxy.enabled = checked
-                    }
-                }
-
-                Item {
-                    Layout.fillHeight: true
+                ElidedTextLabel {
                     Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    text: qsTr("Proxy Address")
+                    font.pointSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 InfoLineEdit {
                     id: lineEditProxy
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -536,23 +502,17 @@
             }
 
             RowLayout {
-                spacing: 6
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
 
-                Label {
-                    id: labelBootstrap
-
-                    Layout.minimumWidth: 72
-                    Layout.preferredWidth: 72
-
-                    Layout.minimumHeight: 29
-                    Layout.preferredHeight: 29
-                    Layout.maximumHeight: 29
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                     text: qsTr("Bootstrap")
-                    font.pointSize: 10
-                    font.kerning: true
+                    font.pointSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 Item {
@@ -563,10 +523,10 @@
                 InfoLineEdit {
                     id: lineEditBootstrap
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -581,74 +541,57 @@
     }
 
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
-
-            text: qsTr("Security")
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
+            eText: qsTr("Security")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
             GridLayout {
                 rows: 4
                 columns: 2
-                rowSpacing: 0
-                columnSpacing: 6
+                rowSpacing: 8
+                columnSpacing: 8
 
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
 
                 // CA Certificate
-                Label {
+                ElidedTextLabel {
                     Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 32
-                    Layout.preferredHeight: 32
-                    Layout.maximumHeight: 32
-
-                    text: qsTr("CA Certificate")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("CA Certificate")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 HoverableRadiusButton {
                     id: btnCACert
 
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
                     radius: height / 2
 
-                    Layout.minimumWidth: 298
-                    Layout.preferredWidth: 298
-                    Layout.maximumWidth: 298
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
                     icon.source: "qrc:/images/icons/round-folder-24px.svg"
                     icon.width: 16
                     icon.height: 16
@@ -659,34 +602,30 @@
                 }
 
                 // User Certificate
-                Label {
+                ElidedTextLabel {
                     Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 32
-                    Layout.preferredHeight: 32
-                    Layout.maximumHeight: 32
-
-                    text: qsTr("User Certificate")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("User Certificate")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 HoverableRadiusButton {
                     id: btnUserCert
 
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
+
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
                     radius: height / 2
 
-                    Layout.minimumWidth: 298
-                    Layout.preferredWidth: 298
-                    Layout.maximumWidth: 298
-
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
-
                     icon.source: "qrc:/images/icons/round-folder-24px.svg"
                     icon.width: 16
                     icon.height: 16
@@ -697,33 +636,31 @@
                 }
 
                 // Private Key
-                Label {
+                ElidedTextLabel {
                     Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 32
-                    Layout.preferredHeight: 32
-                    Layout.maximumHeight: 32
-
-                    text: qsTr("Private Key")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("Private Key")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
+
+
                 HoverableRadiusButton {
                     id: btnPrivateKey
 
                     radius: height / 2
 
-                    Layout.minimumWidth: 298
-                    Layout.preferredWidth: 298
-                    Layout.maximumWidth: 298
+                    Layout.minimumWidth: preferredColumnWidth
+                    Layout.preferredWidth: preferredColumnWidth
+                    Layout.maximumWidth: preferredColumnWidth
 
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                     icon.source: "qrc:/images/icons/round-folder-24px.svg"
                     icon.width: 16
@@ -735,28 +672,25 @@
                 }
 
                 // Private key password
-                Label {
+                ElidedTextLabel {
                     Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 29
-                    Layout.preferredHeight: 29
-                    Layout.maximumHeight: 29
-
-                    text: qsTr("Private Key Password")
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("Private Key Password")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
+
                 InfoLineEdit {
                     id: lineEditCertPassword
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -767,152 +701,94 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
-
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
-        Label {
+        ElidedTextLabel {
             Layout.fillWidth: true
-            Layout.topMargin: 10
+            Layout.topMargin: JamiTheme.preferredMarginSize
 
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-            text: qsTr("Connectivity")
-            font.pointSize: 13
-            font.kerning: true
-
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
-        }
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
+            eText: qsTr("Connectivity")
+            fontSize: JamiTheme.headerFontSize
+            maxWidth: preferredColumnWidth
         }
 
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
-            GridLayout {
-                Layout.leftMargin: 20
+            ToggleSwitch {
+                id: checkAutoConnectOnLocalNetwork
+
                 Layout.fillWidth: true
 
-                rows: 6
-                columns: 3
-                rowSpacing: 6
-                columnSpacing: 6
+                labelText: autoConnectOnLocalNetworkElidedText.elidedText
+                fontPointSize: JamiTheme.settingsFontSize
 
-                // row 2
-                ToggleSwitch {
-                    id: checkAutoConnectOnLocalNetwork
-
-                    Layout.row: 0
-                    Layout.column: 0
-
-                    labelText: qsTr("Auto Connect On Local Network")
-                    fontPointSize: 10
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setAutoConnectOnLocalNetwork(checked)
-                    }
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setAutoConnectOnLocalNetwork(checked)
                 }
+            }
 
-                Item {
-                    Layout.row: 0
-                    Layout.column: 1
+            TextMetrics {
+                id: autoConnectOnLocalNetworkElidedText
+                elide: Text.ElideRight
+                elideWidth: preferredColumnWidth
+                text: qsTr("Auto Connect On Local Network")
+            }
 
-                    Layout.fillHeight: true
+            ToggleSwitch {
+                id: checkBoxUPnP
 
-                    Layout.minimumWidth: 40
-                    Layout.preferredWidth: 40
-                    Layout.maximumWidth: 40
+                Layout.fillWidth: true
+
+                labelText: qsTr("Use UPnP")
+                fontPointSize: JamiTheme.settingsFontSize
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setUseUPnP(checked)
                 }
+            }
 
-                // row 2
-                ToggleSwitch {
-                    id: checkBoxUPnP
+            ToggleSwitch {
+                id: checkBoxTurnEnable
 
-                    Layout.row: 1
-                    Layout.column: 0
+                Layout.fillWidth: true
 
-                    labelText: qsTr("Use UPnP")
-                    fontPointSize: 10
+                labelText: qsTr("Use TURN")
+                fontPointSize: JamiTheme.settingsFontSize
 
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setUseUPnP(checked)
-                    }
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setUseTURN(checked)
                 }
+            }
 
-                Item {
-                    Layout.row: 1
-                    Layout.column: 1
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.fillHeight: true
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumWidth: 40
-                    Layout.preferredWidth: 40
-                    Layout.maximumWidth: 40
-                }
-
-                // row 3
-                ToggleSwitch {
-                    id: checkBoxTurnEnable
-
-                    Layout.row: 2
-                    Layout.column: 0
-
-                    labelText: qsTr("Use TURN")
-                    fontPointSize: 10
-
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setUseTURN(checked)
-                    }
-                }
-
-                // row 4
-                Label {
-                    Layout.row: 3
-                    Layout.column: 0
-
-                    Layout.minimumWidth: 124
-
-                    Layout.minimumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.maximumHeight: 27
-
-                    text: qsTr("TURN Address")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("TURN Address")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 InfoLineEdit {
                     id: lineEditTurnAddress
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.row: 3
-                    Layout.column: 2
-
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
-
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -922,37 +798,30 @@
                         ClientWrapper.settingsAdaptor.setTURNAddress(text)
                     }
                 }
+            }
 
-                //row 5
-                Label {
-                    Layout.row: 4
-                    Layout.column: 0
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumWidth: 124
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.maximumHeight: 27
-
-                    text: qsTr("TURN Username")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                    eText: qsTr("TURN Username")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 InfoLineEdit {
                     id: lineEditTurnUsername
 
-                    Layout.row: 4
-                    Layout.column: 2
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
-
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -962,38 +831,30 @@
                         ClientWrapper.settingsAdaptor.setTURNUsername(text)
                     }
                 }
+            }
 
-                //row 6
-                Label {
-                    Layout.row: 5
-                    Layout.column: 0
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                    Layout.minimumWidth: 124
-
-                    Layout.minimumHeight: 27
-                    Layout.preferredHeight: 27
-                    Layout.maximumHeight: 27
-
-                    text: qsTr("TURN Password")
-
-                    font.pointSize: 10
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
+                ElidedTextLabel {
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                    eText: qsTr("TURN Password")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 InfoLineEdit {
                     id: lineEditTurnPassword
                     layer.mipmap: false
 
-                    Layout.row: 5
-                    Layout.column: 2
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
-
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignLeft
@@ -1004,38 +865,52 @@
                         ClientWrapper.settingsAdaptor.setTURNPassword(text)
                     }
                 }
+            }
 
-                // row 7
-                ToggleSwitch {
-                    id: checkBoxSTUNEnable
 
-                    Layout.row: 6
-                    Layout.column: 0
+            ToggleSwitch {
+                id: checkBoxSTUNEnable
 
-                    labelText: qsTr("Use STUN")
-                    fontPointSize: 10
+                Layout.fillWidth: true
 
-                    onSwitchToggled: {
-                        ClientWrapper.settingsAdaptor.setUseSTUN(checked)
-                        lineEditSTUNAddress.enabled = checked
-                    }
+                labelText: qsTr("Use STUN")
+                fontPointSize: JamiTheme.settingsFontSize
+
+                onSwitchToggled: {
+                    ClientWrapper.settingsAdaptor.setUseSTUN(checked)
+                    lineEditSTUNAddress.enabled = checked
+                }
+            }
+
+            RowLayout {
+                Layout.fillWidth: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                ElidedTextLabel {
+                    id: lblEditSTUNAddress
+
+                    Layout.fillWidth: true
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                    eText: qsTr("STUN Address")
+                    fontSize: JamiTheme.settingsFontSize
+                    maxWidth: preferredColumnWidth
                 }
 
                 InfoLineEdit {
                     id: lineEditSTUNAddress
 
-                    Layout.row: 6
-                    Layout.column: 2
+                    fieldLayoutWidth: preferredColumnWidth
+                    fieldLayoutHeight: JamiTheme.preferredFieldHeight
 
-                    fieldLayoutWidth: 300
-                    fieldLayoutHeight: 29
-
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     placeholderText: qsTr("STUN Address")
 
-                    horizontalAlignment: Text.AlignLeft
+                    horizontalAlignment: Text.AlignRight
                     verticalAlignment: Text.AlignVCenter
 
                     onEditingFinished: {
@@ -1046,53 +921,33 @@
         }
     }
 
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 20
-        Layout.preferredHeight: 20
-        Layout.maximumHeight: 20
-    }
-
     ColumnLayout {
-        spacing: 6
+        spacing: 8
         Layout.fillWidth: true
 
         Label {
             Layout.fillWidth: true
-            Layout.topMargin: 10
-
-            Layout.minimumHeight: 27
-            Layout.preferredHeight: 27
-            Layout.maximumHeight: 27
+            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
             text: qsTr("Media")
-            font.pointSize: 13
+            font.pointSize: JamiTheme.headerFontSize
             font.kerning: true
 
             horizontalAlignment: Text.AlignLeft
             verticalAlignment: Text.AlignVCenter
         }
 
-        Item {
-            Layout.fillWidth: true
-
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-            Layout.maximumHeight: 10
-        }
-
         ColumnLayout {
-            spacing: 6
             Layout.fillWidth: true
+            Layout.leftMargin: JamiTheme.preferredMarginSize
 
             ToggleSwitch {
                 id: videoCheckBox
 
-                Layout.leftMargin: 20
-
                 labelText: qsTr("Enable Video")
-                fontPointSize: 10
+                fontPointSize: JamiTheme.settingsFontSize
 
                 onSwitchToggled: {
                     ClientWrapper.settingsAdaptor.setVideoState(checked)
@@ -1100,66 +955,46 @@
             }
 
             RowLayout {
-                spacing: 6
                 Layout.fillWidth: true
-                Layout.leftMargin: 20
+                Layout.fillHeight: true
 
                 ColumnLayout {
-                    spacing: 6
-                    //Layout.fillWidth: true
-                    Layout.maximumWidth: 348
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
 
                     RowLayout {
-                        spacing: 6
                         Layout.fillWidth: true
+                        Layout.fillHeight: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        Layout.maximumHeight: 30
-
-                        Label {
+                        ElidedTextLabel {
                             Layout.fillWidth: true
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
-
-                            text: qsTr("Video Codecs")
-                            font.pointSize: 10
-                            font.kerning: true
-
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
-                        }
-
-                        Item {
-                            Layout.fillHeight: true
-
-                            Layout.minimumWidth: 20
-                            Layout.preferredWidth: 20
-                            Layout.maximumWidth: 20
+                            maxWidth: preferredColumnWidth - 50
+                            eText:  qsTr("Video Codecs")
+                            fontSize: JamiTheme.settingsFontSize
                         }
 
                         HoverableRadiusButton {
                             id: videoDownPushButton
 
-                            Layout.minimumWidth: 30
-                            Layout.preferredWidth: 30
-                            Layout.maximumWidth: 30
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
                             buttonImageHeight: height
                             buttonImageWidth: height
                             radius: height / 2
-                            scale: 1
-
-                            font.pointSize: 9
-                            font.kerning: true
 
                             icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                            icon.width: 32
-                            icon.height: 32
+                            icon.width: 24
+                            icon.height: 24
 
                             onClicked: {
                                 decreaseVideoCodecPriority()
@@ -1169,24 +1004,20 @@
                         HoverableRadiusButton {
                             id: videoUpPushButton
 
-                            Layout.minimumWidth: 30
-                            Layout.preferredWidth: 30
-                            Layout.maximumWidth: 30
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
                             buttonImageHeight: height
                             buttonImageWidth: height
                             radius: height / 2
 
-                            font.pointSize: 9
-                            font.kerning: true
-
                             icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                            icon.width: 32
-                            icon.height: 32
+                            icon.width: 24
+                            icon.height: 24
 
                             onClicked: {
                                 increaseVideoCodecPriority()
@@ -1197,10 +1028,9 @@
                     ListViewJami {
                         id: videoListWidget
 
-                        Layout.minimumWidth: 348
-                        Layout.preferredWidth: 348
-                        Layout.maximumWidth: 348
-
+                        Layout.minimumWidth: preferredColumnWidth
+                        Layout.preferredWidth: preferredColumnWidth
+                        Layout.maximumWidth: preferredColumnWidth
                         Layout.minimumHeight: 192
                         Layout.preferredHeight: 192
                         Layout.maximumHeight: 192
@@ -1230,59 +1060,40 @@
                 }
 
                 ColumnLayout {
-                    spacing: 6
-                    Layout.maximumWidth: 348
+                    Layout.fillWidth: true
 
                     RowLayout {
-                        spacing: 6
                         Layout.fillWidth: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        Layout.maximumHeight: 30
-
-                        Label {
+                        ElidedTextLabel {
                             Layout.fillWidth: true
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
-
-                            text: qsTr("Audio Codecs")
-                            font.pointSize: 10
-                            font.kerning: true
-
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
-                        }
-
-                        Item {
-                            Layout.fillHeight: true
-
-                            Layout.minimumWidth: 20
-                            Layout.preferredWidth: 20
-                            Layout.maximumWidth: 20
+                            maxWidth: preferredColumnWidth - 50
+                            eText:  qsTr("Audio Codecs")
+                            fontSize: JamiTheme.settingsFontSize
                         }
 
                         HoverableRadiusButton {
                             id: audioDownPushButton
 
-                            Layout.minimumWidth: 30
-                            Layout.preferredWidth: 30
-                            Layout.maximumWidth: 30
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
                             radius: height / 2
                             buttonImageHeight: height
                             buttonImageWidth: height
 
-                            font.pointSize: 9
-                            font.kerning: true
-
                             icon.source: "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                            icon.width: 32
-                            icon.height: 32
+                            icon.width: 24
+                            icon.height: 24
 
                             onClicked: {
                                 decreaseAudioCodecPriority()
@@ -1292,25 +1103,20 @@
                         HoverableRadiusButton {
                             id: audioUpPushButton
 
-                            Layout.minimumWidth: 30
-                            Layout.preferredWidth: 30
-                            Layout.maximumWidth: 30
+                            Layout.minimumWidth: 24
+                            Layout.preferredWidth: 24
+                            Layout.maximumWidth: 24
+                            Layout.minimumHeight: 24
+                            Layout.preferredHeight: 24
+                            Layout.maximumHeight: 24
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
-
+                            radius: height / 2
                             buttonImageHeight: height
                             buttonImageWidth: height
 
-                            radius: height / 2
-
-                            font.pointSize: 9
-                            font.kerning: true
-
                             icon.source: "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                            icon.width: 32
-                            icon.height: 32
+                            icon.width: 24
+                            icon.height: 24
 
                             onClicked: {
                                 increaseAudioCodecPriority()
@@ -1321,10 +1127,9 @@
                     ListViewJami {
                         id: audioListWidget
 
-                        Layout.minimumWidth: 348
-                        Layout.preferredWidth: 348
-                        Layout.maximumWidth: 348
-
+                        Layout.minimumWidth: preferredColumnWidth
+                        Layout.preferredWidth: preferredColumnWidth
+                        Layout.maximumWidth: preferredColumnWidth
                         Layout.minimumHeight: 192
                         Layout.preferredHeight: 192
                         Layout.maximumHeight: 192
@@ -1359,12 +1164,4 @@
             }
         }
     }
-
-    Item {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: 48
-        Layout.preferredHeight: 48
-        Layout.maximumHeight: 48
-    }
 }
diff --git a/src/settingsview/components/AvSettingPage.qml b/src/settingsview/components/AvSettingPage.qml
index 52d3e05..288d9a9 100644
--- a/src/settingsview/components/AvSettingPage.qml
+++ b/src/settingsview/components/AvSettingPage.qml
@@ -27,7 +27,7 @@
 import "../../commoncomponents"
 
 Rectangle {
-    id: avSettingPage
+    id: avSettingsRect
 
     AudioInputDeviceModel{
         id: audioInputDeviceModel
@@ -209,6 +209,7 @@
 
         try{
             ClientWrapper.settingsAdaptor.set_Video_Settings_Rate_And_Resolution(ClientWrapper.avmodel.getCurrentVideoCaptureDevice(),rate,resolution)
+            updatePreviewRatio(resolution)
         } catch(error){console.warn(error.message)}
     }
 
@@ -216,6 +217,21 @@
         populateVideoSettings()
     }
 
+    function updatePreviewRatio(resolution){
+        var res = resolution.split("x")
+        var ratio = res[1] / res[0]
+        if (ratio) {
+            aspectRatio = ratio
+        } else {
+            console.error("Could not scale recording video preview")
+        }
+    }
+
+    property int preferredColumnWidth: avSettingsScrollView.width / 2 - 50
+    property int preferredSettingsWidth: avSettingsScrollView.width - 100
+
+    property real aspectRatio: 0.75
+
     property bool previewAvailable: false
     signal backArrowClicked
 
@@ -236,158 +252,130 @@
     }
 
     Layout.fillHeight: true
-    Layout.fillWidth: true
+    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView
+    anchors.centerIn: parent
 
-    ScrollView{
-        anchors.fill: parent
-        clip: true
+    ColumnLayout {
+        anchors.fill: avSettingsRect
 
         RowLayout {
-            width: avSettingPage.width
-            height: avSettingPage.height
+            id: avSettingsTitle
+            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
+            Layout.leftMargin: JamiTheme.preferredMarginSize
+            Layout.fillWidth: true
+            Layout.maximumHeight: 64
+            Layout.minimumHeight: 64
+            Layout.preferredHeight: 64
 
-            spacing: 0
-            Item {
-                Layout.fillHeight: true
-                Layout.maximumWidth: 48
-                Layout.preferredWidth: 48
-                Layout.minimumWidth: 48
+            HoverableButton {
+                id: backToSettingsMenuButton
+
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+                Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.rightMargin: JamiTheme.preferredMarginSize
+
+                radius: 30
+                source: "qrc:/images/icons/ic_arrow_back_24px.svg"
+                backgroundColor: "white"
+                onExitColor: "white"
+
+                visible: mainViewWindow.sidePanelHidden
+
+                onClicked: {
+                    backArrowClicked()
+                }
             }
 
+            Label {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                text: qsTr("Audio / Video")
+                font.pointSize: JamiTheme.titleFontSize
+                font.kerning: true
+
+                horizontalAlignment: Text.AlignLeft
+                verticalAlignment: Text.AlignVCenter
+            }
+
+        }
+
+
+        ScrollView {
+            id: avSettingsScrollView
+            property ScrollBar vScrollBar: ScrollBar.vertical
+
+            Layout.fillHeight: true
+            Layout.fillWidth: true
+
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+
+            width: avSettingsRect.width
+            height: avSettingsRect.height - avSettingsTitle.height
+
+            ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
+            ScrollBar.vertical.policy: ScrollBar.AsNeeded
+
+            clip: true
+
             ColumnLayout {
-                spacing: 7
-
                 Layout.fillHeight: true
-                Layout.maximumWidth: 580
-                Layout.preferredWidth: 580
-                Layout.minimumWidth: 580
+                Layout.fillWidth: true
+                Layout.alignment: Qt.AlignHCenter
 
-                Item {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 10
-                    Layout.preferredHeight: 10
-                    Layout.maximumHeight: 10
-                }
+                spacing: 24
 
-                RowLayout {
-
-                    Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
-                    Layout.leftMargin: 16
-                    Layout.fillWidth: true
-                    Layout.maximumHeight: 64
-                    Layout.minimumHeight: 64
-                    Layout.preferredHeight: 64
-
-                    HoverableButton {
-
-                        Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
-                        Layout.preferredWidth: 30
-                        Layout.preferredHeight: 30
-
-                        radius: 30
-                        source: "qrc:/images/icons/ic_arrow_back_24px.svg"
-                        backgroundColor: "white"
-                        onExitColor: "white"
-
-                        visible: mainViewWindow.sidePanelHidden
-
-                        onClicked: {
-                            backArrowClicked()
-                        }
-                    }
-
-
-                    Label {
-                        Layout.fillWidth: true
-                        Layout.minimumHeight: 25
-                        Layout.preferredHeight: 25
-                        Layout.maximumHeight: 25
-
-                        text: qsTr("Audio / Video")
-                        font.pointSize: 15
-                        font.kerning: true
-
-                        horizontalAlignment: Text.AlignLeft
-                        verticalAlignment: Text.AlignVCenter
-                    }
-                }
-
-                Item {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 24
-                    Layout.preferredHeight: 24
-                    Layout.maximumHeight: 24
-                }
-
+                // Audio
                 ColumnLayout {
-                    spacing: 0
+                    spacing: 8
                     Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                    Label {
+                    ElidedTextLabel {
                         Layout.fillWidth: true
-                        Layout.minimumHeight: 21
-                        Layout.preferredHeight: 21
-                        Layout.maximumHeight: 21
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        text: qsTr("Audio")
-                        font.pointSize: 13
-                        font.kerning: true
-
-                        horizontalAlignment: Text.AlignLeft
-                        verticalAlignment: Text.AlignVCenter
-                    }
-
-                    Item {
-                        Layout.fillWidth: true
-                        Layout.minimumHeight: 10
-                        Layout.preferredHeight: 10
-                        Layout.maximumHeight: 10
+                        eText: qsTr("Audio")
+                        fontSize: JamiTheme.headerFontSize
+                        maxWidth: preferredColumnWidth
                     }
 
                     ColumnLayout {
-                        spacing: 7
                         Layout.fillWidth: true
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
 
                         RowLayout {
-                            spacing: 7
-                            Layout.leftMargin: 20
                             Layout.fillWidth: true
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.maximumWidth: 77
-                                Layout.preferredWidth: 77
-                                Layout.minimumWidth: 77
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Microphone")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
+                            ElidedTextLabel {
                                 Layout.fillWidth: true
-                                Layout.fillHeight: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Microphone")
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
+
                             SettingParaCombobox {
                                 id: inputComboBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: audioInputDeviceModel
@@ -404,67 +392,45 @@
                         LevelMeter {
                             id: audioInputMeter
 
-                            Layout.leftMargin: 20
-
-                            Layout.fillWidth: true
-
-                            Layout.minimumHeight: 10
-                            Layout.preferredHeight: 10
-                            Layout.maximumHeight: 10
+                            Layout.minimumWidth: preferredSettingsWidth
+                            Layout.preferredWidth: preferredSettingsWidth
+                            Layout.maximumWidth: preferredSettingsWidth
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                             indeterminate: false
                             from: 0
                             to: 100
                         }
 
-                        Item {
-                            Layout.fillWidth: true
-
-                            Layout.minimumHeight: 5
-                            Layout.preferredHeight: 5
-                            Layout.maximumHeight: 5
-                        }
-
                         RowLayout {
-                            spacing: 7
-                            Layout.leftMargin: 20
                             Layout.fillWidth: true
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.maximumWidth: 95
-                                Layout.preferredWidth: 95
-                                Layout.minimumWidth: 95
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Output Device")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
+                            ElidedTextLabel {
                                 Layout.fillWidth: true
-                                Layout.fillHeight: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Output Device")
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
+
                             SettingParaCombobox {
                                 id: outputComboBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.settingsFontSize
                                 font.kerning: true
 
                                 model: audioOutputDeviceModel
@@ -478,45 +444,33 @@
                         }
 
                         RowLayout {
-                            spacing: 7
-                            Layout.leftMargin: 20
                             Layout.fillWidth: true
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.maximumWidth: 77
-                                Layout.preferredWidth: 77
-                                Layout.minimumWidth: 77
+                            ElidedTextLabel {
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Ringtone Device")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
                                 Layout.fillWidth: true
-                                Layout.fillHeight: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Ringtone Device")
+                                font.pointSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
+
                             SettingParaCombobox {
                                 id: ringtoneDeviceComboBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: audioOutputDeviceModel
@@ -532,45 +486,31 @@
                         RowLayout {
                             id: audioManagerRowLayout
 
-                            spacing: 7
-                            Layout.leftMargin: 20
                             Layout.fillWidth: true
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
-                                Layout.maximumWidth: 77
-                                Layout.preferredWidth: 77
-                                Layout.minimumWidth: 77
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
+                            ElidedTextLabel {
+                                Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                                 text: qsTr("Audio Manager")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
-                                Layout.fillWidth: true
-                                Layout.fillHeight: true
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
                             SettingParaCombobox {
                                 id: audioManagerComboBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: audioManagerListModel
@@ -585,84 +525,54 @@
                     }
                 }
 
-                Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 20
-                    Layout.preferredHeight: 20
-                    Layout.maximumHeight: 20
-                }
-
                 ColumnLayout {
-                    spacing: 7
+                    spacing: 8
                     Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                    Label {
+                    ElidedTextLabel {
                         Layout.fillWidth: true
-                        Layout.minimumHeight: 30
-                        Layout.preferredHeight: 30
-                        Layout.maximumHeight: 30
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        text: qsTr("Video")
-                        font.pointSize: 13
-                        font.kerning: true
-
-                        horizontalAlignment: Text.AlignLeft
-                        verticalAlignment: Text.AlignVCenter
-                    }
-
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.minimumHeight: 10
-                        Layout.preferredHeight: 10
-                        Layout.maximumHeight: 10
+                        eText: qsTr("Video")
+                        fontSize: JamiTheme.headerFontSize
+                        maxWidth: preferredSettingsWidth
                     }
 
                     ColumnLayout {
-                        spacing: 6
-                        RowLayout {
-                            spacing: 7
-                            Layout.fillWidth: true
-                            Layout.leftMargin: 20
-                            Layout.maximumHeight: 30
+                        Layout.leftMargin: 16
 
-                            Label {
+                        RowLayout {
+                            Layout.fillWidth: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                            ElidedTextLabel {
                                 id: labelVideoDevice
 
-                                Layout.maximumWidth: 44
-                                Layout.preferredWidth: 44
-                                Layout.minimumWidth: 44
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Device")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
-                                Layout.fillHeight: true
                                 Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Device")
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
+
                             SettingParaCombobox {
                                 id: deviceBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: videoInputDeviceModel
@@ -676,47 +586,33 @@
                         }
 
                         RowLayout {
-                            spacing: 7
                             Layout.fillWidth: true
-                            Layout.leftMargin: 20
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
+                            ElidedTextLabel {
                                 id: labelVideoResolution
 
-                                Layout.maximumWidth: 47
-                                Layout.preferredWidth: 47
-                                Layout.minimumWidth: 47
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Resolution")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
-                                Layout.fillHeight: true
                                 Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Resolution")
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
                             SettingParaCombobox {
                                 id: resolutionBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: videoFormatResolutionModel
@@ -729,47 +625,33 @@
                         }
 
                         RowLayout {
-                            spacing: 7
                             Layout.fillWidth: true
-                            Layout.leftMargin: 20
-                            Layout.maximumHeight: 30
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Label {
+                            ElidedTextLabel {
                                 id: labelVideoFps
 
-                                Layout.maximumWidth: 47
-                                Layout.preferredWidth: 47
-                                Layout.minimumWidth: 47
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Fps")
-                                font.pointSize: 11
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
-                                Layout.fillHeight: true
                                 Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Fps")
+                                fontSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
                             SettingParaCombobox {
                                 id: fpsBox
 
-                                Layout.maximumWidth: 360
-                                Layout.preferredWidth: 360
-                                Layout.minimumWidth: 360
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                font.pointSize: 10
+                                font.pointSize: JamiTheme.buttonFontSize
                                 font.kerning: true
 
                                 model: videoFormatFpsModel
@@ -783,53 +665,43 @@
                     }
                 }
 
-                Item {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 20
-                    Layout.preferredHeight: 20
-                    Layout.maximumHeight: 20
-                }
-
-                RowLayout{
+                Rectangle {
+                    id: rectBox
                     Layout.alignment: Qt.AlignHCenter
+                    Layout.maximumHeight: width * aspectRatio
+                    Layout.minimumHeight: width * aspectRatio
+                    Layout.preferredHeight: width * aspectRatio
 
-                    Layout.preferredWidth: 580
-                    Layout.minimumWidth: 580
+                    Layout.minimumWidth: 200
+                    Layout.maximumWidth: 400
+                    Layout.preferredWidth: preferredSettingsWidth
+                    color: "white"
+                    radius: 5
 
-                    Layout.minimumHeight: 224
-                    Layout.preferredHeight: 224
-                    Layout.maximumHeight: 224
+                    PreviewRenderer {
+                        id: previewWidget
+                        anchors.fill: rectBox
+                        anchors.centerIn: rectBox
 
-                    Rectangle {
-                        Layout.alignment: Qt.AlignHCenter
-                        Layout.fillHeight: true
-                        Layout.minimumWidth: 580
-
-                        color: "black"
-
-                        PreviewRenderer{
-                            id: peviewWidget
-
-                            visible: previewAvailable
-                            height: parent.height
-                            width: 224
-                            x: (parent.width - width) /2
-                            y: 0
+                        layer.enabled: true
+                        layer.effect: OpacityMask {
+                            maskSource: rectBox
                         }
                     }
                 }
 
+
                 Label {
                     visible: !previewAvailable
 
                     Layout.fillWidth: true
 
-                    Layout.minimumHeight: 30
-                    Layout.preferredHeight: 30
-                    Layout.maximumHeight: 30
+                    Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                    Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                    Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                     text: qsTr("Preview unavailable")
-                    font.pointSize: 10
+                    font.pointSize: JamiTheme.settingsFontSize
                     font.kerning: true
 
                     horizontalAlignment: Text.AlignHCenter
@@ -840,24 +712,31 @@
                 ToggleSwitch {
                     id: hardwareAccelControl
 
-                    labelText: "Enable hardware acceleration"
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    labelText: hwAccelText.elidedText
+                    fontPointSize: JamiTheme.settingsFontSize
 
                     onSwitchToggled: {
                         slotSetHardwareAccel(checked)
                     }
                 }
 
+                TextMetrics {
+                    id: hwAccelText
+                    elide: Text.ElideRight
+                    elideWidth: preferredSettingsWidth - 50
+                    text: qsTr("Enable hardware acceleration")
+                }
+
                 Item {
+                    Layout.preferredWidth: avSettingsRect.width - 32
+                    Layout.minimumWidth: avSettingsRect.width - 32
+                    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView - 32
                     Layout.fillHeight: true
-                    Layout.fillWidth: true
                 }
             }
-
-            Item {
-                Layout.fillHeight: true
-                Layout.fillWidth: true
-            }
         }
-
     }
 }
diff --git a/src/settingsview/components/BannedItemDelegate.qml b/src/settingsview/components/BannedItemDelegate.qml
index 980d539..0322bb0 100644
--- a/src/settingsview/components/BannedItemDelegate.qml
+++ b/src/settingsview/components/BannedItemDelegate.qml
@@ -57,24 +57,23 @@
     RowLayout{
         anchors.fill: parent
 
-        spacing: 7
+        spacing: 8
 
         Label{
             id: labelContactAvatar
 
             Layout.alignment: Qt.AlignVCenter
 
-            Layout.leftMargin: 7
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
+            Layout.leftMargin: 16
+            Layout.rightMargin: 16
 
-            Layout.minimumWidth: 48
-            Layout.preferredWidth: 48
-            Layout.maximumWidth: 48
+            Layout.minimumWidth: 32
+            Layout.preferredWidth: 32
+            Layout.maximumWidth: 32
 
-            Layout.minimumHeight: 48
-            Layout.preferredHeight: 48
-            Layout.maximumHeight: 48
+            Layout.minimumHeight: 32
+            Layout.preferredHeight: 32
+            Layout.maximumHeight: 32
 
             background: Rectangle{
                 anchors.fill: parent
@@ -100,44 +99,34 @@
             }
         }
 
-        Item{
-            Layout.minimumWidth: 8
-            Layout.preferredWidth: 8
-            Layout.maximumWidth: 8
-
-            Layout.minimumHeight: 20
-            Layout.preferredHeight: 20
-            Layout.maximumHeight: 20
-        }
-
         ColumnLayout{
             Layout.fillWidth: true
             Layout.fillHeight: true
 
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
-
             Layout.alignment: Qt.AlignVCenter
 
-            spacing: 7
-
             Label{
                 id: labelContactName
 
                 Layout.fillWidth: true
-                Layout.minimumWidth: 0
-                Layout.maximumWidth: 16777215
 
-                Layout.minimumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.maximumHeight: 30
+                Layout.minimumHeight: 24
+                Layout.preferredHeight: 24
+                Layout.maximumHeight: 24
 
-                font.pointSize: 8
+                font.pointSize: JamiTheme.textFontSize
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
                 verticalAlignment: Text.AlignVCenter
 
+                text: labelContactNameElidedText.elidedText
+            }
+
+            TextMetrics {
+                id: labelContactNameElidedText
+                elide: Text.ElideRight
+                elideWidth: deviceItemDelegate.width - 80
                 text: contactName === "" ? qsTr("name") : contactName
             }
 
@@ -145,19 +134,24 @@
                 id: labelContactId
 
                 Layout.fillWidth: true
-                Layout.minimumWidth: 0
-                Layout.maximumWidth: 16777215
 
-                Layout.minimumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.maximumHeight: 30
+                Layout.minimumHeight: 24
+                Layout.preferredHeight: 24
+                Layout.maximumHeight: 24
 
-                font.pointSize: 8
+                font.pointSize: JamiTheme.textFontSize
                 font.kerning: true
 
                 horizontalAlignment: Qt.AlignLeft
                 verticalAlignment: Qt.AlignVCenter
 
+                text: labelContactIdElidedText.elidedText
+            }
+
+            TextMetrics {
+                id: labelContactIdElidedText
+                elide: Text.ElideRight
+                elideWidth: deviceItemDelegate.width - 80
                 text: contactID === "" ? qsTr("id") : contactID
             }
         }
@@ -165,24 +159,27 @@
         HoverableRadiusButton{
             id: btnReAddContact
 
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
+            Layout.rightMargin: 8
 
-            Layout.minimumWidth: 30
-            Layout.preferredWidth: 30
-            Layout.maximumWidth: 30
+            Layout.minimumWidth: 32
+            Layout.preferredWidth: 32
+            Layout.maximumWidth: 32
 
-            Layout.minimumHeight: 30
-            Layout.preferredHeight: 30
-            Layout.maximumHeight: 30
+            Layout.minimumHeight: 32
+            Layout.preferredHeight: 32
+            Layout.maximumHeight: 32
 
-            font.pointSize: 8
-            font.kerning: true
+            buttonImageHeight: height - 8
+            buttonImageWidth: width - 8
 
-            buttonImageHeight: height
-            buttonImageWidth: height
+            source: "qrc:/images/icons/ic_person_add_black_24dp_2x.png"
 
-            source:"qrc:/images/icons/ic_person_add_black_24dp_2x.png"
+            radius: height / 2
+            width: 25
+            height: 25
+
+            backgroundColor: "transparent"
 
             ToolTip.visible: isHovering
             ToolTip.text: qsTr("Add as contact")
@@ -191,16 +188,6 @@
                 btnReAddContactClicked()
             }
         }
-
-        Item{
-            Layout.rightMargin: 7
-
-            Layout.minimumWidth: 8
-            Layout.preferredWidth: 8
-            Layout.maximumWidth: 8
-
-            Layout.minimumHeight: 20
-        }
     }
 }
 
diff --git a/src/settingsview/components/CurrentAccountSettingsScrollPage.qml b/src/settingsview/components/CurrentAccountSettingsScrollPage.qml
index 78358f1..d7ba3ca 100644
--- a/src/settingsview/components/CurrentAccountSettingsScrollPage.qml
+++ b/src/settingsview/components/CurrentAccountSettingsScrollPage.qml
@@ -45,6 +45,7 @@
     property bool registeredIdNeedsSet: false
 
     property int refreshVariable : 0
+    property int preferredColumnWidth : accountViewRect.width / 2 - 50
 
     signal navigateToMainView
     signal navigateToNewWizardView
@@ -55,6 +56,7 @@
         refreshVariable--
     }
 
+
     Connections {
         id: btnRegisterNameClickConnection
         target: btnRegisterName
@@ -93,12 +95,11 @@
             currentRegisteredID.text = ""
         }
 
-        currentRingID.text = ClientWrapper.settingsAdaptor.getCurrentAccount_Profile_Info_Uri()
+        currentRingIDText.text = ClientWrapper.settingsAdaptor.getCurrentAccount_Profile_Info_Uri()
 
         // update device list view
         updateAndShowDevicesSlot()
 
-        bannedContactsListWidget.visible = false
         bannedContactsLayoutWidget.visible = (bannedListModel.rowCount() > 0)
 
         if (advanceSettingsView.visible) {
@@ -124,7 +125,7 @@
     function setAvatar() {
         currentAccountAvatar.setAvatarPixmap(
                     ClientWrapper.settingsAdaptor.getAvatarImage_Base64(
-                        currentAccountAvatar.boothWidht),
+                        currentAccountAvatar.boothWidth),
                     ClientWrapper.settingsAdaptor.getIsDefaultAvatar())
     }
 
@@ -132,13 +133,13 @@
         currentAccountAvatar.stopBooth()
     }
 
-    function toggleBannedContacts(){
+    function toggleBannedContacts() {
         var bannedContactsVisible = bannedContactsListWidget.visible
         bannedContactsListWidget.visible = !bannedContactsVisible
         updateAndShowBannedContactsSlot()
     }
 
-    function unban(index){
+    function unban(index) {
         ClientWrapper.settingsAdaptor.unbanContact(index)
         updateAndShowBannedContactsSlot()
     }
@@ -446,48 +447,30 @@
     }
 
     Layout.fillHeight: true
-    Layout.fillWidth: true
+    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView
+    anchors.centerIn: parent
 
     ColumnLayout {
-        anchors.fill: parent
-        spacing: 0
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.maximumHeight: 10
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-
-            Layout.alignment: Qt.AlignTop
-        }
+        anchors.fill: accountViewRect
 
         RowLayout {
-            spacing: 6
-
-            Layout.alignment: Qt.AlignTop
-
+            id: accountPageTitle
+            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
+            Layout.leftMargin: JamiTheme.preferredMarginSize
             Layout.fillWidth: true
-            Layout.maximumHeight: 30
-            Layout.minimumHeight: 30
-            Layout.preferredHeight: accountPageTitle.height
-
-            Item {
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 30
-                Layout.preferredWidth: 30
-                Layout.minimumWidth: 30
-            }
-
+            Layout.maximumHeight: 64
+            Layout.minimumHeight: 64
+            Layout.preferredHeight: 64
 
             HoverableButton {
+                id: backToSettingsMenuButton
 
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
-                Layout.preferredWidth: 30
-                Layout.preferredHeight: 30
+                Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.rightMargin: JamiTheme.preferredMarginSize
 
-                radius: 30
+                radius: 32
                 source: "qrc:/images/icons/ic_arrow_back_24px.svg"
                 backgroundColor: "white"
                 onExitColor: "white"
@@ -499,899 +482,727 @@
                 }
             }
 
-
-            Label {
-                id: accountPageTitle
-
-                Layout.preferredWidth: 117
-
-                Layout.maximumHeight: 25
-                Layout.preferredHeight: 25
-                Layout.minimumHeight: 25
-
-                text: qsTr("Jami Account")
-
-                font.pointSize: 15
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-            }
-
-            Item {
+            ElidedTextLabel {
                 Layout.fillWidth: true
-                Layout.fillHeight: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                eText: qsTr("Account Settings")
+                fontSize: JamiTheme.titleFontSize
+                maxWidth: !backToSettingsMenuButton.visible ? accountViewRect.width - 100 :
+                                                              accountViewRect.width - backToSettingsMenuButton.width - 100
+
             }
         }
 
         ScrollView {
-            id: accoutScrollView
+            id: accountScrollView
 
-            property ScrollBar hScrollBar: ScrollBar.horizontal
             property ScrollBar vScrollBar: ScrollBar.vertical
 
             Layout.fillHeight: true
             Layout.fillWidth: true
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
 
-            ScrollBar.horizontal.policy: ScrollBar.AsNeeded
+            width: accountViewRect.width
+            height: accountViewRect.height - accountPageTitle.height
+
+            ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
             ScrollBar.vertical.policy: ScrollBar.AsNeeded
 
-            font.pointSize: 8
-            font.kerning: true
             clip: true
 
+            /*
+             * ScrollView Layout
+             */
             ColumnLayout {
-                id: accoutnViewLayout
+                id: accountViewLayout
 
                 Layout.fillHeight: true
-                Layout.maximumWidth: 625
+                Layout.preferredWidth: accountViewRect.width
+                Layout.alignment: Qt.AlignHCenter
 
-                Item {
-                    Layout.fillHeight: true
+                spacing: 24
 
-                    Layout.maximumWidth: 30
-                    Layout.preferredWidth: 30
-                    Layout.minimumWidth: 30
+                ToggleSwitch {
+                    id: accountEnableCheckBox
+
+                    Layout.topMargin: JamiTheme.preferredMarginSize
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    labelText: qsTr("Enable")
+                    fontPointSize: JamiTheme.headerFontSize
+
+                    onSwitchToggled: {
+                        setAccEnableSlot(checked)
+                    }
                 }
 
+                /*
+                 * Profile
+                 */
                 ColumnLayout {
-                    spacing: 6
-                    Layout.fillHeight: true
                     Layout.fillWidth: true
+                    Layout.fillHeight: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    spacing: 8
 
-                    Layout.leftMargin: 30
+                    Label {
+                        Layout.fillWidth: true
 
-                    Item {
-                        Layout.fillHeight: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                        Layout.maximumWidth: 24
-                        Layout.preferredWidth: 24
-                        Layout.minimumWidth: 24
+                        text: qsTr("Profile")
+                        font.pointSize: JamiTheme.headerFontSize
+                        font.kerning: true
+
+                        horizontalAlignment: Text.AlignLeft
+                        verticalAlignment: Text.AlignVCenter
                     }
 
-                    ToggleSwitch {
-                        id: accountEnableCheckBox
+                    PhotoboothView {
+                        id: currentAccountAvatar
 
-                        labelText: qsTr("Enable")
-                        fontPointSize: 11
+                        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
 
-                        onSwitchToggled: {
-                            setAccEnableSlot(checked)
+                        boothWidth: Math.min(224, accountViewRect.width - 100)
+
+                        Layout.maximumWidth: boothWidth+50
+                        Layout.preferredWidth: boothWidth+50
+                        Layout.minimumWidth: boothWidth+50
+                        Layout.maximumHeight: boothWidth+50
+                        Layout.preferredHeight: boothWidth+50
+                        Layout.minimumHeight: boothWidth+50
+
+                        onImageAcquired: {
+                            ClientWrapper.settingsAdaptor.setCurrAccAvatar(imgBase64)
+                        }
+
+                        onImageCleared: {
+                            ClientWrapper.settingsAdaptor.clearCurrentAvatar()
+                            setAvatar()
                         }
                     }
 
-                    Item {
-                        Layout.fillHeight: true
+                    InfoLineEdit {
+                        id: displayNameLineEdit
 
-                        Layout.maximumWidth: 20
-                        Layout.preferredWidth: 20
-                        Layout.minimumWidth: 20
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        Layout.alignment: Qt.AlignHCenter
+
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+
+                        horizontalAlignment: Text.AlignHCenter
+                        verticalAlignment: Text.AlignVCenter
+
+                        onEditingFinished: {
+                            ClientWrapper.accountAdaptor.setCurrAccDisplayName(
+                                        displayNameLineEdit.text)
+                        }
                     }
+                }
 
-                    ColumnLayout {
+                /*
+                 * Identity
+                 */
+                ColumnLayout {
+                    Layout.fillWidth: true
+                    Layout.alignment: Qt.AlignHCenter
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    spacing: 8
+
+                    ElidedTextLabel {
                         Layout.fillWidth: true
 
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                        eText: qsTr("Identity")
+                        maxWidth: accountViewRect.width - 72
+                        fontSize: JamiTheme.headerFontSize
+                    }
+
+                    RowLayout {
+                        spacing: 8
+                        Layout.fillWidth: true
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
                         Label {
+                            id: idLabel
                             Layout.fillWidth: true
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.maximumHeight: 21
-                            Layout.preferredHeight: 21
-                            Layout.minimumHeight: 21
-
-                            text: qsTr("Profile")
-                            font.pointSize: 13
+                            text: qsTr("Id")
+                            font.pointSize: JamiTheme.settingsFontSize
                             font.kerning: true
 
                             horizontalAlignment: Text.AlignLeft
                             verticalAlignment: Text.AlignVCenter
                         }
 
-                        Item {
+                        TextField {
+                            id: currentRingID
+
+                            property var backgroundColor: "transparent"
+                            property var borderColor: "transparent"
+
                             Layout.fillWidth: true
-
-                            Layout.maximumHeight: 10
-                            Layout.preferredHeight: 10
-                            Layout.minimumHeight: 10
-                        }
-
-                        ColumnLayout {
-                            Layout.fillWidth: true
-                            layoutDirection: Qt.LeftToRight
-
-                            spacing: 6
-
-                            PhotoboothView {
-                                id: currentAccountAvatar
-
-                                Layout.alignment: Qt.AlignHCenter
-
-                                Layout.maximumWidth: 261
-                                Layout.preferredWidth: 261
-                                Layout.minimumWidth: 261
-                                Layout.maximumHeight: 261
-                                Layout.preferredHeight: 261
-                                Layout.minimumHeight: 261
-
-                                Layout.leftMargin: 20
-
-                                onImageAcquired: {
-                                    ClientWrapper.settingsAdaptor.setCurrAccAvatar(imgBase64)
-                                }
-
-                                onImageCleared: {
-                                    ClientWrapper.settingsAdaptor.clearCurrentAvatar()
-                                    setAvatar()
-                                }
-                            }
-
-                            InfoLineEdit {
-                                id: displayNameLineEdit
-
-                                fieldLayoutWidth: 261
-
-                                Layout.leftMargin: 20
-
-                                font.pointSize: 10
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignHCenter
-                                verticalAlignment: Text.AlignVCenter
-
-                                onEditingFinished: {
-                                    ClientWrapper.accountAdaptor.setCurrAccDisplayName(
-                                                displayNameLineEdit.text)
-                                }
-                            }
-                        }
-                    }
-
-                    Item {
-                        Layout.fillHeight: true
-
-                        Layout.maximumWidth: 20
-                        Layout.preferredWidth: 20
-                        Layout.minimumWidth: 20
-                    }
-
-                    ColumnLayout {
-                        Layout.fillWidth: true
-
-                        Label {
-                            Layout.fillWidth: true
-
-                            Layout.maximumHeight: 21
-                            Layout.preferredHeight: 21
-                            Layout.minimumHeight: 21
-
-                            text: qsTr("Identity")
-                            font.pointSize: 13
-                            font.kerning: true
-
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
-                        }
-
-                        Item {
                             Layout.fillHeight: true
 
-                            Layout.maximumWidth: 10
-                            Layout.preferredWidth: 10
-                            Layout.minimumWidth: 10
-                        }
-
-                        ColumnLayout {
-                            spacing: 7
-
-                            Layout.fillWidth: true
-
-                            RowLayout {
-                                spacing: 6
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 30
-
-                                Layout.leftMargin: 20
-
-                                Layout.maximumWidth: 625
-
-                                Label {
-                                    Layout.maximumWidth: 13
-                                    Layout.preferredWidth: 13
-                                    Layout.minimumWidth: 13
-
-                                    Layout.minimumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.maximumHeight: 30
-
-                                    text: qsTr("Id")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                TextField {
-                                    id: currentRingID
-
-                                    property var backgroundColor: "transparent"
-                                    property var borderColor: "transparent"
-
-                                    Layout.fillWidth: true
-
-                                    Layout.minimumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.maximumHeight: 30
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-                                    font.bold: true
-
-                                    readOnly: true
-                                    selectByMouse: true
-
-                                    text: { refreshVariable
-                                            return ClientWrapper.settingsAdaptor.getCurrentAccount_Profile_Info_Uri()}
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-
-                                    background: Rectangle {
-                                        anchors.fill: parent
-                                        radius: 0
-                                        border.color: currentRingID.borderColor
-                                        border.width: 0
-                                        color: currentRingID.backgroundColor
-                                    }
-                                }
-                            }
-
-                            RowLayout {
-                                spacing: 6
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 32
-
-                                Layout.leftMargin: 20
-
-                                layoutDirection: Qt.LeftToRight
-
-                                Label {
-                                    id: lblRegisteredName
-
-                                    Layout.maximumWidth: 127
-                                    Layout.preferredWidth: 127
-                                    Layout.minimumWidth: 127
-
-                                    Layout.minimumHeight: 32
-                                    Layout.preferredHeight: 32
-                                    Layout.maximumHeight: 32
-
-                                    text: qsTr("Registered name")
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                RowLayout {
-                                    spacing: 6
-                                    Layout.fillWidth: true
-                                    Layout.maximumHeight: 30
-                                    Layout.alignment: Qt.AlignVCenter
-
-                                    TextField {
-                                        id: currentRegisteredID
-
-                                        Layout.maximumWidth: 300
-                                        Layout.preferredWidth: 300
-                                        Layout.minimumWidth: 300
-
-                                        Layout.minimumHeight: 30
-                                        Layout.preferredHeight: 30
-                                        Layout.maximumHeight: 30
-
-                                        placeholderText: { refreshVariable
-                                                           var result = registeredIdNeedsSet ? qsTr("Type here to register a username") : ""
-                                                           return result}
-
-                                        text: {
-                                            refreshVariable
-                                            if (!registeredIdNeedsSet){
-                                                return ClientWrapper.settingsAdaptor.get_CurrentAccountInfo_RegisteredName()
-                                            } else {
-                                                return ""
-                                            }
-                                        }
-                                        selectByMouse: true
-                                        readOnly: { refreshVariable
-                                                    return !registeredIdNeedsSet}
-
-                                        font.pointSize: 10
-                                        font.kerning: true
-                                        font.bold: { refreshVariable
-                                            return !registeredIdNeedsSet}
-
-                                        horizontalAlignment: Text.AlignLeft
-                                        verticalAlignment: Text.AlignVCenter
-
-                                        background: Rectangle {
-                                            anchors.fill: parent
-                                            radius: {refreshVariable
-                                                     var result = registeredIdNeedsSet ? height / 2 : 0
-                                                     return result}
-                                            border.color: "transparent"
-                                            border.width: {refreshVariable
-                                                           var result = registeredIdNeedsSet ? 2 : 0
-                                                           return result}
-                                            color: {refreshVariable
-                                                    var result = registeredIdNeedsSet ? Qt.rgba(
-                                                                              240 / 256, 240 / 256,
-                                                                              240 / 256,
-                                                                              1.0) : "transparent"
-                                                    return result}
-                                        }
-
-                                        onTextEdited: {
-                                            verifyRegisteredNameSlot()
-                                        }
-
-                                        onEditingFinished: {
-                                            verifyRegisteredNameSlot()
-                                        }
-                                    }
-
-                                    LookupStatusLabel {
-                                        id: lookupStatusLabel
-
-                                        visible:{refreshVariable
-                                                 var result = registeredIdNeedsSet
-                                                 && (regNameUi
-                                                     !== CurrentAccountSettingsScrollPage.BLANK)
-                                                    return result}
-
-                                        MouseArea {
-                                            id: lookupStatusLabelArea
-                                            anchors.fill: parent
-                                            property bool isHovering: false
-
-                                            onEntered: isHovering = true
-                                            onExited: isHovering = false
-
-                                            hoverEnabled: true
-                                        }
-
-                                        ToolTip.visible: lookupStatusLabelArea.isHovering
-                                        ToolTip.text: {
-                                            switch (regNameUi) {
-                                            case CurrentAccountSettingsScrollPage.BLANK:
-                                                return qsTr("")
-                                            case CurrentAccountSettingsScrollPage.INVALIDFORM:
-                                                return qsTr("A registered name should not have any spaces and must be at least three letters long")
-                                            case CurrentAccountSettingsScrollPage.TAKEN:
-                                                return qsTr("This name is already taken")
-                                            case CurrentAccountSettingsScrollPage.FREE:
-                                                return qsTr("Register this name")
-                                            case CurrentAccountSettingsScrollPage.SEARCHING:
-                                                return qsTr("")
-                                            default:
-                                                return qsTr("")
-                                            }
-                                        }
-
-                                        lookupStatusState: {
-                                            switch (regNameUi) {
-                                            case CurrentAccountSettingsScrollPage.BLANK:
-                                                return "Blank"
-                                            case CurrentAccountSettingsScrollPage.INVALIDFORM:
-                                                return "Invalid"
-                                            case CurrentAccountSettingsScrollPage.TAKEN:
-                                                return "Taken"
-                                            case CurrentAccountSettingsScrollPage.FREE:
-                                                return "Free"
-                                            case CurrentAccountSettingsScrollPage.SEARCHING:
-                                                return "Searching"
-                                            default:
-                                                return "Blank"
-                                            }
-                                        }
-                                    }
-
-                                    HoverableRadiusButton {
-                                        id: btnRegisterName
-
-                                        visible: {refreshVariable
-                                                    var result = registeredIdNeedsSet
-                                                 && (regNameUi
-                                                     === CurrentAccountSettingsScrollPage.FREE)
-                                                    return result}
-
-                                        Layout.maximumWidth: 80
-                                        Layout.preferredWidth: 80
-                                        Layout.minimumWidth: 80
-
-                                        Layout.minimumHeight: 30
-                                        Layout.preferredHeight: 30
-                                        Layout.maximumHeight: 30
-
-                                        text: qsTr("Register")
-                                        font.pointSize: 10
-                                        font.kerning: true
-
-                                        radius: height / 2
-                                    }
-
-                                    Item {
-                                        Layout.fillHeight: true
-                                        Layout.fillWidth: true
-                                    }
-                                }
-                            }
-
-                            RowLayout {
-                                spacing: 6
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 30
-
-                                Layout.leftMargin: 20
-
-                                HoverableButtonTextItem {
-                                    id: passwdPushButton
-
-                                    visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
-
-                                    Layout.maximumWidth: 261
-                                    Layout.preferredWidth: 261
-                                    Layout.minimumWidth: 261
-
-                                    Layout.minimumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.maximumHeight: 30
-                                    text: ClientWrapper.accountAdaptor.hasPassword() ? qsTr("Change Password") : qsTr("Set Password")
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    radius: height / 2
-
-                                    onClicked: {
-                                        passwordClicked()
-                                    }
-                                }
-
-                                Item {
-                                    Layout.fillHeight: true
-                                    Layout.fillWidth: true
-                                }
-                            }
-
-                            RowLayout {
-                                spacing: 6
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 30
-
-                                Layout.leftMargin: 20
-
-                                HoverableButtonTextItem {
-                                    id: btnExportAccount
-
-                                    visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
-
-                                    Layout.maximumWidth: 261
-                                    Layout.preferredWidth: 261
-                                    Layout.minimumWidth: 261
-
-                                    Layout.minimumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.maximumHeight: 30
-
-                                    text: qsTr("Export Account")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    radius: height / 2
-
-                                    onClicked: {
-                                        exportAccountSlot()
-                                    }
-                                }
-
-                                Item {
-                                    Layout.fillHeight: true
-                                    Layout.fillWidth: true
-                                }
-                            }
-
-                            RowLayout {
-                                spacing: 6
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 30
-
-                                Layout.leftMargin: 20
-
-                                HoverableButtonTextItem {
-                                    id: btnDeletAccount
-
-                                    backgroundColor: "red"
-                                    onEnterColor: Qt.rgba(150 / 256, 0, 0, 0.7)
-                                    onDisabledBackgroundColor: Qt.rgba(
-                                                                   255 / 256,
-                                                                   0, 0, 0.8)
-                                    onPressColor: backgroundColor
-                                    textColor: "white"
-
-                                    Layout.maximumWidth: 261
-                                    Layout.preferredWidth: 261
-                                    Layout.minimumWidth: 261
-
-                                    Layout.minimumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.maximumHeight: 30
-
-                                    text: qsTr("Delete Account")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    radius: height / 2
-
-                                    onClicked: {
-                                        delAccountSlot()
-                                    }
-                                }
-
-                                Item {
-                                    Layout.fillHeight: true
-                                    Layout.fillWidth: true
-                                }
-                            }
-                        }
-                    }
-
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.minimumHeight: 20
-                        Layout.preferredHeight: 20
-                        Layout.maximumHeight: 20
-                    }
-
-                    ColumnLayout {
-                        Layout.fillWidth: true
-
-                        Label {
-                            Layout.fillWidth: true
-
-                            Layout.maximumHeight: 27
-                            Layout.preferredHeight: 27
-                            Layout.minimumHeight: 27
-
-                            text: qsTr("Linked Device")
-                            font.pointSize: 13
+                            font.pointSize: JamiTheme.textFontSize
                             font.kerning: true
+                            font.bold: true
+
+                            readOnly: true
+                            selectByMouse: true
+
+                            text: { currentRingIDText.elidedText }
+
+                            horizontalAlignment: Text.AlignRight
+                            verticalAlignment: Text.AlignVCenter
+
+                            background: Rectangle {
+                                anchors.fill: parent
+                                radius: 0
+                                border.color: currentRingID.borderColor
+                                border.width: 0
+                                color: currentRingID.backgroundColor
+                            }
+
+                            TextMetrics {
+                                id: currentRingIDText
+
+                                elide: Text.ElideRight
+                                elideWidth: accountViewRect.width - idLabel.width -JamiTheme.preferredMarginSize*3
+
+                                text: { refreshVariable
+                                    return ClientWrapper.settingsAdaptor.getCurrentAccount_Profile_Info_Uri()
+                                }
+                            }
+                        }
+                    }
+
+                    RowLayout {
+                        spacing: 8
+                        Layout.fillWidth: true
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                        ElidedTextLabel {
+                            id: lblRegisteredName
+                            Layout.fillWidth: true
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                            eText: qsTr("Registered name")
+                            fontSize: JamiTheme.settingsFontSize
+                            maxWidth: 160
+                        }
+
+                        TextField {
+                            id: currentRegisteredID
+                            Layout.minimumWidth: preferredColumnWidth
+                            Layout.preferredWidth: preferredColumnWidth
+                            Layout.maximumWidth: preferredColumnWidth
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                            placeholderText: { refreshVariable
+                                               var result = registeredIdNeedsSet ? qsTr("Type here to register a username") : ""
+                                               return result}
+
+                            text: {
+                                refreshVariable
+                                if (!registeredIdNeedsSet){
+                                    return ClientWrapper.settingsAdaptor.get_CurrentAccountInfo_RegisteredName()
+                                } else {
+                                    return ""
+                                }
+                            }
+                            selectByMouse: true
+                            readOnly: { refreshVariable
+                                        return !registeredIdNeedsSet}
+
+                            font.pointSize: JamiTheme.settingsFontSize
+                            font.kerning: true
+                            font.bold: { refreshVariable
+                                return !registeredIdNeedsSet}
 
                             horizontalAlignment: Text.AlignLeft
                             verticalAlignment: Text.AlignVCenter
-                        }
 
-                        Item {
-                            Layout.fillHeight: true
-
-                            Layout.maximumWidth: 10
-                            Layout.preferredWidth: 10
-                            Layout.minimumWidth: 10
-                        }
-
-                        ColumnLayout {
-                            spacing: 7
-
-                            Layout.fillWidth: true
-
-                            ListViewJami {
-                                id: settingsListView
-
-                                Layout.leftMargin: 20
-
-                                Layout.fillWidth: true
-
-                                Layout.minimumWidth: 580
-                                Layout.preferredWidth: 605
-
-                                Layout.minimumHeight: 164
-                                Layout.preferredHeight: 164
-                                Layout.maximumHeight: 164
-
-                                model: deviceItemListModel
-
-                                delegate: DeviceItemDelegate{
-                                    id: settingsListDelegate
-
-                                    width: settingsListView.width
-                                    height: 85
-
-                                    deviceName : DeviceName
-                                    deviceId: DeviceID
-                                    isCurrent: IsCurrent
-
-                                    onClicked: {
-                                        settingsListView.currentIndex = index
-                                    }
-
-                                    onBtnRemoveDeviceClicked:{
-                                        removeDeviceSlot(index)
-                                    }
-                                }
+                            background: Rectangle {
+                                anchors.fill: parent
+                                radius: {refreshVariable
+                                         var result = registeredIdNeedsSet ? height / 2 : 0
+                                         return result}
+                                border.color: "transparent"
+                                border.width: {refreshVariable
+                                               var result = registeredIdNeedsSet ? 2 : 0
+                                               return result}
+                                color: {refreshVariable
+                                        var result = registeredIdNeedsSet ? Qt.rgba(
+                                                                  240 / 256, 240 / 256,
+                                                                  240 / 256,
+                                                                  1.0) : "transparent"
+                                        return result}
                             }
 
-                            HoverableRadiusButton {
-                                id: linkDevPushButton
+                            onTextEdited: {
+                                verifyRegisteredNameSlot()
+                            }
 
-                                visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
-
-                                Layout.leftMargin: 20
-
-                                Layout.fillWidth: true
-
-                                Layout.maximumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.minimumHeight: 30
-
-                                radius: height / 2
-
-                                text: qsTr("+Link Another Device")
-                                font.pointSize: 10
-                                font.kerning: true
-
-                                onClicked: {
-                                    showLinkDevSlot()
-                                }
+                            onEditingFinished: {
+                                verifyRegisteredNameSlot()
                             }
                         }
                     }
 
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.minimumHeight: 20
-                        Layout.preferredHeight: 20
-                        Layout.maximumHeight: 20
-                    }
-
-                    // banned list view
-                    ColumnLayout {
-                        id: bannedContactsLayoutWidget
-
-                        Layout.fillWidth: true
-                        spacing: 6
-
-                        RowLayout {
-                            Layout.leftMargin: 9
-                            Layout.rightMargin: 8
-                            Layout.topMargin: 1
-
-                            Layout.fillWidth: true
-                            Layout.maximumHeight: 30
-
-                            Label {
-                                Layout.preferredWidth: 164
-                                Layout.minimumWidth: 164
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                text: qsTr("Banned Contact")
-                                font.pointSize: 13
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignLeft
-                                verticalAlignment: Text.AlignVCenter
-                            }
-
-                            Item {
-                                Layout.fillHeight: true
-
-                                Layout.maximumWidth: 10
-                                Layout.preferredWidth: 10
-                                Layout.minimumWidth: 10
-                            }
-
-                            HoverableRadiusButton {
-                                id: bannedContactsBtn
-
-                                Layout.maximumWidth: 30
-                                Layout.preferredWidth: 30
-                                Layout.minimumWidth: 30
-
-                                Layout.minimumHeight: 30
-                                Layout.preferredHeight: 30
-                                Layout.maximumHeight: 30
-
-                                buttonImageHeight: height
-                                buttonImageWidth: height
-
-                                radius: height / 2
-
-                                icon.source: bannedContactsListWidget.visible? "qrc:/images/icons/round-arrow_drop_up-24px.svg" : "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                                icon.height: 32
-                                icon.width: 32
-
-                                onClicked: {
-                                    toggleBannedContacts()
-                                }
-                            }
-
-                            Item {
-                                Layout.fillHeight: true
-                                Layout.fillWidth: true
-                            }
-                        }
-
-                        ColumnLayout {
-                            id: bannedContactsListWidget
-
-                            spacing: 6
-
-                            Layout.leftMargin: 9
-                            Layout.rightMargin: 8
-                            Layout.bottomMargin: 9
-                            Item {
-                                Layout.fillWidth: true
-
-                                Layout.minimumHeight: 10
-                                Layout.preferredHeight: 10
-                                Layout.maximumHeight: 10
-                            }
-
-                            ListViewJami {
-                                id: bannedListWidget
-
-                                Layout.leftMargin: 20
-                                Layout.fillWidth: true
-
-                                Layout.minimumWidth: 580
-
-                                Layout.minimumHeight: 150
-                                Layout.preferredHeight: 150
-                                Layout.maximumHeight: 150
-
-                                model: bannedListModel
-
-                                delegate: BannedItemDelegate{
-                                    id: bannedListDelegate
-
-                                    width: bannedListWidget.width
-                                    height: 74
-
-                                    contactName : ContactName
-                                    contactID: ContactID
-                                    contactPicture_base64: ContactPicture
-
-                                    onClicked: {
-                                        bannedListWidget.currentIndex = index
-                                    }
-
-                                    onBtnReAddContactClicked: {
-                                        unban(index)
-                                    }
-                                }
-                            }
-                        }
-                    }
-
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.minimumHeight: 20
-                        Layout.preferredHeight: 20
-                        Layout.maximumHeight: 20
-                    }
-
                     RowLayout {
                         Layout.fillWidth: true
+                        Layout.alignment: Qt.AlignRight
+                        visible:{refreshVariable
+                                 var result = registeredIdNeedsSet
+                                 && (regNameUi
+                                     !== CurrentAccountSettingsScrollPage.BLANK)
+                                    return result}
 
-                        Layout.minimumHeight: 30
-                        Layout.preferredHeight: 30
-                        Layout.maximumHeight: 30
-
-                        Item {
+                        LookupStatusLabel {
+                            id: lookupStatusLabel
                             Layout.fillWidth: true
-                            Layout.fillHeight: true
+
+
+
+                            MouseArea {
+                                id: lookupStatusLabelArea
+                                anchors.fill: parent
+                                property bool isHovering: false
+
+                                onEntered: isHovering = true
+                                onExited: isHovering = false
+
+                                hoverEnabled: true
+                            }
+
+                            ToolTip.visible: lookupStatusLabelArea.isHovering
+                            ToolTip.text: {
+                                switch (regNameUi) {
+                                case CurrentAccountSettingsScrollPage.BLANK:
+                                    return qsTr("")
+                                case CurrentAccountSettingsScrollPage.INVALIDFORM:
+                                    return qsTr("A registered name should not have any spaces and must be at least three letters long")
+                                case CurrentAccountSettingsScrollPage.TAKEN:
+                                    return qsTr("This name is already taken")
+                                case CurrentAccountSettingsScrollPage.FREE:
+                                    return qsTr("Register this name")
+                                case CurrentAccountSettingsScrollPage.SEARCHING:
+                                    return qsTr("")
+                                default:
+                                    return qsTr("")
+                                }
+                            }
+
+                            lookupStatusState: {
+                                switch (regNameUi) {
+                                case CurrentAccountSettingsScrollPage.BLANK:
+                                    return "Blank"
+                                case CurrentAccountSettingsScrollPage.INVALIDFORM:
+                                    return "Invalid"
+                                case CurrentAccountSettingsScrollPage.TAKEN:
+                                    return "Taken"
+                                case CurrentAccountSettingsScrollPage.FREE:
+                                    return "Free"
+                                case CurrentAccountSettingsScrollPage.SEARCHING:
+                                    return "Searching"
+                                default:
+                                    return "Blank"
+                                }
+                            }
                         }
 
-                        HoverableRadiusButton {
-                            id: advancedAccountSettingsPButton
+                        HoverableButtonTextItem {
+                            id: btnRegisterName
 
-                            Layout.minimumWidth: 180
+                            visible: {refreshVariable
+                                        var result = registeredIdNeedsSet
+                                     && (regNameUi
+                                         === CurrentAccountSettingsScrollPage.FREE)
+                                        return result}
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.minimumWidth: preferredColumnWidth
+                            Layout.preferredWidth: preferredColumnWidth
+                            Layout.maximumWidth: preferredColumnWidth
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                            text: qsTr("Register")
+                            font.pointSize: JamiTheme.buttonFontSize
+                            font.kerning: true
+
+                            radius: height / 2
+                        }
+                    }
+                }
+
+                /*
+                 * Buttons Pwd, Export, Delete
+                 */
+                ColumnLayout {
+                    Layout.fillWidth: true
+                    Layout.alignment: Qt.AlignHCenter
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    spacing: 8
+
+                    HoverableButtonTextItem {
+                        id: passwdPushButton
+
+                        visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
+
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                        Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        text: ClientWrapper.accountAdaptor.hasPassword() ? qsTr("Change Password") : qsTr("Set Password")
+
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+
+                        radius: height / 2
+
+                        onClicked: {
+                            passwordClicked()
+                        }
+                    }
+
+                    HoverableButtonTextItem {
+                        id: btnExportAccount
+
+                        visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
+
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                        Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        text: qsTr("Export Account")
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+
+                        radius: height / 2
+
+                        onClicked: {
+                            exportAccountSlot()
+                        }
+                    }
+
+                   HoverableButtonTextItem {
+                        id: btnDeletAccount
+
+                        backgroundColor: "red"
+                        onEnterColor: Qt.rgba(150 / 256, 0, 0, 0.7)
+                        onDisabledBackgroundColor: Qt.rgba(
+                                                       255 / 256,
+                                                       0, 0, 0.8)
+                        onPressColor: backgroundColor
+                        textColor: "white"
+
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                        Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        text: qsTr("Delete Account")
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+
+                        radius: height / 2
+
+                        onClicked: {
+                            delAccountSlot()
+                        }
+                    }
+                }
+
+                /*
+                 Linked devices
+                 */
+                ColumnLayout {
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    Label {
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        text: qsTr("Linked Devices")
+
+                        font.pointSize: JamiTheme.headerFontSize
+                        font.kerning: true
+                    }
+
+                    ColumnLayout {
+                        id: linkedDevicesLayout
+                        Layout.fillWidth: true
+
+                        ListViewJami {
+                            id: settingsListView
+
+                            Layout.fillWidth: true
+
+                            Layout.minimumHeight: 160
+                            Layout.preferredHeight: 160
+                            Layout.maximumHeight: 160
+
+                            model: deviceItemListModel
+
+                            delegate: DeviceItemDelegate{
+                                id: settingsListDelegate
+
+                                width: settingsListView.width
+                                height: 72
+
+                                deviceName : DeviceName
+                                deviceId: DeviceID
+                                isCurrent: IsCurrent
+
+                                onClicked: {
+                                    settingsListView.currentIndex = index
+                                }
+
+                                onBtnRemoveDeviceClicked:{
+                                    removeDeviceSlot(index)
+                                }
+                            }
+                        }
+
+                        HoverableButtonTextItem {
+                            id: linkDevPushButton
+
+                            visible: ClientWrapper.settingsAdaptor.getAccountConfig_Manageruri() === ""
+
+                            Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                            Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                            Layout.minimumWidth: JamiTheme.preferredButtonWidth
+
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.alignment: Qt.AlignHCenter
 
                             radius: height / 2
 
-                            text: qsTr("Advanced Account Settings")
-                            font.pointSize: 10
+                            text: qsTr("+ Link Another Device")
+                            font.pointSize: JamiTheme.textFontSize
                             font.kerning: true
 
-                            icon.source: {
-                                if (advanceSettingsView.visible) {
-                                    return "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                                } else {
-                                    return "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                                }
-                            }
-
-                            icon.height: 24
-                            icon.width: 24
-
                             onClicked: {
-                                advanceSettingsView.visible = !advanceSettingsView.visible
-                                if (advanceSettingsView.visible) {
-                                    advanceSettingsView.updateAccountInfoDisplayedAdvance()
-                                    var mappedCoor = advancedAccountSettingsPButton.mapToItem(accoutnViewLayout,advancedAccountSettingsPButton.x,advancedAccountSettingsPButton.y)
-                                    accoutScrollView.vScrollBar.position = mappedCoor.y / accoutnViewLayout.height
-                                } else {
-                                    accoutScrollView.vScrollBar.position = 0
+                                showLinkDevSlot()
+                            }
+                        }
+                    }
+                }
+
+                /*
+                 * Banned contacts
+                 */
+                ColumnLayout {
+                    id: bannedContactsLayoutWidget
+
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    Layout.alignment: Qt.AlignHCenter
+
+                    spacing: 8
+
+                    RowLayout {
+                        Layout.fillWidth: true
+
+                        ElidedTextLabel {
+
+                            id: lblBannedContacts
+
+                            Layout.fillWidth: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                            eText: qsTr("Banned Contacts")
+                            fontSize: JamiTheme.headerFontSize
+                            maxWidth: accountViewRect.width - bannedContactsBtn.width -JamiTheme.preferredMarginSize*4
+                        }
+
+                        HoverableButtonTextItem {
+                            id: bannedContactsBtn
+
+                            Layout.alignment: Qt.AlignRight
+
+                            Layout.maximumWidth: JamiTheme.preferredFieldHeight
+                            Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                            Layout.minimumWidth: JamiTheme.preferredFieldHeight
+
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                            radius: height / 2
+
+                            source: bannedContactsListWidget.visible? "qrc:/images/icons/round-arrow_drop_up-24px.svg" :
+                                                                      "qrc:/images/icons/round-arrow_drop_down-24px.svg"
+                            onClicked: {
+                                toggleBannedContacts()
+                            }
+                        }
+                    }
+
+
+                    ColumnLayout {
+                        id: bannedContactsListWidget
+
+                        spacing: 8
+                        visible: false
+
+                        ListViewJami {
+                            id: bannedListWidget
+
+                            Layout.fillWidth: true
+
+                            Layout.minimumHeight: 160
+                            Layout.preferredHeight: 160
+                            Layout.maximumHeight: 160
+
+                            model: bannedListModel
+
+                            delegate: BannedItemDelegate{
+                                id: bannedListDelegate
+
+                                width: bannedListWidget.width
+                                height: 74
+
+                                contactName : ContactName
+                                contactID: ContactID
+                                contactPicture_base64: ContactPicture
+
+                                onClicked: {
+                                    bannedListWidget.currentIndex = index
+                                }
+
+                                onBtnReAddContactClicked: {
+                                    unban(index)
                                 }
                             }
                         }
+                    }
+                }
 
-                        Item {
-                            Layout.fillWidth: true
-                            Layout.fillHeight: true
+                /*
+                 * Advanced Settigs Button
+                 */
+
+                RowLayout {
+                    id: rowAdvancedSettingsBtn
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    ElidedTextLabel {
+
+                        id: lblAdvancedAccountSettings
+
+                        Layout.fillWidth: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                        eText: qsTr("Advanced Account Settings")
+
+                        fontSize: JamiTheme.headerFontSize
+                        maxWidth: accountViewRect.width - advancedAccountSettingsPButton.width -JamiTheme.preferredMarginSize*4
+                    }
+
+                    HoverableButtonTextItem {
+                        id: advancedAccountSettingsPButton
+
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                        Layout.minimumWidth: JamiTheme.preferredFieldHeight
+                        Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                        Layout.maximumWidth: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        Layout.alignment: Qt.AlignHCenter
+
+                        radius: height / 2
+
+                        source: {
+                            if (advanceSettingsView.visible) {
+                                return "qrc:/images/icons/round-arrow_drop_up-24px.svg"
+                            } else {
+                                return "qrc:/images/icons/round-arrow_drop_down-24px.svg"
+                            }
+                        }
+
+                        onClicked: {
+                            advanceSettingsView.visible = !advanceSettingsView.visible
+                            if (advanceSettingsView.visible) {
+                                advanceSettingsView.updateAccountInfoDisplayedAdvance()
+                                accountScrollView.vScrollBar.position = rowAdvancedSettingsBtn.y / accountViewLayout.height
+                            } else {
+                                accountScrollView.vScrollBar.position = 0
+                            }
                         }
                     }
                 }
 
-                Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 48
-                    Layout.preferredHeight: 48
-                    Layout.maximumHeight: 48
+                /*
+                 * Advanced Settings
+                 */
+                AdvancedSettingsView {
+                    id: advanceSettingsView
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    visible: false
                 }
 
-                ColumnLayout {
-                    spacing: 6
+                /*
+                 * To keep max width
+                 */
+                Item {
+                    Layout.preferredWidth: accountViewRect.width - 32
+                    Layout.minimumWidth: accountViewRect.width - 32
+                    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView - 32
                     Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.leftMargin: 30
-
-                    // instantiate advance setting page
-                    AdvancedSettingsView {
-                        id: advanceSettingsView
-
-                        Layout.leftMargin: 10
-                        visible: false
-                    }
                 }
             }
         }
-
-        Item {
-            Layout.fillHeight: true
-            Layout.fillWidth: true
-        }
     }
 }
diff --git a/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml b/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml
index 68de1e1..eb5aaab 100644
--- a/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml
+++ b/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml
@@ -27,10 +27,13 @@
 import "../../commoncomponents"
 
 Rectangle {
+    id: sipAccountViewRect
     signal navigateToMainView
     signal navigateToNewWizardView
     signal backArrowClicked
 
+    property int preferredColumnWidth : sipAccountViewRect.width / 2 - 50
+
     function updateAccountInfoDisplayed() {
         displaySIPNameLineEdit.text = ClientWrapper.settingsAdaptor.getCurrentAccount_Profile_Info_Alias()
         usernameSIP.text = ClientWrapper.settingsAdaptor.getAccountConfig_Username()
@@ -54,7 +57,7 @@
     function setAvatar() {
         currentSIPAccountAvatar.setAvatarPixmap(
                     ClientWrapper.settingsAdaptor.getAvatarImage_Base64(
-                        currentSIPAccountAvatar.boothWidht),
+                        currentSIPAccountAvatar.boothWidth),
                     ClientWrapper.settingsAdaptor.getIsDefaultAvatar())
     }
 
@@ -91,47 +94,30 @@
     }
 
     Layout.fillHeight: true
-    Layout.fillWidth: true
+    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView
+    anchors.centerIn: parent
 
     ColumnLayout {
-        anchors.fill: parent
-        spacing: 0
-
-        Item {
-            Layout.fillWidth: true
-
-            Layout.maximumHeight: 10
-            Layout.minimumHeight: 10
-            Layout.preferredHeight: 10
-
-            Layout.alignment: Qt.AlignTop
-        }
+        anchors.fill: sipAccountViewRect
 
         RowLayout {
-            spacing: 6
-
-            Layout.alignment: Qt.AlignTop
-
+            id: sipAccountPageTitle
+            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
+            Layout.leftMargin: JamiTheme.preferredMarginSize
             Layout.fillWidth: true
-            Layout.maximumHeight: 31
-            Layout.minimumHeight: 0
-            Layout.preferredHeight: accountPageTitleSIP.height
-
-            Item {
-                Layout.fillHeight: true
-
-                Layout.maximumWidth: 48
-                Layout.preferredWidth: 48
-                Layout.minimumWidth: 48
-            }
+            Layout.maximumHeight: 64
+            Layout.minimumHeight: 64
+            Layout.preferredHeight: 64
 
             HoverableButton {
+                id: backToSettingsMenuButton
 
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
-                Layout.preferredWidth: 30
-                Layout.preferredHeight: 30
+                Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.rightMargin: JamiTheme.preferredMarginSize
 
-                radius: 30
+                radius: 32
                 source: "qrc:/images/icons/ic_arrow_back_24px.svg"
                 backgroundColor: "white"
                 onExitColor: "white"
@@ -143,510 +129,376 @@
                 }
             }
 
-            Label {
-                id: accountPageTitleSIP
-
-                Layout.preferredWidth: 133
-
-                Layout.preferredHeight: 31
-                Layout.minimumHeight: 25
-
-                text: qsTr("SIP Account")
-
-                font.pointSize: 15
-                font.kerning: true
-
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
-            }
-
-            Item {
+            ElidedTextLabel {
                 Layout.fillWidth: true
-                Layout.fillHeight: true
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                eText: qsTr("Account Settings")
+                fontSize: JamiTheme.titleFontSize
+                maxWidth: !backToSettingsMenuButton.visible ? sipAccountViewRect.width - 100 :
+                                                              sipAccountViewRect.width - backToSettingsMenuButton.width - 100
+
             }
         }
 
         ScrollView {
-            id: accountSIPScrollView
+            id: sipAccountScrollView
 
-            property ScrollBar hScrollBar: ScrollBar.horizontal
             property ScrollBar vScrollBar: ScrollBar.vertical
 
             Layout.fillHeight: true
             Layout.fillWidth: true
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
 
-            ScrollBar.horizontal.policy: ScrollBar.AsNeeded
+            width: sipAccountViewRect.width
+            height: sipAccountViewRect.height - sipAccountPageTitle.height
+
+            ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
             ScrollBar.vertical.policy: ScrollBar.AsNeeded
 
-            font.pointSize: 8
-            font.kerning: true
             clip: true
 
             ColumnLayout {
                 id: accountSIPLayout
 
                 Layout.fillHeight: true
-                Layout.maximumWidth: 598
+                Layout.preferredWidth: sipAccountViewRect.width
+                Layout.alignment: Qt.AlignHCenter
 
-                Item {
-                    Layout.fillHeight: true
+                spacing: 24
 
-                    Layout.maximumWidth: 30
-                    Layout.preferredWidth: 30
-                    Layout.minimumWidth: 30
+                ToggleSwitch {
+                    id: accountSIPEnableCheckBox
+
+                    Layout.topMargin: JamiTheme.preferredMarginSize
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    labelText: qsTr("Enable")
+                    fontPointSize: JamiTheme.headerFontSize
+
+                    onSwitchToggled: {
+                        setAccEnableSlot(checked)
+                    }
                 }
 
                 ColumnLayout {
-                    spacing: 6
-                    Layout.fillHeight: true
                     Layout.fillWidth: true
+                    Layout.fillHeight: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    spacing: 8
 
-                    Layout.leftMargin: 48
+                    Label {
+                        Layout.fillWidth: true
 
-                    Item {
-                        Layout.fillHeight: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                        Layout.maximumWidth: 24
-                        Layout.preferredWidth: 24
-                        Layout.minimumWidth: 24
+                        text: qsTr("Profile")
+                        font.pointSize: JamiTheme.headerFontSize
+                        font.kerning: true
+
+                        horizontalAlignment: Text.AlignLeft
+                        verticalAlignment: Text.AlignVCenter
                     }
 
-                    ToggleSwitch {
-                        id: accountSIPEnableCheckBox
+                    PhotoboothView {
+                        id: currentSIPAccountAvatar
 
-                        labelText: qsTr("Enable")
-                        fontPointSize: 10
+                        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
 
-                        onSwitchToggled: {
-                            setAccEnableSlot(checked)
+                        boothWidth: Math.min(224, sipAccountViewRect.width - 100)
+
+                        Layout.maximumWidth: boothWidth+50
+                        Layout.preferredWidth: boothWidth+50
+                        Layout.minimumWidth: boothWidth+50
+                        Layout.maximumHeight: boothWidth+50
+                        Layout.preferredHeight: boothWidth+50
+                        Layout.minimumHeight: boothWidth+50
+
+                        onImageAcquired: {
+                            ClientWrapper.settingsAdaptor.setCurrAccAvatar(imgBase64)
+                        }
+
+                        onImageCleared: {
+                            ClientWrapper.settingsAdaptor.clearCurrentAvatar()
+                            setAvatar()
                         }
                     }
 
-                    Item {
-                        Layout.fillHeight: true
+                    InfoLineEdit {
+                        id: displaySIPNameLineEdit
 
-                        Layout.maximumWidth: 20
-                        Layout.preferredWidth: 20
-                        Layout.minimumWidth: 20
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        Layout.alignment: Qt.AlignHCenter
+
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+
+                        horizontalAlignment: Text.AlignHCenter
+                        verticalAlignment: Text.AlignVCenter
+
+                        onEditingFinished: {
+                            ClientWrapper.accountAdaptor.setCurrAccDisplayName(
+                                        displaySIPNameLineEdit.text)
+                        }
                     }
+                }
 
-                    ColumnLayout {
+
+                ColumnLayout {
+                    Layout.fillWidth: true
+                    Layout.alignment: Qt.AlignHCenter
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    spacing: 8
+
+                    ElidedTextLabel {
                         Layout.fillWidth: true
 
-                        Label {
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                        eText: qsTr("Identity")
+                        maxWidth: sipAccountViewRect.width - 72
+                        fontSize: JamiTheme.headerFontSize
+                    }
+
+
+                    GridLayout {
+                        rows: 4
+                        columns: 2
+                        flow: GridLayout.LeftToRight
+                        rowSpacing: 8
+                        columnSpacing: 6
+
+                        Layout.fillWidth: true
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                        // user name
+                        ElidedTextLabel {
                             Layout.fillWidth: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.maximumHeight: 21
-                            Layout.preferredHeight: 21
-                            Layout.minimumHeight: 21
+                            eText: qsTr("Username")
+                            fontSize: JamiTheme.settingsFontSize
+                            maxWidth: preferredColumnWidth
+                        }
 
-                            text: qsTr("Profile")
-                            font.pointSize: 13
+                        InfoLineEdit {
+                            id: usernameSIP
+
+                            fieldLayoutWidth: preferredColumnWidth
+
+                            font.pointSize: JamiTheme.settingsFontSize // Albert: buttonSize?
                             font.kerning: true
 
                             horizontalAlignment: Text.AlignLeft
                             verticalAlignment: Text.AlignVCenter
-                        }
 
-                        Item {
-                            Layout.fillWidth: true
-
-                            Layout.maximumHeight: 10
-                            Layout.preferredHeight: 10
-                            Layout.minimumHeight: 10
-                        }
-
-                        ColumnLayout {
-                            Layout.fillWidth: true
-                            layoutDirection: Qt.LeftToRight
-
-                            spacing: 6
-
-                            PhotoboothView {
-                                id: currentSIPAccountAvatar
-
-                                Layout.alignment: Qt.AlignHCenter
-
-                                Layout.maximumWidth: 261
-                                Layout.preferredWidth: 261
-                                Layout.minimumWidth: 261
-                                Layout.maximumHeight: 261
-                                Layout.preferredHeight: 261
-                                Layout.minimumHeight: 261
-
-                                Layout.leftMargin: 20
-
-                                onImageAcquired: {
-                                    ClientWrapper.settingsAdaptor.setCurrAccAvatar(imgBase64)
-                                }
-
-                                onImageCleared: {
-                                    ClientWrapper.settingsAdaptor.clearCurrentAvatar()
-                                    setAvatar()
-                                }
-                            }
-
-                            InfoLineEdit {
-                                id: displaySIPNameLineEdit
-
-                                fieldLayoutWidth: 261
-
-                                Layout.leftMargin: 20
-
-                                font.pointSize: 10
-                                font.kerning: true
-
-                                horizontalAlignment: Text.AlignHCenter
-                                verticalAlignment: Text.AlignVCenter
-
-                                onEditingFinished: {
-                                    ClientWrapper.accountAdaptor.setCurrAccDisplayName(
-                                                displaySIPNameLineEdit.text)
-                                }
+                            onEditingFinished: {
+                                ClientWrapper.settingsAdaptor.setAccountConfig_Username(
+                                            usernameSIP.text)
                             }
                         }
-                    }
 
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.maximumHeight: 20
-                        Layout.preferredHeight: 20
-                        Layout.minimumHeight: 20
-                    }
-
-                    ColumnLayout {
-                        Layout.fillWidth: true
-                        spacing: 6
-
-                        Label {
+                        // host name
+                        ElidedTextLabel {
                             Layout.fillWidth: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.maximumHeight: 27
-                            Layout.preferredHeight: 27
-                            Layout.minimumHeight: 27
+                            eText: qsTr("Hostname")
+                            fontSize: JamiTheme.settingsFontSize
+                            maxWidth: preferredColumnWidth
+                        }
 
-                            text: qsTr("Identity")
-                            font.pointSize: 13
+                        InfoLineEdit {
+                            id: hostnameSIP
+
+                            fieldLayoutWidth: preferredColumnWidth
+
+                            font.pointSize: JamiTheme.settingsFontSize // Albert: button?
                             font.kerning: true
 
                             horizontalAlignment: Text.AlignLeft
                             verticalAlignment: Text.AlignVCenter
-                        }
 
-                        Item {
-                            Layout.fillWidth: true
-
-                            Layout.maximumHeight: 10
-                            Layout.preferredHeight: 10
-                            Layout.minimumHeight: 10
-                        }
-
-                        ColumnLayout {
-                            Layout.fillWidth: true
-                            spacing: 6
-
-                            GridLayout {
-                                rows: 4
-                                columns: 2
-                                flow: GridLayout.LeftToRight
-                                rowSpacing: 14
-                                columnSpacing: 6
-
-                                Layout.fillWidth: true
-
-                                Layout.leftMargin: 20
-
-                                // user name
-                                Label {
-                                    Layout.maximumWidth: 76
-                                    Layout.preferredWidth: 76
-                                    Layout.minimumWidth: 76
-
-                                    Layout.maximumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.minimumHeight: 30
-
-                                    text: qsTr("Username")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                InfoLineEdit {
-                                    id: usernameSIP
-
-                                    fieldLayoutWidth: 300
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-
-                                    onEditingFinished: {
-                                        ClientWrapper.settingsAdaptor.setAccountConfig_Username(
-                                                    usernameSIP.text)
-                                    }
-                                }
-
-                                // host name
-                                Label {
-                                    Layout.maximumWidth: 76
-                                    Layout.preferredWidth: 76
-                                    Layout.minimumWidth: 76
-
-                                    Layout.maximumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.minimumHeight: 30
-
-                                    text: qsTr("Hostname")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                InfoLineEdit {
-                                    id: hostnameSIP
-
-                                    fieldLayoutWidth: 300
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-
-                                    onEditingFinished: {
-                                        ClientWrapper.settingsAdaptor.setAccountConfig_Hostname(
-                                                    hostnameSIP.text)
-                                    }
-                                }
-
-                                // proxy
-                                Label {
-                                    Layout.maximumWidth: 76
-                                    Layout.preferredWidth: 76
-                                    Layout.minimumWidth: 76
-
-                                    Layout.maximumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.minimumHeight: 30
-
-                                    text: qsTr("Proxy")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                InfoLineEdit {
-                                    id: proxySIP
-
-                                    fieldLayoutWidth: 300
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-
-                                    onEditingFinished: {
-                                        ClientWrapper.settingsAdaptor.setAccountConfig_ProxyServer(
-                                                    proxySIP.text)
-                                    }
-                                }
-
-                                // password
-                                Label {
-                                    Layout.maximumWidth: 76
-                                    Layout.preferredWidth: 76
-                                    Layout.minimumWidth: 76
-
-                                    Layout.maximumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.minimumHeight: 30
-
-                                    text: qsTr("Password")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-                                }
-
-                                InfoLineEdit {
-                                    id: passSIPlineEdit
-
-                                    fieldLayoutWidth: 300
-
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    echoMode: TextInput.Password
-                                    horizontalAlignment: Text.AlignLeft
-                                    verticalAlignment: Text.AlignVCenter
-
-                                    onEditingFinished: {
-                                        ClientWrapper.settingsAdaptor.setAccountConfig_Password(
-                                                    passSIPlineEdit.text)
-                                    }
-                                }
-                            }
-
-                            Item {
-                                Layout.fillWidth: true
-
-                                Layout.maximumHeight: 10
-                                Layout.preferredHeight: 10
-                                Layout.minimumHeight: 10
-                            }
-
-                            RowLayout {
-                                Layout.fillWidth: true
-                                Layout.maximumHeight: 30
-                                Layout.leftMargin: 20
-
-                                HoverableButtonTextItem {
-                                    id: btnSIPDeletAccount
-
-                                    backgroundColor: "red"
-                                    onEnterColor: Qt.rgba(150 / 256, 0, 0, 0.7)
-                                    onDisabledBackgroundColor: Qt.rgba(
-                                                                   255 / 256,
-                                                                   0, 0, 0.8)
-                                    onPressColor: backgroundColor
-                                    textColor: "white"
-
-                                    Layout.maximumWidth: 261
-                                    Layout.preferredWidth: 261
-                                    Layout.minimumWidth: 261
-
-                                    Layout.maximumHeight: 30
-                                    Layout.preferredHeight: 30
-                                    Layout.minimumHeight: 30
-
-                                    radius: height / 2
-
-                                    text: qsTr("Delete Account")
-                                    font.pointSize: 10
-                                    font.kerning: true
-
-                                    onClicked: {
-                                        delAccountSlot()
-                                    }
-                                }
-
-                                Item {
-                                    Layout.fillHeight: true
-                                    Layout.fillWidth: true
-                                }
+                            onEditingFinished: {
+                                ClientWrapper.settingsAdaptor.setAccountConfig_Hostname(
+                                            hostnameSIP.text)
                             }
                         }
-                    }
 
-                    Item {
-                        Layout.fillWidth: true
-
-                        Layout.maximumHeight: 40
-                        Layout.preferredHeight: 40
-                        Layout.minimumHeight: 40
-                    }
-
-                    RowLayout {
-                        Layout.fillWidth: true
-
-                        Layout.minimumHeight: 30
-                        Layout.preferredHeight: 30
-                        Layout.maximumHeight: 30
-
-                        Layout.minimumWidth: 598
-                        Layout.preferredWidth: 598
-
-                        Item {
+                        // proxy
+                        ElidedTextLabel {
                             Layout.fillWidth: true
-                            Layout.fillHeight: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                            text: qsTr("Proxy")
+                            font.pointSize: JamiTheme.settingsFontSize
+                            maxWidth: preferredColumnWidth
                         }
 
-                        HoverableRadiusButton {
-                            id: advancedAccountSettingsSIPButton
+                        InfoLineEdit {
+                            id: proxySIP
 
-                            Layout.minimumWidth: 180
+                            fieldLayoutWidth: preferredColumnWidth
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
-
-                            radius: height / 2
-
-                            text: qsTr("Advanced Account Settings")
-                            font.pointSize: 10
+                            font.pointSize: JamiTheme.settingsFontSize // Albert
                             font.kerning: true
 
-                            icon.source: {
-                                if (advanceSIPSettingsView.visible) {
-                                    return "qrc:/images/icons/round-arrow_drop_up-24px.svg"
-                                } else {
-                                    return "qrc:/images/icons/round-arrow_drop_down-24px.svg"
-                                }
-                            }
+                            horizontalAlignment: Text.AlignLeft
+                            verticalAlignment: Text.AlignVCenter
 
-                            icon.height: 24
-                            icon.width: 24
-
-                            onClicked: {
-                                advanceSIPSettingsView.visible = !advanceSIPSettingsView.visible
-                                if(advanceSIPSettingsView.visible){
-                                    advanceSIPSettingsView.updateAccountInfoDisplayedAdvanceSIP()
-                                    var coor = advancedAccountSettingsSIPButton.mapToItem(accountSIPLayout,advancedAccountSettingsSIPButton.x,advancedAccountSettingsSIPButton.y)
-                                     accountSIPScrollView.vScrollBar.position  = coor.y / accountSIPLayout.height
-                                } else {
-                                     accountSIPScrollView.vScrollBar.position = 0
-                                }
+                            onEditingFinished: {
+                                ClientWrapper.settingsAdaptor.setAccountConfig_ProxyServer(
+                                            proxySIP.text)
                             }
                         }
 
-                        Item {
+                        // password
+                        ElidedTextLabel {
                             Layout.fillWidth: true
-                            Layout.fillHeight: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                            eText: qsTr("Password")
+                            fontSize: JamiTheme.settingsFontSize
+                            maxWidth: preferredColumnWidth
+                        }
+
+                        InfoLineEdit {
+                            id: passSIPlineEdit
+
+                            fieldLayoutWidth: preferredColumnWidth
+
+                            font.pointSize: JamiTheme.settingsFontSize
+                            font.kerning: true
+
+                            echoMode: TextInput.Password
+                            horizontalAlignment: Text.AlignLeft
+                            verticalAlignment: Text.AlignVCenter
+
+                            onEditingFinished: {
+                                ClientWrapper.settingsAdaptor.setAccountConfig_Password(
+                                            passSIPlineEdit.text)
+                            }
                         }
                     }
+
+
+                    HoverableButtonTextItem {
+                        id: btnDeletAccount
+
+                        backgroundColor: "red"
+                        onEnterColor: Qt.rgba(150 / 256, 0, 0, 0.7)
+                        onDisabledBackgroundColor: Qt.rgba(
+                                                        255 / 256,
+                                                        0, 0, 0.8)
+                        onPressColor: backgroundColor
+                        textColor: "white"
+
+                        Layout.alignment: Qt.AlignHCenter
+                        Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                        Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                        Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        text: qsTr("Delete Account")
+                        font.pointSize: JamiTheme.textFontSize
+                        font.kerning: true
+                        radius: height / 2
+
+                        onClicked: {
+                            delAccountSlot()
+                        }
+                    }
+                }
+
+                RowLayout {
+                    id: rowAdvancedSettingsBtn
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    ElidedTextLabel {
+
+                        id: lblAdvancedAccountSettings
+
+                        Layout.fillWidth: true
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+
+                        eText: qsTr("Advanced Account Settings")
+                        fontSize: JamiTheme.headerFontSize
+                        maxWidth: sipAccountViewRect.width - advancedAccountSettingsSIPButton.width - 80
+                    }
+
+                    HoverableRadiusButton {
+                        id: advancedAccountSettingsSIPButton
+
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                        Layout.minimumWidth: JamiTheme.preferredFieldHeight
+                        Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                        Layout.maximumWidth: JamiTheme.preferredFieldHeight
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        Layout.alignment: Qt.AlignHCenter
+
+                        radius: height / 2
+
+                        icon.source: {
+                            if (advanceSIPSettingsView.visible) {
+                                return "qrc:/images/icons/round-arrow_drop_up-24px.svg"
+                            } else {
+                                return "qrc:/images/icons/round-arrow_drop_down-24px.svg"
+                            }
+                        }
+
+                        onClicked: {
+                            advanceSIPSettingsView.visible = !advanceSIPSettingsView.visible
+                            if(advanceSIPSettingsView.visible){
+                                advanceSIPSettingsView.updateAccountInfoDisplayedAdvanceSIP()
+                                sipAccountScrollView.vScrollBar.position  = rowAdvancedSettingsBtn.y / accountSIPLayout.height
+                            } else {
+                                sipAccountScrollView.vScrollBar.position = 0
+                            }
+                        }
+                    }
+                }
+
+                // instantiate advance setting page
+                AdvancedSIPSettingsView {
+                    id: advanceSIPSettingsView
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    visible: false
                 }
 
                 Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 48
-                    Layout.preferredHeight: 48
-                    Layout.maximumHeight: 48
-                }
-
-                ColumnLayout {
-                    spacing: 6
+                    Layout.preferredWidth: sipAccountViewRect.width - 32
+                    Layout.minimumWidth: sipAccountViewRect.width - 32
+                    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView - 32
                     Layout.fillHeight: true
-                    Layout.fillWidth: true
-
-                    Layout.leftMargin: 30
-
-                    // instantiate advance setting page
-                    AdvancedSIPSettingsView {
-                        id: advanceSIPSettingsView
-
-                        Layout.leftMargin: 10
-                        visible: false
-                    }
                 }
             }
         }
-
-        Item {
-            Layout.fillHeight: true
-            Layout.fillWidth: true
-        }
     }
 }
diff --git a/src/settingsview/components/DeviceItemDelegate.qml b/src/settingsview/components/DeviceItemDelegate.qml
index f250261..b638360 100644
--- a/src/settingsview/components/DeviceItemDelegate.qml
+++ b/src/settingsview/components/DeviceItemDelegate.qml
@@ -31,152 +31,165 @@
     id: deviceItemDelegate
 
     property string deviceName : ""
-    property string deviceId: ""
+    property string deviceId : ""
     property bool isCurrent : false
 
     property bool editable : false
 
     signal btnRemoveDeviceClicked
 
-    function btnEditDeviceEnter(){
+    function btnEditDeviceEnter() {
         btnEditDevice.enterBtn()
     }
 
-    function btnEditDeviceExit(){
+    function btnEditDeviceExit() {
         btnEditDevice.exitBtn()
     }
 
-    function btnEditPress(){
+    function btnEditPress() {
         btnEditDevice.pressBtn()
     }
 
-    function btnEditRelease(){
+    function btnEditRelease() {
         btnEditDevice.releaseBtn()
     }
 
-    function toggleEditable(){
+    function toggleEditable() {
         editable = !editable
-        if(editable){
-            ClientWrapper.settingsAdaptor.setDeviceName(editDeviceName.text)
+        if (editable) {
+            ClientWrapper.settingsAdaptor.setDeviceName(elidedTextDeviceName.text)
         }
     }
 
     highlighted: ListView.isCurrentItem
 
-    RowLayout{
+    RowLayout {
+        id: layoutDeviceItemDelegate
         anchors.fill: parent
+        spacing: 8
 
-        spacing: 7
+        Image {
+            Layout.leftMargin: 16
+            Layout.alignment: Qt.AlignVCenter
 
-        Label{
-            Layout.leftMargin: 7
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
+            Layout.minimumWidth: 24
+            Layout.preferredWidth: 24
+            Layout.maximumWidth: 24
 
-            Layout.minimumWidth: 30
-            Layout.preferredWidth: 30
-            Layout.maximumWidth: 30
-
-            Layout.minimumHeight: 30
-            Layout.preferredHeight: 30
-            Layout.maximumHeight: 30
-
-            background: Rectangle{
-                anchors.fill: parent
-                Image {
-                    anchors.fill: parent
-                    source: "qrc:/images/icons/baseline-desktop_windows-24px.svg"
-                }
-            }
+            Layout.minimumHeight: 24
+            Layout.preferredHeight: 24
+            Layout.maximumHeight: 24
+            source: "qrc:/images/icons/baseline-desktop_windows-24px.svg"
         }
 
-        ColumnLayout{
+        ColumnLayout {
+            id: col
             Layout.fillWidth: true
-            Layout.fillHeight: true
+            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
+            Layout.leftMargin: 16
 
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
-
-            InfoLineEdit{
-                id: editDeviceName
-
+            RowLayout {
                 Layout.fillWidth: true
-                Layout.minimumWidth: 0
-                Layout.maximumWidth: 16777215
+                Layout.alignment: Qt.AlignVCenter
 
-                Layout.minimumHeight: 30
-                Layout.preferredHeight: 30
-                Layout.maximumHeight: 30
+                InfoLineEdit {
+                    id: editDeviceName
 
-                font.pointSize: 8
-                font.kerning: true
+                    Layout.preferredWidth: col.width - 100
+                    Layout.maximumWidth: col.width - 100
+                    Layout.minimumWidth: col.width - 100
+                    fieldLayoutWidth: col.width - 100
 
-                horizontalAlignment: Text.AlignLeft
-                verticalAlignment: Text.AlignVCenter
+                    Layout.minimumHeight: 24
+                    Layout.preferredHeight: 24
+                    Layout.maximumHeight: 24
 
-                readOnly: !editable
+                    fieldLayoutHeight: 24
 
-                text: deviceName
-            }
-
-            RowLayout{
-                Layout.maximumWidth: editDeviceName.fieldLayoutWidth
-
-                Layout.minimumHeight: 30
-
-                Label{
-                    id: labelDeviceId
-
-                    //Layout.minimumWidth: 71
-                    Layout.minimumHeight: 30
-
-                    font.pointSize: 8
+                    Layout.alignment: Qt.AlignLeft
+                    font.pointSize: JamiTheme.textFontSize
                     font.kerning: true
-                    text: deviceId === "" ? qsTr("Device Id") : deviceId
+
+                    horizontalAlignment: Text.AlignLeft
+                    verticalAlignment: Text.AlignVCenter
+
+                    readOnly: !editable
+
+                    backgroundColor: "white"
+
+                    text: elidedTextDeviceName.elidedText
                 }
 
-                Item{
-                    Layout.fillWidth: true
+                TextMetrics {
+                    id: elidedTextDeviceName
 
-                    Layout.minimumWidth: 0
-                    Layout.minimumHeight: 20
+                    elide: Text.ElideRight
+                    elideWidth: deviceItemDelegate.width - 80
+
+                    text: deviceName
                 }
 
-                Label{
+                Label {
                     id: labelThisDevice
+                    Layout.fillWidth: true
+                    Layout.rightMargin: 16
+                    Layout.minimumHeight: 24
+                    Layout.preferredHeight: 24
+                    Layout.maximumHeight: 24
 
-                    //Layout.minimumWidth: 80
-                    Layout.minimumHeight: 30
+                    Layout.alignment: Qt.AlignRight
+                    horizontalAlignment: Text.AlignRight
+                    verticalAlignment: Text.AlignVCenter
 
                     visible: isCurrent
 
-                    font.pointSize: 8
+                    font.pointSize: JamiTheme.textFontSize
                     font.kerning: true
                     font.italic: true
                     color: "green"
                     text:  qsTr("this device")
                 }
             }
+
+            ElidedTextLabel {
+                id: labelDeviceId
+
+                Layout.fillWidth: true
+
+                Layout.minimumHeight: 24
+                Layout.preferredHeight: 24
+                Layout.maximumHeight: 24
+
+                maxWidth: deviceItemDelegate.width - 80
+                eText: deviceId === "" ? qsTr("Device Id") : deviceId
+            }
+
         }
 
-        HoverableRadiusButton{
+        HoverableRadiusButton {
             id: btnEditDevice
 
-            Layout.topMargin: 7
-            Layout.bottomMargin: 7
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
+            Layout.rightMargin: 8
 
-            Layout.minimumWidth: 30
-            Layout.preferredWidth: 30
-            Layout.maximumWidth: 30
+            Layout.minimumWidth: 32
+            Layout.preferredWidth: 32
+            Layout.maximumWidth: 32
 
-            Layout.minimumHeight: 30
-            Layout.preferredHeight: 30
-            Layout.maximumHeight: 30
+            Layout.minimumHeight: 32
+            Layout.preferredHeight: 32
+            Layout.maximumHeight: 32
 
-            buttonImageHeight: height
-            buttonImageWidth: height
+            buttonImageHeight: height - 8
+            buttonImageWidth: width - 8
 
-            source:{
+            radius: height / 2
+            width: 25
+            height: 25
+
+            backgroundColor: "transparent"
+
+            source: {
                 if(isCurrent) {
                     var path = editable ? "qrc:/images/icons/round-edit-24px.svg" : "qrc:/images/icons/round-save_alt-24px.svg"
                     return path
@@ -188,7 +201,7 @@
             ToolTip.visible: isHovering
             ToolTip.text: {
                 if(isCurrent) {
-                    if(editable){
+                    if (editable) {
                         return qsTr("Edit Device Name")
                     } else {
                         return qsTr("Save new device name")
@@ -206,15 +219,5 @@
                 }
             }
         }
-
-        Item{
-            Layout.rightMargin: 7
-
-            Layout.minimumWidth: 8
-            Layout.preferredWidth: 8
-            Layout.maximumWidth: 8
-
-            Layout.minimumHeight: 20
-        }
     }
 }
diff --git a/src/settingsview/components/GeneralSettingsPage.qml b/src/settingsview/components/GeneralSettingsPage.qml
index 50895fb..008ba6b 100644
--- a/src/settingsview/components/GeneralSettingsPage.qml
+++ b/src/settingsview/components/GeneralSettingsPage.qml
@@ -74,7 +74,7 @@
         updateRecordQualityTimer.restart()
     }
 
-    Timer {
+    Timer{
         id: updateRecordQualityTimer
 
         interval: 500
@@ -148,6 +148,9 @@
     //property AVModel avmodel: ClientWrapper.accountAdaptor.avModel()
     property string recordPath: ClientWrapper.settingsAdaptor.getDir_Document()
 
+    property int preferredColumnWidth : generalSettingsScrollView.width / 2 - 50
+    property int preferredSettingsWidth : generalSettingsScrollView.width - 100
+
     signal backArrowClicked
 
     onDownloadPathChanged: {
@@ -164,512 +167,472 @@
     }
 
     Layout.fillHeight: true
-    Layout.fillWidth: true
+    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView
+    anchors.centerIn: parent
 
-    ScrollView {
-        anchors.fill: parent
-        clip: true
+    ColumnLayout {
+        anchors.fill: generalSettingsRect
 
-        ColumnLayout {
-            spacing: 8
+        RowLayout {
+            id: generalSettingsTitle
+            Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
+            Layout.leftMargin: JamiTheme.preferredMarginSize
+            Layout.fillWidth: true
+            Layout.maximumHeight: 64
+            Layout.minimumHeight: 64
+            Layout.preferredHeight: 64
+
+            HoverableButton {
+                id: backToSettingsMenuButton
+
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+                Layout.preferredWidth: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.rightMargin: JamiTheme.preferredMarginSize
+
+                radius: 32
+                source: "qrc:/images/icons/ic_arrow_back_24px.svg"
+                backgroundColor: "white"
+                onExitColor: "white"
+
+                visible: mainViewWindow.sidePanelHidden
+
+                onClicked: {
+                    backArrowClicked()
+                }
+            }
+
+            Label {
+                Layout.fillWidth: true
+                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                text: qsTr("General")
+                font.pointSize: JamiTheme.titleFontSize
+                font.kerning: true
+
+                horizontalAlignment: Text.AlignLeft
+                verticalAlignment: Text.AlignVCenter
+            }
+
+        }
+
+        ScrollView{
+            id: generalSettingsScrollView
+            property ScrollBar vScrollBar: ScrollBar.vertical
 
             Layout.fillHeight: true
-            Layout.maximumWidth: 580
-            Layout.preferredWidth: 580
-            Layout.minimumWidth: 580
+            Layout.fillWidth: true
 
-            RowLayout {
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
 
-                Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
-                Layout.leftMargin: 16
-                Layout.fillWidth: true
-                Layout.maximumHeight: 64
-                Layout.minimumHeight: 64
-                Layout.preferredHeight: 64
+            width: generalSettingsRect.width
+            height: generalSettingsRect.height - generalSettingsTitle.height
 
-                HoverableButton {
-                    id: backToSettingsMenuButton
+            ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
+            ScrollBar.vertical.policy: ScrollBar.AsNeeded
 
-                    Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
-                    Layout.preferredWidth: 30
-                    Layout.preferredHeight: 30
+            clip: true
 
-                    radius: 30
-                    source: "qrc:/images/icons/ic_arrow_back_24px.svg"
-                    backgroundColor: "white"
-                    onExitColor: "white"
-
-                    visible: mainViewWindow.sidePanelHidden
-
-                    onClicked: {
-                        backArrowClicked()
-                    }
-                }
-
-                Label {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 64
-                    Layout.preferredHeight: 64
-                    Layout.maximumHeight: 64
-
-                    text: qsTr("General")
-                    font.pointSize: JamiTheme.titleFontSize
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-            }
-
-            // system setting panel
             ColumnLayout {
-                spacing: 6
+                Layout.fillHeight: true
                 Layout.fillWidth: true
+                Layout.alignment: Qt.AlignHCenter
 
-                Label {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 21
-                    Layout.preferredHeight: 21
-                    Layout.maximumHeight: 21
+                spacing: 24
 
-                    text: qsTr("System")
-                    font.pointSize: 13
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-
-                Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 10
-                    Layout.preferredHeight: 10
-                    Layout.maximumHeight: 10
-                }
-
+                // system setting panel
                 ColumnLayout {
-                    spacing: 6
+                    spacing: 8
                     Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                    ToggleSwitch {
-                        id: notificationCheckBox
-
-                        Layout.leftMargin: 20
-
-                        labelText: "Enable desktop notifications"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotSetNotifications(checked)
-                        }
-                    }
-
-                    ToggleSwitch {
-                        id: closeOrMinCheckBox
-
-                        Layout.leftMargin: 20
-
-                        labelText: "Keep minimize on close"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotSetClosedOrMin(checked)
-                        }
-                    }
-
-                    ToggleSwitch {
-                        id: applicationOnStartUpCheckBox
-
-                        Layout.leftMargin: 20
-
-                        labelText: "Run on Startup"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotSetRunOnStartUp(checked)
-                        }
-                    }
-
-                    RowLayout {
-                        spacing: 6
-
-                        Layout.leftMargin: 20
+                    Label {
                         Layout.fillWidth: true
-                        Layout.maximumHeight: 30
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        Label {
-                            Layout.fillHeight: true
+                        text: qsTr("System")
+                        font.pointSize: JamiTheme.headerFontSize
+                        font.kerning: true
 
-                            Layout.maximumWidth: 94
-                            Layout.preferredWidth: 94
-                            Layout.minimumWidth: 94
+                        horizontalAlignment: Text.AlignLeft
+                        verticalAlignment: Text.AlignVCenter
+                    }
 
-                            text: qsTr("Download folder")
-                            font.pointSize: 10
-                            font.kerning: true
+                    ColumnLayout {
+                        spacing: 8
+                        Layout.fillWidth: true
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
 
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
-                        }
+                        ToggleSwitch {
+                            id: notificationCheckBox
 
-                        Item {
-                            Layout.fillHeight: true
-                            Layout.fillWidth: true
-                        }
+                            labelText: desktopNotificationsElidedText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
 
-                        HoverableRadiusButton {
-                            id: downloadButton
-
-                            Layout.maximumWidth: 320
-                            Layout.preferredWidth: 320
-                            Layout.minimumWidth: 320
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
-
-                            radius: height / 2
-
-                            icon.source: "qrc:/images/icons/round-folder-24px.svg"
-                            icon.height: 24
-                            icon.width: 24
-
-                            text: downloadPath
-                            fontPointSize: 10
-
-                            onClicked: {
-                                openDownloadFolderSlot()
+                            onSwitchToggled: {
+                                slotSetNotifications(checked)
                             }
                         }
-                    }
-                }
-            }
 
-            Item {
-                Layout.fillWidth: true
-                Layout.minimumHeight: 20
-                Layout.preferredHeight: 20
-                Layout.maximumHeight: 20
-            }
-
-            // call recording setting panel
-            ColumnLayout {
-                spacing: 6
-                Layout.fillWidth: true
-
-                Label {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 21
-                    Layout.preferredHeight: 21
-                    Layout.maximumHeight: 21
-
-                    text: qsTr("Call Recording")
-                    font.pointSize: 13
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-
-                Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 10
-                    Layout.preferredHeight: 10
-                    Layout.maximumHeight: 10
-                }
-
-                ColumnLayout {
-                    spacing: 6
-                    Layout.fillWidth: true
-
-                    ToggleSwitch {
-                        id: alwaysRecordingCheckBox
-
-                        Layout.leftMargin: 20
-
-                        labelText: "Always record calls"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotAlwaysRecordingClicked(checked)
-                        }
-                    }
-
-                    ToggleSwitch {
-                        id: recordPreviewCheckBox
-
-                        Layout.leftMargin: 20
-
-                        labelText: "Record preview video for a call"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotRecordPreviewClicked(checked)
-                        }
-                    }
-
-                    RowLayout {
-                        spacing: 6
-                        Layout.leftMargin: 20
-                        Layout.fillWidth: true
-                        Layout.maximumHeight: 30
-
-                        Label {
-                            Layout.fillHeight: true
-
-                            Layout.maximumWidth: 42
-                            Layout.preferredWidth: 42
-                            Layout.minimumWidth: 42
-
-                            text: qsTr("Quality")
-                            font.pointSize: 10
-                            font.kerning: true
-
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
+                        TextMetrics {
+                            id: desktopNotificationsElidedText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text:  qsTr("Enable desktop notifications")
                         }
 
-                        Item {
-                            Layout.fillHeight: true
+
+                        ToggleSwitch {
+                            id: closeOrMinCheckBox
+
+                            labelText: keepMinimizeElidedText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
+
+                            onSwitchToggled: {
+                                slotSetClosedOrMin(checked)
+                            }
+                        }
+
+                        TextMetrics {
+                            id: keepMinimizeElidedText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text:  qsTr("Keep minimize on close")
+                        }
+
+
+                        ToggleSwitch {
+                            id: applicationOnStartUpCheckBox
+
+                            labelText: runOnStartupElidedText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
+
+                            onSwitchToggled: {
+                                slotSetRunOnStartUp(checked)
+                            }
+                        }
+
+                        TextMetrics {
+                            id: runOnStartupElidedText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text:  qsTr("Run On Startup")
+                        }
+
+                        RowLayout {
+                            spacing: 8
                             Layout.fillWidth: true
-                        }
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        ColumnLayout {
-                            spacing: 0
-                            Layout.fillHeight: true
+                            ElidedTextLabel {
 
-                            Layout.maximumWidth: recordQualityValueLabel.width
-                            Item {
-                                Layout.fillHeight: true
                                 Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+                                eText: qsTr("Downloads folder")
+                                font.pointSize: JamiTheme.settingsFontSize
+                                maxWidth: preferredColumnWidth
                             }
 
+                            HoverableRadiusButton {
+                                id: downloadButton
+
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                Layout.alignment: Qt.AlignRight
+
+                                radius: height / 2
+
+                                icon.source: "qrc:/images/icons/round-folder-24px.svg"
+                                icon.height: 24
+                                icon.width: 24
+
+                                text: downloadPath
+                                fontPointSize: JamiTheme.buttonFontSize
+
+                                onClicked: {
+                                    openDownloadFolderSlot()
+                                }
+                            }
+                        }
+                    }
+                }
+
+                // call recording setting panel
+                ColumnLayout {
+                    spacing: 8
+                    Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                    ElidedTextLabel {
+                        Layout.fillWidth: true
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                        eText: qsTr("Call Recording")
+                        font.pointSize: JamiTheme.headerFontSize
+                        maxWidth: preferredSettingsWidth
+                    }
+
+                    ColumnLayout {
+                        spacing: 8
+                        Layout.fillWidth: true
+                        Layout.leftMargin: JamiTheme.preferredMarginSize
+
+                        ToggleSwitch {
+                            id: alwaysRecordingCheckBox
+
+                            labelText: alwaysRecordElidedText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
+
+                            onSwitchToggled: {
+                                slotAlwaysRecordingClicked(checked)
+                            }
+                        }
+
+                        TextMetrics {
+                            id: alwaysRecordElidedText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text:  qsTr("Always record calls")
+                        }
+
+
+                        ToggleSwitch {
+                            id: recordPreviewCheckBox
+
+                            labelText: recordPreviewElidedText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
+
+                            onSwitchToggled: {
+                                slotRecordPreviewClicked(checked)
+                            }
+                        }
+
+                        TextMetrics {
+                            id: recordPreviewElidedText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text:  qsTr("Record preview video for a call")
+                        }
+
+                        RowLayout {
+                            spacing: 8
+                            Layout.fillWidth: true
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
                             Label {
-                                id: recordQualityValueLabel
 
-                                Layout.minimumWidth: 40
+                                Layout.fillWidth: true
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
 
-                                Layout.minimumHeight: 16
-                                Layout.preferredHeight: 16
-                                Layout.maximumHeight: 16
-
-                                text: qsTr("VALUE ")
-
-                                font.pointSize: 10
+                                text: qsTr("Quality")
+                                font.pointSize: JamiTheme.settingsFontSize
                                 font.kerning: true
 
                                 horizontalAlignment: Text.AlignLeft
                                 verticalAlignment: Text.AlignVCenter
                             }
 
-                            Item {
-                                Layout.fillHeight: true
-                                Layout.fillWidth: true
+                            Label {
+                                id: recordQualityValueLabel
+
+                                Layout.minimumWidth: 50
+                                Layout.preferredWidth: 50
+                                Layout.maximumWidth: 50
+
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                text: qsTr("VALUE ")
+
+                                font.pointSize: JamiTheme.settingsFontSize
+                                font.kerning: true
+
+                                horizontalAlignment: Text.AlignLeft
+                                verticalAlignment: Text.AlignVCenter
+                            }
+
+                            Slider{
+                                id: recordQualitySlider
+
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
+
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
+
+                                from: 0
+                                to: 500
+                                stepSize: 1
+
+                                onMoved: {
+                                    slotRecordQualitySliderValueChanged(value)
+                                }
                             }
                         }
 
-                        Slider {
-                            id: recordQualitySlider
-
-                            Layout.fillHeight: true
-
-                            Layout.maximumWidth: 320
-                            Layout.preferredWidth: 320
-                            Layout.minimumWidth: 320
-
-                            from: 0
-                            to: 500
-                            stepSize: 1
-
-                            onMoved: {
-                                slotRecordQualitySliderValueChanged(value)
-                            }
-                        }
-                    }
-
-                    RowLayout {
-                        spacing: 6
-
-                        Layout.leftMargin: 20
-                        Layout.fillWidth: true
-                        Layout.maximumHeight: 30
-
-                        Label {
-                            Layout.fillHeight: true
-
-                            Layout.maximumWidth: 42
-                            Layout.preferredWidth: 42
-                            Layout.minimumWidth: 42
-
-                            text: qsTr("Save in")
-                            font.pointSize: 10
-                            font.kerning: true
-
-                            horizontalAlignment: Text.AlignLeft
-                            verticalAlignment: Text.AlignVCenter
-                        }
-
-                        Item {
-                            Layout.fillHeight: true
+                        RowLayout {
+                            spacing: 8
                             Layout.fillWidth: true
-                        }
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        HoverableRadiusButton {
-                            id: recordPathButton
+                            Label {
+                                Layout.fillWidth: true
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            Layout.maximumWidth: 320
-                            Layout.preferredWidth: 320
-                            Layout.minimumWidth: 320
+                                text: qsTr("Save in")
+                                font.pointSize: JamiTheme.settingsFontSize
+                                font.kerning: true
 
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                                horizontalAlignment: Text.AlignLeft
+                                verticalAlignment: Text.AlignVCenter
+                            }
 
-                            radius: height / 2
+                            HoverableRadiusButton {
+                                id: recordPathButton
 
-                            icon.source: "qrc:/images/icons/round-folder-24px.svg"
-                            icon.height: 24
-                            icon.width: 24
+                                Layout.leftMargin: JamiTheme.preferredMarginSize
+                                Layout.maximumWidth: preferredColumnWidth
+                                Layout.preferredWidth: preferredColumnWidth
+                                Layout.minimumWidth: preferredColumnWidth
 
-                            text: recordPath
-                            fontPointSize: 10
+                                Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                                Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                                Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                            onClicked: {
-                                openRecordFolderSlot()
+                                Layout.alignment: Qt.AlignRight
+
+                                radius: height / 2
+
+                                icon.source: "qrc:/images/icons/round-folder-24px.svg"
+                                icon.height: 24
+                                icon.width: 24
+
+                                text: recordPath
+                                fontPointSize: JamiTheme.buttonFontSize
+
+                                onClicked: {
+                                    openRecordFolderSlot()
+                                }
                             }
                         }
                     }
                 }
-            }
 
-            Item {
-                Layout.fillWidth: true
-                Layout.minimumHeight: 20
-                Layout.preferredHeight: 20
-                Layout.maximumHeight: 20
-            }
-
-            // update setting panel
-            ColumnLayout {
-                spacing: 6
-                Layout.fillWidth: true
-                visible: Qt.platform.os == "windows"? true : false
-
-                Label {
-                    Layout.fillWidth: true
-                    Layout.minimumHeight: 21
-                    Layout.preferredHeight: 21
-                    Layout.maximumHeight: 21
-
-                    text: qsTr("Updates")
-                    font.pointSize: 13
-                    font.kerning: true
-
-                    horizontalAlignment: Text.AlignLeft
-                    verticalAlignment: Text.AlignVCenter
-                }
-
-                Item {
-                    Layout.fillWidth: true
-
-                    Layout.minimumHeight: 10
-                    Layout.preferredHeight: 10
-                    Layout.maximumHeight: 10
-                }
-
+                // update setting panel
                 ColumnLayout {
-                    spacing: 6
+                    spacing: 8
                     Layout.fillWidth: true
+                    Layout.leftMargin: JamiTheme.preferredMarginSize
+                    visible: Qt.platform.os == "windows"? true : false
 
-                    ToggleSwitch {
-                        id: autoUpdateCheckBox
+                    Label {
+                        Layout.fillWidth: true
+                        Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                        Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
-                        Layout.leftMargin: 20
+                        text: qsTr("Updates")
+                        font.pointSize: JamiTheme.headerFontSize
+                        font.kerning: true
 
-                        labelText: "Check for updates automatically"
-                        fontPointSize: 11
-
-                        onSwitchToggled: {
-                            slotSetUpdateAutomatic(checked)
-                        }
+                        horizontalAlignment: Text.AlignLeft
+                        verticalAlignment: Text.AlignVCenter
                     }
 
-                    RowLayout {
-                        spacing: 6
-
-                        Layout.leftMargin: 20
+                    ColumnLayout {
+                        spacing: 8
                         Layout.fillWidth: true
-                        Layout.maximumHeight: 30
+
+                        ToggleSwitch {
+                            id: autoUpdateCheckBox
+
+                            labelText: autoUpdateText.elidedText
+                            fontPointSize: JamiTheme.settingsFontSize
+
+                            onSwitchToggled: {
+                                slotSetUpdateAutomatic(checked)
+                            }
+                        }
+
+                        TextMetrics {
+                            id: autoUpdateText
+                            elide: Text.ElideRight
+                            elideWidth: preferredSettingsWidth
+                            text: qsTr("Check for updates automatically")
+                        }
 
                         HoverableRadiusButton {
                             id: checkUpdateButton
 
-                            Layout.maximumWidth: 275
-                            Layout.preferredWidth: 275
-                            Layout.minimumWidth: 275
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.alignment: Qt.AlignHCenter
+                            Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                            Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                            Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                             radius: height / 2
 
-                            text: "Check for updates now"
-                            fontPointSize: 10
+                            text: qsTr("Check for updates now")
+                            fontPointSize: JamiTheme.buttonFontSize
 
                             onClicked: {
                                 checkForUpdateSlot()
                             }
                         }
 
-                        Item {
-                            Layout.fillHeight: true
-                            Layout.fillWidth: true
-                        }
-                    }
-
-                    RowLayout {
-                        spacing: 6
-
-                        Layout.leftMargin: 20
-                        Layout.fillWidth: true
-                        Layout.maximumHeight: 30
-
                         HoverableRadiusButton {
                             id: installBetaButton
 
-                            Layout.maximumWidth: 275
-                            Layout.preferredWidth: 275
-                            Layout.minimumWidth: 275
-
-                            Layout.minimumHeight: 30
-                            Layout.preferredHeight: 30
-                            Layout.maximumHeight: 30
+                            Layout.alignment: Qt.AlignHCenter
+                            Layout.maximumWidth: JamiTheme.preferredButtonWidth
+                            Layout.preferredWidth: JamiTheme.preferredButtonWidth
+                            Layout.minimumWidth: JamiTheme.preferredButtonWidth
+                            Layout.minimumHeight: JamiTheme.preferredFieldHeight
+                            Layout.preferredHeight: JamiTheme.preferredFieldHeight
+                            Layout.maximumHeight: JamiTheme.preferredFieldHeight
 
                             radius: height / 2
 
                             text: "Install the latest beta version"
-                            fontPointSize: 10
+                            fontPointSize: JamiTheme.buttonFontSize
 
                             onClicked: {
                                 installBetaSlot()
                             }
                         }
-
-                        Item {
-                            Layout.fillHeight: true
-                            Layout.fillWidth: true
-                        }
                     }
                 }
-            }
 
-            // spacer on the bottom
-            Item {
-                Layout.fillHeight: true
-                Layout.fillWidth: true
+                Item {
+                    Layout.preferredWidth: generalSettingsRect.width - 32
+                    Layout.minimumWidth: generalSettingsRect.width - 32
+                    Layout.maximumWidth: JamiTheme.maximumWidthSettingsView - 32
+                    Layout.fillHeight: true
+                }
             }
         }
     }
diff --git a/src/settingsview/components/IconButton.qml b/src/settingsview/components/IconButton.qml
index 7e992a9..5e40da6 100644
--- a/src/settingsview/components/IconButton.qml
+++ b/src/settingsview/components/IconButton.qml
@@ -56,9 +56,9 @@
         setCheckedState(true, true)
     }
 
-    Layout.minimumHeight: 60
-    Layout.preferredHeight: 60
-    Layout.maximumHeight: 60
+    Layout.minimumHeight: 64
+    Layout.preferredHeight: 64
+    Layout.maximumHeight: 64
 
     Layout.fillWidth: true
 
@@ -92,7 +92,7 @@
                 Layout.fillHeight: true
                 Layout.fillWidth: true
 
-                font.pointSize: 11
+                font.pointSize: JamiTheme.textFontSize+2
                 font.kerning: true
 
                 horizontalAlignment: Text.AlignLeft
diff --git a/src/settingsview/components/SettingParaCombobox.qml b/src/settingsview/components/SettingParaCombobox.qml
index b691acb..dc447a6 100644
--- a/src/settingsview/components/SettingParaCombobox.qml
+++ b/src/settingsview/components/SettingParaCombobox.qml
@@ -23,6 +23,7 @@
 import QtQuick.Layouts 1.3
 import QtGraphicalEffects 1.14
 import QtQuick.Controls.Styles 1.4
+import "../../constant"
 
 ComboBox {
     id: control
@@ -63,7 +64,7 @@
             context.lineTo(width, 0);
             context.lineTo(width / 2, height);
             context.closePath();
-            context.fillStyle = control.pressed ? "#17a81a" : "#21be2b";
+            context.fillStyle = control.pressed ? JamiTheme.pressColor : "black";
             context.fill();
         }
     }
diff --git a/src/settingsview/components/ToggleSwitch.qml b/src/settingsview/components/ToggleSwitch.qml
index 27c84bd..3b9d0f1 100644
--- a/src/settingsview/components/ToggleSwitch.qml
+++ b/src/settingsview/components/ToggleSwitch.qml
@@ -23,9 +23,10 @@
 import QtQuick.Layouts 1.3
 import QtGraphicalEffects 1.14
 import QtQuick.Controls.Styles 1.4
+import "../../commoncomponents"
 
 RowLayout {
-    property string labelText: value
+    property string labelText: ""
     property int widthOfSwitch: 50
     property int heightOfSwitch: 10
     property int heightOfLayout: 30
@@ -36,13 +37,26 @@
 
     signal switchToggled
 
-    spacing: 18
+    spacing: 8
     Layout.fillWidth: true
-    Layout.maximumHeight: 30
+    Layout.maximumHeight: 32
+
+    ElidedTextLabel {
+        Layout.fillWidth: true
+
+        Layout.minimumHeight: heightOfLayout
+        Layout.preferredHeight: heightOfLayout
+        Layout.maximumHeight: heightOfLayout
+
+        eText: qsTr(labelText)
+        fontSize: fontPointSize
+        maxWidth: parent.width - widthOfSwitch
+
+    }
 
     Switch {
         id: switchOfLayout
-        Layout.alignment: Qt.AlignVCenter
+        Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
 
         Layout.maximumWidth: widthOfSwitch
         Layout.preferredWidth: widthOfSwitch
@@ -56,19 +70,4 @@
             switchToggled()
         }
     }
-
-    Label {
-        Layout.fillWidth: true
-
-        Layout.minimumHeight: heightOfLayout
-        Layout.preferredHeight: heightOfLayout
-        Layout.maximumHeight: heightOfLayout
-
-        text: qsTr(labelText)
-        font.pointSize: fontPointSize
-        font.kerning: true
-
-        horizontalAlignment: Text.AlignLeft
-        verticalAlignment: Text.AlignVCenter
-    }
 }