Show user notifications after switch between UIs

2 files changed, 50 insertions, 1 deletions

diff --git a/old-ui/app/config.js b/old-ui/app/config.js
index c698417ba..acd101947 100644
--- a/old-ui/app/config.js
+++ b/old-ui/app/config.js
@@ -8,7 +8,7 @@ const infuraCurrencies = require('./infura-conversion.json').objects.sort((a, b)
     })
 const validUrl = require('valid-url')
 const exportAsFile = require('./util').exportAsFile
-
+const Modal = require('../../ui/app/components/modals/index').Modal
 
 module.exports = connect(mapStateToProps)(ConfigScreen)
 
@@ -32,6 +32,8 @@ ConfigScreen.prototype.render = function () {
   return (
     h('.flex-column.flex-grow', [
 
+      h(Modal, {}, []),
+
       // subtitle and nav
       h('.section-title.flex-row.flex-center', [
         h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
diff --git a/old-ui/app/css/index.css b/old-ui/app/css/index.css
index 0630c4c12..c2f2b6070 100644
--- a/old-ui/app/css/index.css
+++ b/old-ui/app/css/index.css
@@ -705,3 +705,50 @@ div.message-container > div:first-child {
 .pop-hover:hover {
     transform: scale(1.1);
 }
+
+//Notification Modal
+
+.notification-modal-wrapper {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  position: relative;
+  border: 1px solid #dedede;
+  box-shadow: 0 0 2px 2px #dedede;
+  font-family: Roboto;
+}
+
+.notification-modal-header {
+  background: #f6f6f6;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 30px;
+  font-size: 22px;
+  color: #1b344d;
+  height: 79px;
+}
+
+.notification-modal-message {
+  padding: 20px;
+}
+
+.notification-modal-message {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  font-size: 17px;
+  color: #1b344d;
+}
+
+.modal-close-x::after {
+  content: '\00D7';
+  font-size: 2em;
+  color: #9b9b9b;
+  position: absolute;
+  top: 25px;
+  right: 17.5px;
+  font-family: sans-serif;
+  cursor: pointer;
+}
\ No newline at end of file