From be5f99a782ff24e4f712274e12bde8ce53f01f5c Mon Sep 17 00:00:00 2001
From: Raul Metsma <raul@metsma.ee>
Date: Tue, 21 May 2024 09:33:15 +0300
Subject: [PATCH] Update Smart/Mobile dialogs with new UI guidlines

IB-7965

Signed-off-by: Raul Metsma <raul@metsma.ee>
---
 client/dialogs/MobileDialog.cpp               |  30 +-
 client/dialogs/MobileDialog.ui                | 424 +++++++++--------
 client/dialogs/SmartIDDialog.cpp              |  21 +-
 client/dialogs/SmartIDDialog.ui               | 425 +++++++++---------
 client/images/icon_checkbox.svg               |   4 +
 client/images/icon_checkbox_active.svg        |   4 +
 client/images/icon_checkbox_check.svg         |   5 +
 client/images/icon_checkbox_check_active.svg  |   5 +
 .../images/icon_checkbox_check_disabled.svg   |   5 +
 client/images/icon_checkbox_check_hover.svg   |  18 +
 client/images/icon_checkbox_disabled.svg      |   4 +
 client/images/icon_checkbox_hover.svg         |  17 +
 client/images/images.qrc                      |   8 +
 client/translations/en.ts                     |  20 -
 client/translations/et.ts                     |  20 -
 client/translations/ru.ts                     |  20 -
 client/widgets/ComboBox.cpp                   |  17 +-
 17 files changed, 547 insertions(+), 500 deletions(-)
 create mode 100644 client/images/icon_checkbox.svg
 create mode 100644 client/images/icon_checkbox_active.svg
 create mode 100644 client/images/icon_checkbox_check.svg
 create mode 100644 client/images/icon_checkbox_check_active.svg
 create mode 100644 client/images/icon_checkbox_check_disabled.svg
 create mode 100644 client/images/icon_checkbox_check_hover.svg
 create mode 100644 client/images/icon_checkbox_disabled.svg
 create mode 100644 client/images/icon_checkbox_hover.svg

diff --git a/client/dialogs/MobileDialog.cpp b/client/dialogs/MobileDialog.cpp
index 00dc68c6a..eb3da4cb0 100644
--- a/client/dialogs/MobileDialog.cpp
+++ b/client/dialogs/MobileDialog.cpp
@@ -22,43 +22,31 @@
 
 #include "IKValidator.h"
 #include "Settings.h"
-#include "Styles.h"
 #include "effects/Overlay.h"
 
-MobileDialog::MobileDialog(QWidget *parent) :
-	QDialog(parent),
-	ui(new Ui::MobileDialog)
+MobileDialog::MobileDialog(QWidget *parent)
+	: QDialog(parent)
+	, ui(new Ui::MobileDialog)
 {
 	static const QStringList countryCodes {QStringLiteral("372"), QStringLiteral("370")};
 	new Overlay(this);
+
 	ui->setupUi(this);
 	setWindowFlags(Qt::Dialog | Qt::CustomizeWindowHint);
-	setFixedSize(size());
 #ifdef Q_OS_WIN
-	ui->buttonLayout->setDirection(QBoxLayout::RightToLeft);
+	ui->layoutButton->setDirection(QBoxLayout::RightToLeft);
 #endif
 
-	QFont condensed = Styles::font(Styles::Condensed, 14);
-	QFont regularFont = Styles::font(Styles::Regular, 14);
-	ui->labelNameId->setFont(Styles::font(Styles::Regular, 16, QFont::DemiBold));
-	ui->labelPhone->setFont(regularFont);
-	ui->labelCode->setFont(regularFont);
-	ui->errorCode->setFont(regularFont);
-	ui->errorPhone->setFont(regularFont);
-	ui->phoneNo->setFont(regularFont);
-	ui->idCode->setFont(regularFont);
-	ui->cbRemember->setFont(regularFont);
-	ui->sign->setFont(condensed);
-	ui->cancel->setFont(condensed);
-
 	// Mobile
 	ui->idCode->setValidator(new NumberValidator(ui->idCode));
 	ui->idCode->setText(Settings::MOBILEID_CODE);
 	ui->idCode->setAttribute(Qt::WA_MacShowFocusRect, false);
+	ui->errorCode->hide();
 	ui->phoneNo->setValidator(new NumberValidator(ui->phoneNo));
 	ui->phoneNo->setText(Settings::MOBILEID_NUMBER.value(countryCodes[0]));
 	ui->phoneNo->setAttribute(Qt::WA_MacShowFocusRect, false);
 	ui->phoneNo->setFocus();
+	ui->errorPhone->hide();
 	ui->cbRemember->setChecked(Settings::MOBILEID_REMEMBER);
 	ui->cbRemember->setAttribute(Qt::WA_MacShowFocusRect, false);
 	auto saveSettings = [this] {
@@ -68,9 +56,9 @@ MobileDialog::MobileDialog(QWidget *parent) :
 		Settings::MOBILEID_NUMBER = checked ? ui->phoneNo->text() : QString();
 	};
 	auto setError = [](QLineEdit *input, QLabel *error, const QString &msg) {
-		input->setStyleSheet(msg.isEmpty() ? QString() :QStringLiteral("border-color: #c53e3e"));
-		error->setFocusPolicy(msg.isEmpty() ? Qt::NoFocus : Qt::TabFocus);
+		input->setStyleSheet(msg.isEmpty() ? QString() : QStringLiteral("border-color: #BE7884"));
 		error->setText(msg);
+		error->setHidden(msg.isEmpty());
 	};
 	connect(ui->idCode, &QLineEdit::returnPressed, ui->sign, &QPushButton::click);
 	connect(ui->idCode, &QLineEdit::textEdited, this, saveSettings);
diff --git a/client/dialogs/MobileDialog.ui b/client/dialogs/MobileDialog.ui
index 16f252047..f012209bd 100644
--- a/client/dialogs/MobileDialog.ui
+++ b/client/dialogs/MobileDialog.ui
@@ -9,8 +9,8 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>382</width>
-    <height>301</height>
+    <width>430</width>
+    <height>477</height>
    </rect>
   </property>
   <property name="windowTitle">
@@ -18,93 +18,156 @@
   </property>
   <property name="styleSheet">
    <string notr="true">QWidget {
+font-family: Roboto, Helvetica;
+font-size: 14px;
+}
+#MobileDialog {
 background-color: #FFFFFF;
-color: #000000;
-border-radius: 2px;
+border-radius: 4px;
+}
+#label {
+color: #003168;
+font-size: 20px;
+font-weight: 700;
 }
 #labelCode, #labelPhone {
-color: #353739
+color: #607496;
+font-weight: 500;
 }
 #errorCode, #errorPhone {
-color: #c53e3e
+color: #AD2A45;
+}
+QLineEdit, QComboBox {
+padding: 10px 14px;
+border: 1px solid #C4CBD8;
+border-radius: 4px;
+color: #07142A;
+placeholder-text-color: #607496;
+font-size: 16px;
+}
+QComboBox QWidget#popup {
+background-color: transparent;
+}
+QComboBox QWidget#content {
+border: 1px solid #C4CBD8;
+border-radius: 4px;
+background-color: #FFFFFF;
+}
+QComboBox QPushButton {
+margin: 3px;
+padding: 0px 12px 0px 4px;
+border: 0px;
+color: #07142A;
+text-align: left;
+font-weight: normal;
+font-size: 16px;
+qproperty-iconSize: 14px 9px;
+qproperty-layoutDirection: RightToLeft;
 }
-QLineEdit {
-padding: 0px 10px;
-border: 1px solid #8E969D;
-border-radius: 2px;
+QComboBox QPushButton#selected {
+qproperty-icon: url(:/images/arrow_up.svg);
+}
+QComboBox QPushButton:hover#selected {
+qproperty-icon: url(:/images/arrow_up_white.svg);
+}
+QComboBox::drop-down {
+background-color: #FFFFFF;
+width: 25px;
+}
+QComboBox::down-arrow {
+image: url(:/images/arrow_down.svg);
+}
+QComboBox::down-arrow:on {
+top: 1px;
+left: 1px;
 }
 QCheckBox {
-color: #353739;
-min-height: 31px;
-spacing: 5px;
+spacing: 8px;
+color: #07142A;
+border: none; /*Workaround for right padding*/
 }
 QCheckBox:disabled {
-color: #727679;
+color: #C4CBD8;
 }
 QCheckBox::indicator {
-width: 14px;
-height: 14px;
+width: 16px;
+height: 16px;
 }
 QCheckBox::indicator:unchecked {
-image: url(:/images/icon_checkbox.png);
+image: url(:/images/icon_checkbox.svg);
+}
+QCheckBox::indicator:unchecked:hover {
+image: url(:/images/icon_checkbox_active.svg);
+}
+QCheckBox::indicator:unchecked:disabled {
+image: url(:/images/icon_checkbox_disabled.svg);
 }
 QCheckBox::indicator:checked {
-image: url(:/images/icon_checkbox_check.png);
+image: url(:/images/icon_checkbox_check.svg);
+}
+QCheckBox::indicator:checked:hover {
+image: url(:/images/icon_checkbox_check_active.svg);
+}
+QCheckBox::indicator:checked:disabled {
+image: url(:/images/icon_checkbox_check_disabled.svg);
 }
 QPushButton {
-border-radius: 2px; 
-border: none;
-color: #ffffff;
-background-color: #981E32;
+padding: 0px 12px;
+border-radius: 4px; 
+border: 1px solid #AD2A45;
+color: #AD2A45;
+font-weight: 700;
 }
-QPushButton:pressed {
-background-color: #F24A66;
+QPushButton:hover {
+background-color: #F5EBED;
 }
-QPushButton:hover:!pressed {
-background-color: #CD2541;
+QPushButton:pressed {
+background-color: #E1C1C6;
 }
-QPushButton::default {
-background-color: #006EB5;
+QPushButton:default {
+color: #ffffff;
+background-color: #2F70B6;
 }
-QPushButton::default:pressed {
-background-color: #41B6E6;
+QPushButton:default:hover {
+background-color: #2B66A6;
 }
-QPushButton::default:hover:!pressed {
-background-color: #008DCF;
+QPushButton:default:pressed {
+background-color: #215081;
 }
-QPushButton::default:disabled {
-background-color: #BEDBED;
+QPushButton:default:disabled {
+background-color: #2F70B6;
 }</string>
   </property>
-  <layout class="QVBoxLayout" name="MobileIDDialogLayout">
+  <layout class="QVBoxLayout" name="MobileDialogLayout">
    <property name="spacing">
-    <number>0</number>
+    <number>40</number>
+   </property>
+   <property name="sizeConstraint">
+    <enum>QLayout::SetFixedSize</enum>
    </property>
    <property name="leftMargin">
-    <number>30</number>
+    <number>40</number>
    </property>
    <property name="topMargin">
-    <number>30</number>
+    <number>32</number>
    </property>
    <property name="rightMargin">
-    <number>30</number>
+    <number>40</number>
    </property>
    <property name="bottomMargin">
-    <number>30</number>
+    <number>32</number>
    </property>
    <item>
-    <widget class="QLabel" name="labelNameId">
-     <property name="font">
-      <font>
-       <pointsize>14</pointsize>
-      </font>
+    <widget class="QLabel" name="label">
+     <property name="minimumSize">
+      <size>
+       <width>350</width>
+       <height>0</height>
+      </size>
      </property>
      <property name="focusPolicy">
       <enum>Qt::TabFocus</enum>
      </property>
-     <property name="styleSheet">
-      <string notr="true">color: #041E42;</string>
-     </property>
      <property name="text">
       <string>Enter your phone number to sign with mobile-ID</string>
      </property>
@@ -117,167 +180,167 @@ background-color: #BEDBED;
     </widget>
    </item>
    <item>
-    <spacer name="topSpacer">
-     <property name="orientation">
-      <enum>Qt::Vertical</enum>
-     </property>
-     <property name="sizeHint" stdset="0">
-      <size>
-       <width>20</width>
-       <height>8</height>
-      </size>
-     </property>
-    </spacer>
-   </item>
-   <item>
-    <widget class="QLabel" name="labelPhone">
-     <property name="font">
-      <font>
-       <family>Roboto Condensed</family>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-     <property name="text">
-      <string>Country code and phone number</string>
-     </property>
-     <property name="buddy">
-      <cstring>phoneNo</cstring>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="LineEdit" name="phoneNo">
-     <property name="minimumSize">
-      <size>
-       <width>0</width>
-       <height>34</height>
-      </size>
-     </property>
-     <property name="placeholderText">
-      <string notr="true">37254321</string>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="errorPhone">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="labelCode">
-     <property name="font">
-      <font>
-       <family>Roboto Condensed</family>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-     <property name="text">
-      <string>Personal code</string>
-     </property>
-     <property name="buddy">
-      <cstring>idCode</cstring>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="LineEdit" name="idCode">
-     <property name="minimumSize">
-      <size>
-       <width>0</width>
-       <height>34</height>
-      </size>
-     </property>
-     <property name="placeholderText">
-      <string notr="true">47101010033</string>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="errorCode">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="CheckBox" name="cbRemember">
-     <property name="text">
-      <string>Remember me</string>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <spacer name="bottomSpacer">
-     <property name="orientation">
-      <enum>Qt::Vertical</enum>
-     </property>
-     <property name="sizeHint" stdset="0">
-      <size>
-       <width>20</width>
-       <height>8</height>
-      </size>
+    <layout class="QVBoxLayout" name="layoutContent">
+     <property name="spacing">
+      <number>24</number>
      </property>
-    </spacer>
+     <item>
+      <layout class="QVBoxLayout" name="layoutPhone">
+       <property name="spacing">
+        <number>6</number>
+       </property>
+       <item>
+        <widget class="QLabel" name="labelPhone">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+         <property name="text">
+          <string>Country code and phone number</string>
+         </property>
+         <property name="buddy">
+          <cstring>phoneNo</cstring>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="LineEdit" name="phoneNo">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>40</height>
+          </size>
+         </property>
+         <property name="placeholderText">
+          <string notr="true">37254321</string>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="QLabel" name="errorPhone">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+        </widget>
+       </item>
+      </layout>
+     </item>
+     <item>
+      <layout class="QVBoxLayout" name="layoutCode">
+       <property name="spacing">
+        <number>6</number>
+       </property>
+       <item>
+        <widget class="QLabel" name="labelCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+         <property name="text">
+          <string>Personal code</string>
+         </property>
+         <property name="buddy">
+          <cstring>idCode</cstring>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="LineEdit" name="idCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>40</height>
+          </size>
+         </property>
+         <property name="placeholderText">
+          <string notr="true">47101010033</string>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="QLabel" name="errorCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+        </widget>
+       </item>
+      </layout>
+     </item>
+     <item>
+      <widget class="QCheckBox" name="cbRemember">
+       <property name="minimumSize">
+        <size>
+         <width>0</width>
+         <height>17</height>
+        </size>
+       </property>
+       <property name="text">
+        <string>Remember me</string>
+       </property>
+      </widget>
+     </item>
+    </layout>
    </item>
    <item>
-    <layout class="QHBoxLayout" name="buttonLayout">
+    <layout class="QHBoxLayout" name="layoutButton">
      <property name="spacing">
-      <number>40</number>
+      <number>0</number>
      </property>
      <item>
       <widget class="QPushButton" name="cancel">
        <property name="minimumSize">
         <size>
-         <width>0</width>
-         <height>30</height>
+         <width>100</width>
+         <height>40</height>
         </size>
        </property>
-       <property name="font">
-        <font>
-         <pointsize>14</pointsize>
-        </font>
-       </property>
        <property name="cursor">
         <cursorShape>PointingHandCursor</cursorShape>
        </property>
-       <property name="accessibleName">
-        <string extracomment="accessible">Cancel</string>
-       </property>
        <property name="text">
-        <string>CANCEL</string>
+        <string>Cancel</string>
        </property>
        <property name="autoDefault">
         <bool>false</bool>
        </property>
       </widget>
      </item>
+     <item>
+      <spacer name="horizontalSpacer">
+       <property name="orientation">
+        <enum>Qt::Horizontal</enum>
+       </property>
+       <property name="sizeHint" stdset="0">
+        <size>
+         <width>40</width>
+         <height>20</height>
+        </size>
+       </property>
+      </spacer>
+     </item>
      <item>
       <widget class="QPushButton" name="sign">
        <property name="minimumSize">
         <size>
-         <width>0</width>
-         <height>30</height>
+         <width>100</width>
+         <height>40</height>
         </size>
        </property>
-       <property name="font">
-        <font>
-         <pointsize>14</pointsize>
-        </font>
-       </property>
        <property name="cursor">
         <cursorShape>PointingHandCursor</cursorShape>
        </property>
-       <property name="accessibleName">
-        <string extracomment="accessible">Sign</string>
-       </property>
        <property name="text">
-        <string>SIGN</string>
+        <string>Sign</string>
        </property>
        <property name="default">
         <bool>true</bool>
@@ -289,11 +352,6 @@ background-color: #BEDBED;
   </layout>
  </widget>
  <customwidgets>
-  <customwidget>
-   <class>CheckBox</class>
-   <extends>QCheckBox</extends>
-   <header>widgets/CheckBox.h</header>
-  </customwidget>
   <customwidget>
    <class>LineEdit</class>
    <extends>QLineEdit</extends>
diff --git a/client/dialogs/SmartIDDialog.cpp b/client/dialogs/SmartIDDialog.cpp
index 8ea8aec9a..29e531a00 100644
--- a/client/dialogs/SmartIDDialog.cpp
+++ b/client/dialogs/SmartIDDialog.cpp
@@ -22,7 +22,6 @@
 
 #include "IKValidator.h"
 #include "Settings.h"
-#include "Styles.h"
 #include "effects/Overlay.h"
 
 SmartIDDialog::SmartIDDialog(QWidget *parent)
@@ -34,26 +33,14 @@ SmartIDDialog::SmartIDDialog(QWidget *parent)
 
 	ui->setupUi(this);
 	setWindowFlags(Qt::Dialog | Qt::CustomizeWindowHint);
-	setFixedSize(size());
 #ifdef Q_OS_WIN
-	ui->buttonLayout->setDirection(QBoxLayout::RightToLeft);
+	ui->layoutButton->setDirection(QBoxLayout::RightToLeft);
 #endif
 
-	QFont condensed = Styles::font(Styles::Condensed, 14);
-	QFont regularFont = Styles::font(Styles::Regular, 14);
-	ui->labelNameId->setFont(Styles::font(Styles::Regular, 16, QFont::DemiBold));
-	ui->labelCode->setFont(regularFont);
-	ui->labelCountry->setFont(regularFont);
-	ui->errorCode->setFont(regularFont);
-	ui->errorCountry->setFont(regularFont);
-	ui->idCode->setFont(regularFont);
 	ui->idCode->setAttribute(Qt::WA_MacShowFocusRect, false);
 	ui->idCode->setFocus();
-	ui->idCountry->setFont(regularFont);
-	ui->cbRemember->setFont(regularFont);
 	ui->cbRemember->setAttribute(Qt::WA_MacShowFocusRect, false);
-	ui->sign->setFont(condensed);
-	ui->cancel->setFont(condensed);
+	ui->errorCode->hide();
 
 	auto *ik = new NumberValidator(ui->idCode);
 	ui->idCode->setValidator(Settings::SMARTID_COUNTRY == EE ? ik : nullptr);
@@ -69,9 +56,9 @@ SmartIDDialog::SmartIDDialog(QWidget *parent)
 		Settings::SMARTID_COUNTRY = checked ? country() : EE;
 	};
 	auto setError = [](QLineEdit *input, QLabel *error, const QString &msg) {
-		input->setStyleSheet(msg.isEmpty() ? QString() :QStringLiteral("border-color: #c53e3e"));
-		error->setFocusPolicy(msg.isEmpty() ? Qt::NoFocus : Qt::TabFocus);
+		input->setStyleSheet(msg.isEmpty() ? QString() : QStringLiteral("border-color: #BE7884"));
 		error->setText(msg);
+		error->setHidden(msg.isEmpty());
 	};
 	connect(ui->idCode, &QLineEdit::returnPressed, ui->sign, &QPushButton::click);
 	connect(ui->idCode, &QLineEdit::textEdited, this, saveSettings);
diff --git a/client/dialogs/SmartIDDialog.ui b/client/dialogs/SmartIDDialog.ui
index 2d8ed51c0..fcb642080 100644
--- a/client/dialogs/SmartIDDialog.ui
+++ b/client/dialogs/SmartIDDialog.ui
@@ -9,8 +9,8 @@
    <rect>
     <x>0</x>
     <y>0</y>
-    <width>382</width>
-    <height>301</height>
+    <width>430</width>
+    <height>451</height>
    </rect>
   </property>
   <property name="windowTitle">
@@ -18,45 +18,55 @@
   </property>
   <property name="styleSheet">
    <string notr="true">QWidget {
+font-family: Roboto, Helvetica;
+font-size: 14px;
+}
+#SmartIDDialog {
 background-color: #FFFFFF;
-color: #000000;
-border-radius: 2px;
+border-radius: 4px;
 }
-QLineEdit, QComboBox {
-padding: 0px 10px;
-border: 1px solid #8E969D;
-border-radius: 2px;
+#label {
+color: #003168;
+font-size: 20px;
+font-weight: 700;
 }
 #labelCode, #labelCountry {
-color: #353739
+color: #607496;
+font-weight: 500;
 }
 #errorCode, #errorCountry {
-color: #c53e3e
+color: #AD2A45;
+}
+QLineEdit, QComboBox {
+padding: 10px 14px;
+border: 1px solid #C4CBD8;
+border-radius: 4px;
+color: #07142A;
+placeholder-text-color: #607496;
+font-size: 16px;
 }
 QComboBox QWidget#popup {
 background-color: transparent;
 }
 QComboBox QWidget#content {
-border: 1px solid #8E969D;
-border-radius: 2px;
+border: 1px solid #C4CBD8;
+border-radius: 4px;
 background-color: #FFFFFF;
 }
 QComboBox QPushButton {
 margin: 3px;
-padding: 0px 8px 0px 4px;
+padding: 0px 12px 0px 4px;
 border: 0px;
-color: #353739;
+color: #07142A;
 text-align: left;
+font-weight: normal;
+font-size: 16px;
 qproperty-iconSize: 14px 9px;
 qproperty-layoutDirection: RightToLeft;
 }
 QComboBox QPushButton#selected {
 qproperty-icon: url(:/images/arrow_up.svg);
 }
-QComboBox QPushButton:hover {
-background-color: #006EB5;
-color: #FFFFFF;
-}
 QComboBox QPushButton:hover#selected {
 qproperty-icon: url(:/images/arrow_up_white.svg);
 }
@@ -72,52 +82,92 @@ top: 1px;
 left: 1px;
 }
 QCheckBox {
-min-height: 31px;
-spacing: 5px;
+spacing: 8px;
+color: #07142A;
+border: none; /*Workaround for right padding*/
 }
 QCheckBox:disabled {
-color: #727679;
+color: #C4CBD8;
 }
 QCheckBox::indicator {
-width: 14px;
-height: 14px;
+width: 16px;
+height: 16px;
 }
 QCheckBox::indicator:unchecked {
-image: url(:/images/icon_checkbox.png);
+image: url(:/images/icon_checkbox.svg);
+}
+QCheckBox::indicator:unchecked:hover {
+image: url(:/images/icon_checkbox_active.svg);
+}
+QCheckBox::indicator:unchecked:disabled {
+image: url(:/images/icon_checkbox_disabled.svg);
 }
 QCheckBox::indicator:checked {
-image: url(:/images/icon_checkbox_check.png);
+image: url(:/images/icon_checkbox_check.svg);
+}
+QCheckBox::indicator:checked:hover {
+image: url(:/images/icon_checkbox_check_active.svg);
+}
+QCheckBox::indicator:checked:disabled {
+image: url(:/images/icon_checkbox_check_disabled.svg);
+}
+QPushButton {
+padding: 0px 12px;
+border-radius: 4px; 
+border: 1px solid #AD2A45;
+color: #AD2A45;
+font-weight: 700;
+}
+QPushButton:hover {
+background-color: #F5EBED;
+}
+QPushButton:pressed {
+background-color: #E1C1C6;
+}
+QPushButton:default {
+color: #ffffff;
+background-color: #2F70B6;
+}
+QPushButton:default:hover {
+background-color: #2B66A6;
+}
+QPushButton:default:pressed {
+background-color: #215081;
+}
+QPushButton:default:disabled {
+background-color: #2F70B6;
 }</string>
   </property>
   <layout class="QVBoxLayout" name="SmartIDDialogLayout">
    <property name="spacing">
-    <number>0</number>
+    <number>40</number>
+   </property>
+   <property name="sizeConstraint">
+    <enum>QLayout::SetFixedSize</enum>
    </property>
    <property name="leftMargin">
-    <number>30</number>
+    <number>40</number>
    </property>
    <property name="topMargin">
-    <number>30</number>
+    <number>32</number>
    </property>
    <property name="rightMargin">
-    <number>30</number>
+    <number>40</number>
    </property>
    <property name="bottomMargin">
-    <number>30</number>
+    <number>32</number>
    </property>
    <item>
-    <widget class="QLabel" name="labelNameId">
-     <property name="font">
-      <font>
-       <pointsize>14</pointsize>
-      </font>
+    <widget class="QLabel" name="label">
+     <property name="minimumSize">
+      <size>
+       <width>350</width>
+       <height>0</height>
+      </size>
      </property>
      <property name="focusPolicy">
       <enum>Qt::TabFocus</enum>
      </property>
-     <property name="styleSheet">
-      <string notr="true">color: #041E42;</string>
-     </property>
      <property name="text">
       <string>Enter your personal code to sign with Smart-ID</string>
      </property>
@@ -130,211 +180,169 @@ image: url(:/images/icon_checkbox_check.png);
     </widget>
    </item>
    <item>
-    <spacer name="topSpacer">
-     <property name="orientation">
-      <enum>Qt::Vertical</enum>
-     </property>
-     <property name="sizeHint" stdset="0">
-      <size>
-       <width>0</width>
-       <height>8</height>
-      </size>
-     </property>
-    </spacer>
-   </item>
-   <item>
-    <widget class="QLabel" name="labelCountry">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-     <property name="text">
-      <string>Country</string>
-     </property>
-     <property name="buddy">
-      <cstring>idCountry</cstring>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="ComboBox" name="idCountry">
-     <property name="minimumSize">
-      <size>
-       <width>0</width>
-       <height>34</height>
-      </size>
+    <layout class="QVBoxLayout" name="layoutContent">
+     <property name="spacing">
+      <number>24</number>
      </property>
      <item>
-      <property name="text">
-       <string>Estonia</string>
-      </property>
+      <layout class="QVBoxLayout" name="layoutCountry">
+       <property name="spacing">
+        <number>6</number>
+       </property>
+       <item>
+        <widget class="QLabel" name="labelCountry">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+         <property name="text">
+          <string>Country</string>
+         </property>
+         <property name="buddy">
+          <cstring>idCountry</cstring>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="ComboBox" name="idCountry">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>40</height>
+          </size>
+         </property>
+         <item>
+          <property name="text">
+           <string>Estonia</string>
+          </property>
+         </item>
+         <item>
+          <property name="text">
+           <string>Lithuania</string>
+          </property>
+         </item>
+         <item>
+          <property name="text">
+           <string>Latvia</string>
+          </property>
+         </item>
+        </widget>
+       </item>
+      </layout>
      </item>
      <item>
-      <property name="text">
-       <string>Lithuania</string>
-      </property>
+      <layout class="QVBoxLayout" name="layoutCode">
+       <property name="spacing">
+        <number>6</number>
+       </property>
+       <item>
+        <widget class="QLabel" name="labelCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+         <property name="text">
+          <string>Personal code</string>
+         </property>
+         <property name="buddy">
+          <cstring>idCode</cstring>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="LineEdit" name="idCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>40</height>
+          </size>
+         </property>
+         <property name="placeholderText">
+          <string notr="true">47101010033</string>
+         </property>
+        </widget>
+       </item>
+       <item>
+        <widget class="QLabel" name="errorCode">
+         <property name="minimumSize">
+          <size>
+           <width>0</width>
+           <height>20</height>
+          </size>
+         </property>
+        </widget>
+       </item>
+      </layout>
      </item>
      <item>
-      <property name="text">
-       <string>Latvia</string>
-      </property>
+      <widget class="QCheckBox" name="cbRemember">
+       <property name="minimumSize">
+        <size>
+         <width>0</width>
+         <height>17</height>
+        </size>
+       </property>
+       <property name="text">
+        <string>Remember me</string>
+       </property>
+      </widget>
      </item>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="errorCountry">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="labelCode">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-     <property name="text">
-      <string>Personal code</string>
-     </property>
-     <property name="buddy">
-      <cstring>idCode</cstring>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="LineEdit" name="idCode">
-     <property name="minimumSize">
-      <size>
-       <width>0</width>
-       <height>34</height>
-      </size>
-     </property>
-     <property name="placeholderText">
-      <string notr="true">47101010033</string>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="QLabel" name="errorCode">
-     <property name="font">
-      <font>
-       <pointsize>12</pointsize>
-      </font>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <widget class="CheckBox" name="cbRemember">
-     <property name="styleSheet">
-      <string notr="true">color: #353739;</string>
-     </property>
-     <property name="text">
-      <string>Remember me</string>
-     </property>
-    </widget>
-   </item>
-   <item>
-    <spacer name="bottomSpacer">
-     <property name="orientation">
-      <enum>Qt::Vertical</enum>
-     </property>
-     <property name="sizeHint" stdset="0">
-      <size>
-       <width>0</width>
-       <height>8</height>
-      </size>
-     </property>
-    </spacer>
+    </layout>
    </item>
    <item>
-    <layout class="QHBoxLayout" name="buttonLayout">
+    <layout class="QHBoxLayout" name="layoutButton">
      <property name="spacing">
-      <number>40</number>
+      <number>0</number>
      </property>
      <item>
       <widget class="QPushButton" name="cancel">
        <property name="minimumSize">
         <size>
-         <width>0</width>
-         <height>30</height>
+         <width>100</width>
+         <height>40</height>
         </size>
        </property>
-       <property name="font">
-        <font>
-         <pointsize>14</pointsize>
-        </font>
-       </property>
        <property name="cursor">
         <cursorShape>PointingHandCursor</cursorShape>
        </property>
-       <property name="accessibleName">
-        <string extracomment="accessible">Cancel</string>
-       </property>
-       <property name="styleSheet">
-        <string notr="true">QPushButton {
-	border-radius: 2px; 
-	border: none;
-	color: #ffffff;
-	background-color: #981E32;
-}
-QPushButton:pressed {
-	background-color: #F24A66;
-}
-QPushButton:hover:!pressed {
-	background-color: #CD2541;
-}</string>
-       </property>
        <property name="text">
-        <string>CANCEL</string>
+        <string>Cancel</string>
        </property>
        <property name="autoDefault">
         <bool>false</bool>
        </property>
       </widget>
      </item>
+     <item>
+      <spacer name="horizontalSpacer">
+       <property name="orientation">
+        <enum>Qt::Horizontal</enum>
+       </property>
+       <property name="sizeHint" stdset="0">
+        <size>
+         <width>40</width>
+         <height>20</height>
+        </size>
+       </property>
+      </spacer>
+     </item>
      <item>
       <widget class="QPushButton" name="sign">
        <property name="minimumSize">
         <size>
-         <width>0</width>
-         <height>30</height>
+         <width>100</width>
+         <height>40</height>
         </size>
        </property>
-       <property name="font">
-        <font>
-         <pointsize>14</pointsize>
-        </font>
-       </property>
        <property name="cursor">
         <cursorShape>PointingHandCursor</cursorShape>
        </property>
-       <property name="accessibleName">
-        <string extracomment="accessible">Sign</string>
-       </property>
-       <property name="styleSheet">
-        <string notr="true">QPushButton {
-	border-radius: 2px; 
-	border: none;
-	color: #ffffff;
-	background-color: #006EB5;
-}
-QPushButton:pressed {
-	background-color: #41B6E6;
-}
-QPushButton:hover:!pressed {
-	background-color: #008DCF;
-}
-QPushButton:disabled {
-	background-color: #BEDBED;
-}</string>
-       </property>
        <property name="text">
-        <string>SIGN</string>
+        <string>Sign</string>
        </property>
        <property name="default">
         <bool>true</bool>
@@ -346,11 +354,6 @@ QPushButton:disabled {
   </layout>
  </widget>
  <customwidgets>
-  <customwidget>
-   <class>CheckBox</class>
-   <extends>QCheckBox</extends>
-   <header>widgets/CheckBox.h</header>
-  </customwidget>
   <customwidget>
    <class>ComboBox</class>
    <extends>QComboBox</extends>
diff --git a/client/images/icon_checkbox.svg b/client/images/icon_checkbox.svg
new file mode 100644
index 000000000..088f31987
--- /dev/null
+++ b/client/images/icon_checkbox.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="1" width="15" height="15" rx="3.5" fill="white"/>
+<rect x="0.5" y="1" width="15" height="15" rx="3.5" stroke="#D9DEE6"/>
+</svg>
diff --git a/client/images/icon_checkbox_active.svg b/client/images/icon_checkbox_active.svg
new file mode 100644
index 000000000..516706d62
--- /dev/null
+++ b/client/images/icon_checkbox_active.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" fill="#EAF1F8"/>
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" stroke="#2F70B6"/>
+</svg>
diff --git a/client/images/icon_checkbox_check.svg b/client/images/icon_checkbox_check.svg
new file mode 100644
index 000000000..335d68293
--- /dev/null
+++ b/client/images/icon_checkbox_check.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="1" width="15" height="15" rx="3.5" fill="#F3F5F7"/>
+<rect x="0.5" y="1" width="15" height="15" rx="3.5" stroke="#2F70B6"/>
+<path d="M12 5.5L6.5 11L4 8.5" stroke="#2F70B6" stroke-width="1.6666" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/client/images/icon_checkbox_check_active.svg b/client/images/icon_checkbox_check_active.svg
new file mode 100644
index 000000000..43f1611a8
--- /dev/null
+++ b/client/images/icon_checkbox_check_active.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" fill="#EAF1F8"/>
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" stroke="#2F70B6"/>
+<path d="M12 5L6.5 10.5L4 8" stroke="#2F70B6" stroke-width="1.6666" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/client/images/icon_checkbox_check_disabled.svg b/client/images/icon_checkbox_check_disabled.svg
new file mode 100644
index 000000000..8df404e41
--- /dev/null
+++ b/client/images/icon_checkbox_check_disabled.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" fill="#F2F4F7"/>
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" stroke="#E7EAEF"/>
+<path d="M12 5L6.5 10.5L4 8" stroke="#E7EAEF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/client/images/icon_checkbox_check_hover.svg b/client/images/icon_checkbox_check_hover.svg
new file mode 100644
index 000000000..06bc690a1
--- /dev/null
+++ b/client/images/icon_checkbox_check_hover.svg
@@ -0,0 +1,18 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_249_10897)">
+<rect x="4" y="4" width="16" height="16" rx="4" fill="#EAF1F8"/>
+<rect x="4.5" y="4.5" width="15" height="15" rx="3.5" stroke="#2F70B6"/>
+<path d="M16 9L10.5 14.5L8 12" stroke="#2F70B6" stroke-width="1.6666" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<filter id="filter0_d_249_10897" x="0" y="0" width="24" height="24" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feMorphology radius="4" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_249_10897"/>
+<feOffset/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.917647 0 0 0 0 0.945098 0 0 0 0 0.972549 0 0 0 1 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_249_10897"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_249_10897" result="shape"/>
+</filter>
+</defs>
+</svg>
diff --git a/client/images/icon_checkbox_disabled.svg b/client/images/icon_checkbox_disabled.svg
new file mode 100644
index 000000000..20ec252cf
--- /dev/null
+++ b/client/images/icon_checkbox_disabled.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" fill="#F2F4F7"/>
+<rect x="0.5" y="0.5" width="15" height="15" rx="3.5" stroke="#E7EAEF"/>
+</svg>
diff --git a/client/images/icon_checkbox_hover.svg b/client/images/icon_checkbox_hover.svg
new file mode 100644
index 000000000..1dd1846b6
--- /dev/null
+++ b/client/images/icon_checkbox_hover.svg
@@ -0,0 +1,17 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_249_10945)">
+<rect x="4" y="4" width="16" height="16" rx="4" fill="white"/>
+<rect x="4.5" y="4.5" width="15" height="15" rx="3.5" stroke="#749FCE"/>
+</g>
+<defs>
+<filter id="filter0_d_249_10945" x="0" y="0" width="24" height="24" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feMorphology radius="4" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_249_10945"/>
+<feOffset/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.917647 0 0 0 0 0.945098 0 0 0 0 0.972549 0 0 0 1 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_249_10945"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_249_10945" result="shape"/>
+</filter>
+</defs>
+</svg>
diff --git a/client/images/images.qrc b/client/images/images.qrc
index 74cb9b6bb..7b0ae0b06 100644
--- a/client/images/images.qrc
+++ b/client/images/images.qrc
@@ -22,7 +22,15 @@
 		<file>icon_Allkiri.svg</file>
 		<file>icon_check.svg</file>
 		<file>icon_checkbox.png</file>
+		<file>icon_checkbox.svg</file>
+		<file>icon_checkbox_active.svg</file>
+		<file>icon_checkbox_disabled.svg</file>
+		<file>icon_checkbox_hover.svg</file>
 		<file>icon_checkbox_check.png</file>
+		<file>icon_checkbox_check.svg</file>
+		<file>icon_checkbox_check_active.svg</file>
+		<file>icon_checkbox_check_disabled.svg</file>
+		<file>icon_checkbox_check_hover.svg</file>
 		<file>icon_digitempel.svg</file>
 		<file>icon_download_hover.svg</file>
 		<file>icon_download.svg</file>
diff --git a/client/translations/en.ts b/client/translations/en.ts
index 529ea2902..7ea79dc3a 100644
--- a/client/translations/en.ts
+++ b/client/translations/en.ts
@@ -1670,14 +1670,6 @@ ID-CARD</translation>
         <source>Remember me</source>
         <translation>Remember me</translation>
     </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>CANCEL</translation>
-    </message>
-    <message>
-        <source>SIGN</source>
-        <translation>SIGN</translation>
-    </message>
     <message>
         <source>Personal code is not valid</source>
         <translation>Personal code is not valid</translation>
@@ -1688,12 +1680,10 @@ ID-CARD</translation>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Cancel</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Sign</translation>
     </message>
     <message>
@@ -2924,14 +2914,6 @@ Additional licenses and components</translation>
 </context>
 <context>
     <name>SmartIDDialog</name>
-    <message>
-        <source>SIGN</source>
-        <translation>SIGN</translation>
-    </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>CANCEL</translation>
-    </message>
     <message>
         <source>Personal code</source>
         <translation>Personal code</translation>
@@ -2966,12 +2948,10 @@ Additional licenses and components</translation>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Cancel</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Sign</translation>
     </message>
 </context>
diff --git a/client/translations/et.ts b/client/translations/et.ts
index 542c9dfef..21d42e281 100644
--- a/client/translations/et.ts
+++ b/client/translations/et.ts
@@ -1670,14 +1670,6 @@ ID-KAARDIGA</translation>
         <source>Remember me</source>
         <translation>Pea mind meeles</translation>
     </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>KATKESTA</translation>
-    </message>
-    <message>
-        <source>SIGN</source>
-        <translation>ALLKIRJASTA</translation>
-    </message>
     <message>
         <source>Personal code is not valid</source>
         <translation>Isikukood pole kehtiv</translation>
@@ -1688,12 +1680,10 @@ ID-KAARDIGA</translation>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Katkesta</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Allkirjastan</translation>
     </message>
     <message>
@@ -2924,14 +2914,6 @@ Täiendavad litsentsid ja komponendid</translation>
 </context>
 <context>
     <name>SmartIDDialog</name>
-    <message>
-        <source>SIGN</source>
-        <translation>ALLKIRJASTA</translation>
-    </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>KATKESTA</translation>
-    </message>
     <message>
         <source>Personal code</source>
         <translation>Isikukood</translation>
@@ -2966,12 +2948,10 @@ Täiendavad litsentsid ja komponendid</translation>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Katkesta</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Allkirjastan</translation>
     </message>
 </context>
diff --git a/client/translations/ru.ts b/client/translations/ru.ts
index 93c9afc45..e5f41ec17 100644
--- a/client/translations/ru.ts
+++ b/client/translations/ru.ts
@@ -1671,14 +1671,6 @@ ID-КАРТОЙ</translation>
         <source>Remember me</source>
         <translation>Запомнить меня</translation>
     </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>ОТМЕНА</translation>
-    </message>
-    <message>
-        <source>SIGN</source>
-        <translation>ПОДПИСЬ</translation>
-    </message>
     <message>
         <source>Personal code is not valid</source>
         <translation>Личный код недействителен</translation>
@@ -1689,12 +1681,10 @@ ID-КАРТОЙ</translation>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Отмена</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Подписать</translation>
     </message>
     <message>
@@ -2925,14 +2915,6 @@ Additional licenses and components</source>
 </context>
 <context>
     <name>SmartIDDialog</name>
-    <message>
-        <source>SIGN</source>
-        <translation>ПОДПИСАТЬ</translation>
-    </message>
-    <message>
-        <source>CANCEL</source>
-        <translation>ОТМЕНА</translation>
-    </message>
     <message>
         <source>Personal code</source>
         <translation>Личный код</translation>
@@ -2967,12 +2949,10 @@ Additional licenses and components</source>
     </message>
     <message>
         <source>Cancel</source>
-        <extracomment>accessible</extracomment>
         <translation>Отмена</translation>
     </message>
     <message>
         <source>Sign</source>
-        <extracomment>accessible</extracomment>
         <translation>Подписать</translation>
     </message>
 </context>
diff --git a/client/widgets/ComboBox.cpp b/client/widgets/ComboBox.cpp
index 5204bedc7..0496492d6 100644
--- a/client/widgets/ComboBox.cpp
+++ b/client/widgets/ComboBox.cpp
@@ -28,31 +28,32 @@ ComboBox::ComboBox(QWidget *parent)
 
 void ComboBox::hidePopup()
 {
-	if(QWidget *popup = findChild<QWidget*>(QStringLiteral("popup")))
+	if(auto *popup = findChild<QWidget*>(QStringLiteral("popup")))
 		popup->deleteLater();
 }
 
 void ComboBox::showPopup()
 {
-	QWidget *popup = new QWidget(this);
+	auto *popup = new QWidget(this);
 	popup->setObjectName(QStringLiteral("popup"));
-	popup->setWindowFlags(Qt::Popup);
+	popup->setAttribute(Qt::WA_TranslucentBackground);
+	popup->setWindowFlags(Qt::Popup|Qt::FramelessWindowHint);
 	popup->setMinimumWidth(width());
-	popup->move(parentWidget()->mapToGlobal(geometry().topLeft()));
+	popup->move(mapToGlobal(QPoint()));
 
-	QVBoxLayout *c = new QVBoxLayout(popup);
+	auto *c = new QVBoxLayout(popup);
 	c->setContentsMargins(0, 0, 0, 0);
 	c->setSpacing(0);
 
-	QWidget *content = new QWidget(popup);
+	auto *content = new QWidget(popup);
 	content->setObjectName(QStringLiteral("content"));
 	c->addWidget(content);
 
-	QVBoxLayout *l = new QVBoxLayout(content);
+	auto *l = new QVBoxLayout(content);
 	l->setContentsMargins(0, 0, 0, 0);
 	l->setSpacing(0);
 	auto addWidget = [=](const QString &text, int index) {
-		QPushButton *b = new QPushButton(text, content);
+		auto *b = new QPushButton(text, content);
 		b->setFont(font());
 		b->setMinimumHeight(minimumHeight());
 		connect(b, &QPushButton::clicked, this, [this, index]{ setCurrentIndex(index); hidePopup(); });