diff --git a/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/index.js b/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/index.js
index 9bd9b56346..040cdb3174 100644
--- a/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/index.js
+++ b/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/index.js
@@ -105,7 +105,6 @@ const AmountControl = ({currency, onChange, value, options, min, max}) => {
value={selectValue}
onChange={setSelectValue}
/>
-
{selectValue === CUSTOM_AMOUNT && (
)}
-
{validationError && (
diff --git a/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/style.scss b/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/style.scss
index 0c8a143597..d6d0898ff7 100644
--- a/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/style.scss
+++ b/src/DonorDashboards/resources/js/app/components/subscription-manager/amount-control/style.scss
@@ -10,24 +10,26 @@ $errorColor: #c91f1f;
}
.give-donor-dashboard-amount-inputs {
+ flex: 1;
display: flex;
flex-direction: column;
-
.give-donor-dashboard-field-row {
+ flex: 1;
display: flex;
+ align-items: center;
padding: 0;
.give-donor-dashboard-select-control {
display: flex;
- min-width: 100%;
+ width: 100%;
margin: 0;
}
}
}
.give-donor-dashboard-currency-control {
- margin-top: 10px;
+ margin-bottom: 2px;
.give-donor-dashboard-currency-control__label {
font-family: Montserrat, Arial, Helvetica, sans-serif;
@@ -47,10 +49,10 @@ $errorColor: #c91f1f;
outline: 0 !important;
min-width: 190px;
width: 100%;
- margin-top: 8px;
+ margin-top: 6px;
border: 1px solid #b8b8b8;
overflow: hidden;
- padding: 0;
+ padding: 1px;
box-shadow: 0 0 0 0 var(--give-donor-dashboard-accent-color);
transition: box-shadow 0.1s ease;