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

visual stuff

Browse source
This commit is contained in:
counterweight 2025-02-24 16:46:26 +01:00
parent bda4277d13
commit 716dc726b5
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
4 changed files with 145 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

52
src/public/css/offers.css
View file

@ -7,6 +7,10 @@
#close-offer-controls-x {
width: 25px;
}
#premium-selector-area {
width: 60px;
}
}
@media (min-width: 769px) {
@ -18,14 +22,18 @@
#close-offer-controls-x {
width: 50px;
}
}
#premium-selector-area {
width: 100px;
}
}
#create-offer-controls > * {
text-align: center;
margin-left: 15%;
margin-right: 15%;
width: 70%
width: 70%;
}
#close-offer-controls-area {
@ -33,6 +41,46 @@
justify-content: end;
}
#premium-area > * {
display: block;
}
#premium-content-area {
width: 80%;
margin-left: auto;
margin-right: auto;
}
#premium-content-area > * {
display: inline-block;
margin: 0 auto;
}
#premium-selector-area > * {
display: inline-block;
}
#premium-selector-area {
width:23%;
margin-left: 0;
margin-right: 5%;
}
#premium-value {
border: 1px solid gray;
width: 100%;
}
.premium-button {
width: 45%;
}
#premium-price-display-area {
margin-left: 0;
margin-right: 0;
width: 70%;
}
.money-amount-input-area {
padding: 0;
width: 10em;

2
src/public/css/seca.css
View file

@ -31,7 +31,7 @@
.button-medium {
height: 3em;
padding: 1em;
border-radius: 10px;
border-radius: 10px;
}
}

95
src/views/offers.ejs
View file

@ -12,18 +12,25 @@
<%- 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;">
<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="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>
<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
@ -37,10 +44,23 @@
</button>
</div>
<div id="premium-area">
<p>Premium</p>
<div id="premium-value">0%</div>
<button id="button-increase-premium">+</button
><button id="button-decrease-premium">-</button>
<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">
<p>¿Cuánto?</p>
@ -56,7 +76,6 @@
</div>
</div>
<div id="btc-amount" class="money-amount-input-area">
<input
id="input-btc-amount"
type="text"
@ -71,23 +90,55 @@
<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/>
><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>
><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/>
><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/>
><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"/>
><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"/>
<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

25
src/views/partials/appCommonHeader.ejs
View file

@ -1,7 +1,24 @@
<div class="over-background">
<h1>la seca</h1>
<button id="navbutton-home" class="button-primary font-medium button-medium">Home</button>
<button id="navbutton-offers" class="button-primary font-medium button-medium">Ofertas</button>
<button id="navbutton-network" class="button-primary font-medium button-medium">Red</button>
<button id="navbutton-profile" class="button-primary font-medium button-medium">Mi perfil</button>
<button id="navbutton-home" class="button-primary font-medium button-medium">
Home
</button>
<button
id="navbutton-offers"
class="button-primary font-medium button-medium"
>
Ofertas
</button>
<button
id="navbutton-network"
class="button-primary font-medium button-medium"
>
Red
</button>
<button
id="navbutton-profile"
class="button-primary font-medium button-medium"
>
Mi perfil
</button>
</div>