diff --git a/packages/app/components/auth/deviceCode/DeviceCodeBody.tsx b/packages/app/components/auth/deviceCode/DeviceCodeBody.tsx
index 912f982..9356c10 100644
--- a/packages/app/components/auth/deviceCode/DeviceCodeBody.tsx
+++ b/packages/app/components/auth/deviceCode/DeviceCodeBody.tsx
@@ -4,6 +4,8 @@ import { FormattedMessage as Message } from 'react-intl';
import { Input } from 'app/components/ui/form';
import BaseAuthBody from 'app/components/auth/BaseAuthBody';
+import style from './deviceCode.scss';
+
export default class DeviceCodeBody extends BaseAuthBody {
static displayName = 'DeviceCodeBody';
static panelId = 'deviceCode';
@@ -15,12 +17,21 @@ export default class DeviceCodeBody extends BaseAuthBody {
<>
{this.renderErrors()}
+
+
+
+
+
+
{(nodes) => (
diff --git a/packages/app/components/auth/deviceCode/deviceCode.scss b/packages/app/components/auth/deviceCode/deviceCode.scss
index f90e318..ac9e2af 100644
--- a/packages/app/components/auth/deviceCode/deviceCode.scss
+++ b/packages/app/components/auth/deviceCode/deviceCode.scss
@@ -3,3 +3,20 @@
margin: 0 auto;
padding: 55px 13px 0;
}
+
+.description {
+ font-size: 15px;
+ color: #aaa;
+ text-align: center;
+ margin-bottom: 15px;
+}
+
+.icon {
+ composes: hash from '~app/components/ui/icons.scss';
+
+ display: block;
+ text-align: center;
+ font-size: 69px;
+ color: #ccc;
+ margin-block: 5px 15px;
+}
diff --git a/packages/app/icons/webfont/hash.svg b/packages/app/icons/webfont/hash.svg
new file mode 100644
index 0000000..2f35f8c
--- /dev/null
+++ b/packages/app/icons/webfont/hash.svg
@@ -0,0 +1,3 @@
+