Adds redesign for the customize gas advanced tab.

3 files changed, 18 insertions, 7 deletions

diff --git a/ui/app/components/page-container/page-container-footer/page-container-footer.component.js b/ui/app/components/page-container/page-container-footer/page-container-footer.component.js
index 773fe1f56..5725c22ac 100644
--- a/ui/app/components/page-container/page-container-footer/page-container-footer.component.js
+++ b/ui/app/components/page-container/page-container-footer/page-container-footer.component.js
@@ -12,6 +12,7 @@ export default class PageContainerFooter extends Component {
     submitText: PropTypes.string,
     disabled: PropTypes.bool,
     submitButtonType: PropTypes.string,
+    hideCancel: PropTypes.func,
   }
 
   static contextTypes = {
@@ -27,20 +28,21 @@ export default class PageContainerFooter extends Component {
       submitText,
       disabled,
       submitButtonType,
+      hideCancel,
     } = this.props
 
     return (
       <div className="page-container__footer">
 
         <header>
-          <Button
+          {!hideCancel && <Button
             type="default"
             large
             className="page-container__footer-button"
             onClick={e => onCancel(e)}
           >
             { cancelText || this.context.t('cancel') }
-          </Button>
+          </Button>}
 
           <Button
             type={submitButtonType || 'primary'}
diff --git a/ui/app/components/page-container/page-container-header/page-container-header.component.js b/ui/app/components/page-container/page-container-header/page-container-header.component.js
index a8458604e..08f9c7544 100644
--- a/ui/app/components/page-container/page-container-header/page-container-header.component.js
+++ b/ui/app/components/page-container/page-container-header/page-container-header.component.js
@@ -12,6 +12,7 @@ export default class PageContainerHeader extends Component {
     backButtonStyles: PropTypes.object,
     backButtonString: PropTypes.string,
     tabs: PropTypes.node,
+    headerCloseText: PropTypes.string,
   }
 
   renderTabs () {
@@ -41,7 +42,7 @@ export default class PageContainerHeader extends Component {
   }
 
   render () {
-    const { title, subtitle, onClose, tabs } = this.props
+    const { title, subtitle, onClose, tabs, headerCloseText } = this.props
 
     return (
       <div className={
@@ -66,10 +67,12 @@ export default class PageContainerHeader extends Component {
         }
 
         {
-          onClose && <div
-            className="page-container__header-close"
-            onClick={() => onClose()}
-          />
+          onClose && headerCloseText
+            ? <div className="page-container__header-close-text" onClick={() => onClose()}>{ headerCloseText }</div>
+            : onClose && <div
+              className="page-container__header-close"
+              onClick={() => onClose()}
+            />
         }
 
         { this.renderTabs() }
diff --git a/ui/app/components/page-container/page-container.component.js b/ui/app/components/page-container/page-container.component.js
index 672255e27..27daf4c04 100644
--- a/ui/app/components/page-container/page-container.component.js
+++ b/ui/app/components/page-container/page-container.component.js
@@ -9,6 +9,7 @@ export default class PageContainer extends PureComponent {
     // PageContainerHeader props
     backButtonString: PropTypes.string,
     backButtonStyles: PropTypes.object,
+    headerCloseText: PropTypes.string,
     onBackButtonClick: PropTypes.func,
     onClose: PropTypes.func,
     showBackButton: PropTypes.bool,
@@ -22,6 +23,7 @@ export default class PageContainer extends PureComponent {
     // PageContainerFooter props
     cancelText: PropTypes.string,
     disabled: PropTypes.bool,
+    hideCancel: PropTypes.string,
     onCancel: PropTypes.func,
     onSubmit: PropTypes.func,
     submitText: PropTypes.string,
@@ -93,6 +95,8 @@ export default class PageContainer extends PureComponent {
       onSubmit,
       submitText,
       disabled,
+      headerCloseText,
+      hideCancel,
     } = this.props
 
     return (
@@ -106,6 +110,7 @@ export default class PageContainer extends PureComponent {
           backButtonStyles={backButtonStyles}
           backButtonString={backButtonString}
           tabs={this.renderTabs()}
+          headerCloseText={headerCloseText}
         />
         <div className="page-container__content">
           { this.renderContent() }
@@ -113,6 +118,7 @@ export default class PageContainer extends PureComponent {
         <PageContainerFooter
           onCancel={onCancel}
           cancelText={cancelText}
+          hideCancel={hideCancel}
           onSubmit={onSubmit}
           submitText={submitText}
           disabled={disabled}