diff --git a/packages/extension-base/src/background/handlers/State.ts b/packages/extension-base/src/background/handlers/State.ts
index 1a42573c..e371eba3 100644
--- a/packages/extension-base/src/background/handlers/State.ts
+++ b/packages/extension-base/src/background/handlers/State.ts
@@ -63,7 +63,7 @@ const WINDOW_OPTS = {
   left: 150,
   top: 150,
   type: 'popup',
-  url: chrome.extension.getURL('index.html'),
+  url: chrome.extension.getURL('notification.html'),
   width: 560
 };
 
diff --git a/packages/extension/public/index.html b/packages/extension/public/index.html
index d3cc4f9c..fa77749f 100644
--- a/packages/extension/public/index.html
+++ b/packages/extension/public/index.html
@@ -5,7 +5,7 @@
     <title>polkadot{.js}</title>
     <link href="fonts/fonts.css" rel="stylesheet">
   </head>
-  <body style="min-height: 600px; height: 100%; margin:0; overflow-x:hidden; text-align:center">
+  <body style="height: 600px; margin:0; overflow-x:hidden; text-align:center">
     <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100% - 2px); max-width: 100%;"></div>
     <script src='./extension.js'></script>
   </body>
diff --git a/packages/extension/public/notification.html b/packages/extension/public/notification.html
new file mode 100644
index 00000000..0291eba0
--- /dev/null
+++ b/packages/extension/public/notification.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>polkadot{.js}</title>
+    <link href="fonts/fonts.css" rel="stylesheet">
+  </head>
+  <body style="height: 621px; margin:0; overflow-x:hidden; text-align:center">
+    <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100% - 2px); max-width: 100%;"></div>
+    <script src='./extension.js'></script>
+  </body>
+</html>