diff --git a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
index 85a957ef1..665d1924f 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
+++ b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
@@ -43,6 +43,7 @@ export default class ConfirmPageContainerContent extends Component {
rejectNText: PropTypes.string,
hideTitle: PropTypes.bool,
supportsEIP1559V2: PropTypes.bool,
+ hasTopBorder: PropTypes.bool,
};
renderContent() {
@@ -111,6 +112,7 @@ export default class ConfirmPageContainerContent extends Component {
setUserAcknowledgedGasMissing,
hideUserAcknowledgedGasMissing,
supportsEIP1559V2,
+ hasTopBorder,
} = this.props;
const primaryAction = hideUserAcknowledgedGasMissing
@@ -121,7 +123,11 @@ export default class ConfirmPageContainerContent extends Component {
};
return (
-
+
{warning ? : null}
{ethGasPriceWarning && (
diff --git a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/index.scss b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/index.scss
index 8bb39b705..d8f7a307c 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/index.scss
+++ b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-summary/index.scss
@@ -1,16 +1,18 @@
.confirm-page-container-summary {
- padding: 0 24px;
+ padding: 16px 24px;
background-color: #f9fafa;
- height: 120px;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-evenly;
+ &__origin,
+ &__action-row {
+ padding-bottom: 8px;
+ }
+
&__origin {
@include H6;
-
- padding-bottom: 10px;
}
&__action-row {
@@ -34,7 +36,6 @@
}
&__title {
- padding: 4px 0;
display: flex;
align-items: center;
}
@@ -45,7 +46,7 @@
}
&__title-text {
- @include H2;
+ @include H1;
white-space: nowrap;
overflow: hidden;
@@ -53,13 +54,12 @@
}
&__subtitle {
- @include H6;
+ @include H5;
color: var(--oslo-gray);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
- margin-left: 42px;
}
&--border {
diff --git a/ui/components/app/confirm-page-container/confirm-page-container-content/index.scss b/ui/components/app/confirm-page-container/confirm-page-container-content/index.scss
index 96da686c9..b932af183 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container-content/index.scss
+++ b/ui/components/app/confirm-page-container/confirm-page-container-content/index.scss
@@ -8,6 +8,10 @@
display: flex;
flex-direction: column;
+ &--with-top-border {
+ border-top: 1px solid var(--geyser);
+ }
+
&__error-container {
padding: 0 16px 16px 16px;
}
diff --git a/ui/components/app/confirm-page-container/confirm-page-container.component.js b/ui/components/app/confirm-page-container/confirm-page-container.component.js
index dc23050e9..10f326594 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container.component.js
+++ b/ui/components/app/confirm-page-container/confirm-page-container.component.js
@@ -234,6 +234,7 @@ export default class ConfirmPageContainer extends Component {
ethGasPriceWarning={ethGasPriceWarning}
hideTitle={hideTitle}
supportsEIP1559V2={supportsEIP1559V2}
+ hasTopBorder={showAddToAddressDialog}
/>
)}
{shouldDisplayWarning && (
diff --git a/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js
index 67e53af49..d23912787 100644
--- a/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js
+++ b/ui/pages/confirm-transaction-base/confirm-transaction-base.component.js
@@ -861,7 +861,7 @@ export default class ConfirmTransactionBase extends Component {
value={hexTransactionAmount}
type={PRIMARY}
showEthLogo
- ethLogoHeight="36"
+ ethLogoHeight="28"
hideLabel
/>
);