secajs/src/views/offers.ejs
2025-02-24 17:11:02 +01:00

157 lines
4.9 KiB
Text

<!DOCTYPE html>
<html lang="en">
<head>
<title>Seca home</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/css/seca.css" />
<link rel="stylesheet" href="/css/offers.css" />
</head>
<body>
<%- include("partials/appCommonHeader") %>
<div class="over-background" id="offers-root">
<button
id="button-start-create-offer"
class="button-primary button-medium font-medium"
style="display: block"
>
Crear nueva oferta
</button>
<div
id="create-offer-controls"
style="display: none; border: 1px solid purple"
>
<div id="close-offer-controls-area">
<img
id="close-offer-controls-x"
src="/img/circle-xmark.svg"
class="clickable"
/>
</div>
<h2>Añade los detalles de tu oferta</h2>
<div id="button-group-buy-or-sell" class="button-group">
<button
data-value="buy-bitcoin"
id="button-buy-bitcoin"
class="selected"
>
Quiero comprar Bitcoin</button
><button data-value="sell-bitcoin" id="button-sell-bitcoin">
Quiero vender Bitcoin
</button>
</div>
<div id="premium-area">
<h3>Premium</h3>
<div id="premium-content-area">
<div id="premium-selector-area">
<div id="premium-value">0%</div>
<button class="premium-button" id="button-increase-premium">
+</button
><button class="premium-button" id="button-decrease-premium">
-
</button>
</div>
<div id="premium-price-display-area">
<p>
Tu precio: <span id="offer-price">90 000</span>€/BTC
<span>(Precio mercado: <span>83 000</span>€/BTC)</span>
</p>
</div>
</div>
</div>
<div id="amount-area">
<h3>¿Cuánto?</h3>
<div id="amount-area-content">
<div id="eur-amount" class="money-amount-input-area">
<input
id="input-eur-amount"
type="text"
class="money-input input-money-amount"
required
/><!--
-->
<div id="eur-symbol" class="curr-symbol">
<span id="eur-character" class="curr-character">€</span>
</div>
</div>
<div id="btc-amount" class="money-amount-input-area">
<input
id="input-btc-amount"
type="text"
class="money-input input-money-amount"
disabled
/><!--
-->
<div id="sats-symbol" class="curr-symbol">
<span id="sats-character" class="curr-character">SAT</span>
</div>
</div>
</div>
</div>
<div id="bitcoin-methods-area">
<p>¿Cómo se mueve el Bitcoin?</p>
<label for="onchain">Onchain</label
><input
type="checkbox"
name="onchain"
id="onchain-checkbox"
checked
/>
<label for="lightning">Lightning</label
><input
type="checkbox"
name="lightning"
id="lightning-checkbox"
checked
/>
<p id="at-least-one-checkbox" style="display: none">
Tienes que seleccionar al menos una opción.
</p>
</div>
<div id="trust-area">
<p>¿Quién puede ver la oferta?</p>
<label for="my-trusted">Mis confiados</label
><input
type="checkbox"
name="my-trusted"
id="my-trusted-checkbox"
checked
disabled
/>
<label for="my-trusted-trusted">Los confiados de mis confiados</label
><input
type="checkbox"
name="my-trusted-trusted"
id="my-trusted-trusted-checkbox"
checked
/>
<label for="all-members">Todos los miembros</label
><input
type="checkbox"
name="all-members"
id="all-members-checkbox"
/>
</div>
<div id="other-area">
<label for="large-bills"
>Se pueden usar billetes grandes (100€, 200€, 500€)</label
><input
type="checkbox"
name="large-bills"
id="large-bills-checkbox"
/>
</div>
<button id="button-submit-offer" class="button-primary" disabled>
Publicar oferta
</button>
</div>
</div>
<%- include("partials/appCommonScripts") %>
<script src="/javascript/offers.js"></script>
<script src="/javascript/utils.js"></script>
</body>
</html>