diff --git a/public/css/offers.css b/public/css/offers.css index 4d62410..6942f0a 100644 --- a/public/css/offers.css +++ b/public/css/offers.css @@ -15,7 +15,7 @@ width: 80px; } - #amount-area-content { + .amount-area-content { width: 50%; } @@ -54,7 +54,7 @@ width: 100px; } - #amount-area-content { + .amount-area-content { width: 33%; } @@ -314,7 +314,7 @@ font-size: 0.8em; } -#amount-area-content { +.amount-area-content { margin-left: auto; margin-right: auto; } diff --git a/src/front/components/AmountInput.js b/src/front/components/AmountInput.js index 8364bca..9badd2a 100644 --- a/src/front/components/AmountInput.js +++ b/src/front/components/AmountInput.js @@ -13,24 +13,21 @@ class AmountInput { render() { const amountArea = document.createElement('div'); amountArea.id = this.id; + amountArea.className = 'amount-area-content'; const eurAmount = document.createElement('div'); - eurAmount.id = 'eur-amount'; eurAmount.className = 'money-amount-input-area'; this.eurInput = document.createElement('input'); - this.eurInput.id = 'input-eur-amount'; this.eurInput.type = 'text'; this.eurInput.className = 'money-input input-money-amount'; this.eurInput.value = '100'; this.eurInput.required = true; const eurSymbol = document.createElement('div'); - eurSymbol.id = 'eur-symbol'; eurSymbol.className = 'curr-symbol'; const eurCharacter = document.createElement('span'); - eurCharacter.id = 'eur-character'; eurCharacter.className = 'curr-character'; eurCharacter.textContent = '€'; @@ -39,21 +36,17 @@ class AmountInput { eurAmount.appendChild(eurSymbol); const btcAmount = document.createElement('div'); - btcAmount.id = 'btc-amount'; btcAmount.className = 'money-amount-input-area'; this.btcInput = document.createElement('input'); - this.btcInput.id = 'input-btc-amount'; this.btcInput.type = 'text'; this.btcInput.className = 'money-input input-money-amount'; this.btcInput.disabled = true; const satsSymbol = document.createElement('div'); - satsSymbol.id = 'sats-symbol'; satsSymbol.className = 'curr-symbol'; const satsCharacter = document.createElement('span'); - satsCharacter.id = 'sats-character'; satsCharacter.className = 'curr-character'; satsCharacter.textContent = 'SAT'; diff --git a/src/front/pages/offers.js b/src/front/pages/offers.js index 6371340..946c72f 100644 --- a/src/front/pages/offers.js +++ b/src/front/pages/offers.js @@ -92,7 +92,6 @@ class CreateOfferModal { priceDisplay.updatePrices(); }); - //Continue moving components up here const amountDiv = document.createElement('div'); amountDiv.id = 'amount-area'; amountDiv.className = 'create-offer-step'; @@ -101,6 +100,12 @@ class CreateOfferModal { amountDiv.appendChild(amountHeading); controls.appendChild(amountDiv); + this.amountInput = new AmountInput({ + parentElement: amountDiv, + }); + + //Continue moving components up here + const placeTimeDiv = document.createElement('div'); placeTimeDiv.id = 'place-and-time-area'; placeTimeDiv.className = 'create-offer-step'; @@ -171,11 +176,6 @@ class CreateOfferModal { this.parentElement.appendChild(this.element); - this.amountInput = new AmountInput({ - parentElement: document.getElementById('amount-area'), - id: 'amount-area-content', - }); - this.amountInput.render(); this.placeInput = new PlaceInput({