fix classes

ui/app/pages/permissions-connect/redirect/index.scss

@@ -1,95 +1,83 @@
-.permissions-redirect-container {
+.permissions-redirect {
   display: flex;
-  border: none;
-  box-shadow: none;
-  width: 100%;
-  margin-top: 2px;
   height: 100%;
-  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+
+  &__result {
+    @extend %header--24;
 
-  &__content {
     display: flex;
-    width: 100%;
-    height: 144px;
-    margin-top: 140px;
-    padding-top: 8px;
+    flex-direction: column;
+    justify-content: space-between;
     align-items: center;
-    justify-content: center;
-  }
-}
+    text-align: center;
+    color: $Black-100;
+    padding-bottom: 30%;
 
-.permission-result {
-  @extend %header--24;
-
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
-  text-align: center;
-  color: $Black-100;
+    &__icons {
+      display: flex;
+    }
 
-  &__icons {
-    display: flex;
-  }
+    &__center-icon {
+      display: flex;
+      position: relative;
+      justify-content: center;
+      align-items: center;
+      font-size: 12px;
+    }
 
-  &__center-icon {
-    display: flex;
-    position: relative;
-    justify-content: center;
-    align-items: center;
-    font-size: 12px;
-  }
+    &__check {
+      width: 40px;
+      height: 40px;
+      background: white url("/images/permissions-check.svg") no-repeat;
+      position: absolute;
+    }
 
-  &__check {
-    width: 40px;
-    height: 40px;
-    background: white url("/images/permissions-check.svg") no-repeat;
-    position: absolute;
-  }
+    &__identicon, .icon-with-fallback__identicon {
+      width: 32px;
+      height: 32px;
 
-  &__identicon, .icon-with-fallback__identicon {
-    width: 32px;
-    height: 32px;
+      &--default {
+        background-color: #777A87;
+        color: white;
+        width: 64px;
+        height: 64px;
+        border-radius: 32px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-weight: bold;
+      }
+    }
 
-    &--default {
-      background-color: #777A87;
-      color: white;
-      width: 64px;
-      height: 64px;
-      border-radius: 32px;
+    &__identicon-container, .icon-with-fallback__identicon-container {
+      height: auto;
+      position: relative;
       display: flex;
-      align-items: center;
       justify-content: center;
-      font-weight: bold;
+      align-items: center;
+      height: 64px;
+      width: 64px;
     }
-  }
 
-  &__identicon-container, .icon-with-fallback__identicon-container {
-    height: auto;
-    position: relative;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 64px;
-    width: 64px;
-  }
-
-  &__identicon-border, .icon-with-fallback__identicon-border {
-    height: 64px;
-    width: 64px;
-    border-radius: 50%;
-    border: 1px solid white;
-    background: #FFFFFF;
-    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
-  }
+    &__identicon-border, .icon-with-fallback__identicon-border {
+      height: 64px;
+      width: 64px;
+      border-radius: 50%;
+      border: 1px solid white;
+      background: #FFFFFF;
+      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
+    }
 
-  &__identicon-border {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
+    &__identicon-border {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
 
-  .icon-with-fallback__identicon-border {
-    position: absolute;
+    .icon-with-fallback__identicon-border {
+      position: absolute;
+    }
   }
-}
+}

ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js

@@ -8,20 +8,18 @@ export default function PermissionsRedirect ({ domainMetadata }) {
   const t = useContext(I18nContext)
 
   return (
-    <div className="page-container permissions-redirect-container">
-      <div className="permissions-redirect-container__content">
-        <div className="permission-result">
-          { t('connecting') }
-          <div className="permission-result__icons">
-            <IconWithFallBack icon={domainMetadata.icon} name={domainMetadata.name} />
-            <div className="permission-result__center-icon">
-              <span className="permission-result__check" />
-              { renderBrokenLine() }
-            </div>
-            <div className="permission-result__identicon-container">
-              <div className="permission-result__identicon-border">
-                <img src="/images/logo/metamask-fox.svg" />
-              </div>
+    <div className="permissions-redirect">
+      <div className="permissions-redirect__result">
+        { t('connecting') }
+        <div className="permissions-redirect__result__icons">
+          <IconWithFallBack icon={domainMetadata.icon} name={domainMetadata.name} />
+          <div className="permissions-redirect__result__center-icon">
+            <span className="permissions-redirect__result__check" />
+            { renderBrokenLine() }
+          </div>
+          <div className="permissions-redirect__result__identicon-container">
+            <div className="permissions-redirect__result__identicon-border">
+              <img src="/images/logo/metamask-fox.svg" />
             </div>
           </div>
         </div>