counterweight/secajs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixes bloody sizing

Browse source
This commit is contained in:
counterweight 2025-02-24 00:31:17 +01:00
parent adb393f740
commit b3cb690c3d
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
3 changed files with 44 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/public/css/offers.css Normal file
View file

@ -0,0 +1,28 @@
#eur-amount {
padding: 0;
width: 50%;
}
#eur-amount > * {
display: inline-block;
font-size: 1em;
height: 2em;
vertical-align: middle;
}
#input-eur-amount {
width:75%;
}
#eur-amount #eur-symbol {
background-color: #d8d8d8;
width: 25%;
}
#eur-amount #eur-symbol #eur-character {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}

2
src/public/javascript/offers.js
View file

@ -55,7 +55,7 @@ function toggleBuyOrSellButtonGroup() {
function validateAndFormatEurAmountInput() { function validateAndFormatEurAmountInput() {
const eurAmountFieldValue = eurAmountInput.value; const eurAmountFieldValue = eurAmountInput.value;
const regularExpression = /€?\s?(\d+[\.,]?\d*)\s?€?/; const regularExpression = /€?\s?(\d+[.,]?\d*)\s?€?/;
const matchResult = eurAmountFieldValue.match(regularExpression); const matchResult = eurAmountFieldValue.match(regularExpression);
eurAmountInput.classList.remove('input-is-valid', 'input-is-invalid'); eurAmountInput.classList.remove('input-is-valid', 'input-is-invalid');

18
src/views/offers.ejs
View file

@ -5,6 +5,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/css/seca.css" /> <link rel="stylesheet" href="/css/seca.css" />
<link rel="stylesheet" href="/css/offers.css" />
</head> </head>
<body> <body>
@ -41,12 +42,23 @@
</div> </div>
<div id="amount-area"> <div id="amount-area">
<p>¿Cuánto?</p> <p>¿Cuánto?</p>
<input id="input-eur-amount" type="text" required class="money-input"> <div id="eur-amount">
<input
id="input-eur-amount"
type="text"
required
class="money-input"
/><div id="eur-symbol">
<span id="eur-character">€</span>
</div>
</div>
</div> </div>
<div id="bitcoin-methods-area"> <div id="bitcoin-methods-area">
<p>¿Cómo se mueve el Bitcoin?</p> <p>¿Cómo se mueve el Bitcoin?</p>
<label for="onchain">Onchain</label><input type="checkbox" name="onchain" id="onchain-checkbox"> <label for="onchain">Onchain</label
<label for="lightning">Lightning</label><input type="checkbox" name="lightning" id="lightning-checkbox"> ><input type="checkbox" name="onchain" id="onchain-checkbox" />
<label for="lightning">Lightning</label
><input type="checkbox" name="lightning" id="lightning-checkbox" />
</div> </div>
<button id="button-submit-offer" class="button-primary" disabled> <button id="button-submit-offer" class="button-primary" disabled>
Publicar oferta Publicar oferta