Update HTML and CSS

This commit is contained in:
ekzyis 2023-09-10 23:39:47 +02:00
parent 7558655458
commit 50244ee9ca
6 changed files with 61 additions and 70 deletions

View File

@ -33,7 +33,7 @@
__| | ___| |_ __ | |__ (_)
/ _` |/ _ \ | '_ \| '_ \| |
| (_| | __/ | |_) | | | | |
\__,_|\___|_| .__/|_| |_|_|.market
\__,_|\___|_| .__/|_| |_|_|
|_| </pre>
</strong>
</code>

View File

@ -46,7 +46,7 @@
</div>
<div id="qr">
<a href="lightning:{{.lnurl}}">
<img class="m-auto mb-1" src="data:image/png;base64,{{.qr}}" width="100%" />
<img class="m-auto mb-1" src="data:image/png;base64,{{.qr}}" width="50%" />
</a>
<div class="font-mono word-wrap mb-1">{{.lnurl}}</div>
<details class="font-mono mb-1 align-left">

View File

@ -38,53 +38,25 @@
</strong>
</code>
<div class="font-mono mb-1">{{.Description}}</div>
<details open class="align-left">
<summary><span class="font-mono mb-1"><strong>Order Book</strong></span></summary>
<div class="align-left">
<span class="font-mono mb-1"><strong>Order Book</strong></span>
<table class="w-100p mb-1">
<tr>
<th class="align-left">BUY YES</th>
<th class="align-center">SELL</th>
<th class="align-right">BUY NO</th>
<th class="align-left"></th>
<th class="align-right"></th>
</tr>
{{ range .Orders }}
<tr>
{{ if and (eq .Share.Description "YES") (eq .Side "BUY") }}
<td>
<div class="flex yes">
<span class="align-left">YES</span>
<span style="width: 100%" class="align-right">{{.Quantity}} @ {{.Price}} ⚡</span>
</div>
</td>
{{ else }}
<td></td>
{{ end }}
{{ if (eq .Side "SELL") }}
<td>
<div class="flex no" style="width: 100%">
<span class="align-left">{{.Share.Description}}</span>
<span style="width: 100%" class="align-right">{{.Quantity}} @ {{.Price}} ⚡</span>
</div>
</td>
{{ else }}
<td></td>
{{ end }}
{{ if and (eq .Share.Description "NO") (eq .Side "BUY") }}
<td>
<div class="flex yes">
<span class="align-left">NO</span>
<span style="width: 100%" class="align-right">{{.Quantity}} @ {{.Price}} ⚡</span>
</div>
</td>
{{ else }}
<td></td>
{{ end }}
<tr class='{{ if eq .Side "BUY" }}yes{{ else }}no{{ end }}'>
<td class="align-center">{{ .Side }}</td>
<td class="align-center">{{ .Share.Description }}</td>
<td class="align-right">{{.Quantity}} @ {{.Price}} ⚡</td>
</tr>
{{ end }}
</table>
</details>
</div>
<hr />
<details open class="align-left">
<summary><span class="font-mono mb-1"><strong>Order Form</strong></span></summary>
<div class="align-left">
<span class="font-mono mb-1"><strong>Order Form</strong></span>
<form id="form" class="order-form" action="/market/{{$.Id}}/order" method="post">
<button id="buy" type="button" class="order-button yes w-100p selected">BUY</button>
<button id="sell" type="button" class="order-button no w-100p">SELL</button>
@ -102,7 +74,7 @@
<label id="submit-label"></label>
<button type="submit">SUBMIT</button>
</form>
</details>
</div>
</div>
</body>
<script src="/order.js"></script>

View File

@ -37,21 +37,28 @@
</strong>
</code>
<div class="font-mono mb-1 align-left word-wrap">
<div class="mb-1">
You are: {{substr .session.Pubkey 0 8}}
</div>
<details open class="align-left mb-1">
<summary><span class="font-mono mb-1"><strong>Open Orders</strong></span></summary>
<div>
<form class="align-left" action="/logout" method="post">
<button type="submit">logout</button>
</form>
</div>
</div>
<div class="align-left mb-1">
<span class="font-mono mb-1"><strong>Open Orders</strong></span>
<table class="w-100p mb-1">
<tr>
<th class="align-left">Market</th>
<th class="align-center">Side</th>
<th class="align-center">Share</th>
<th class="align-right">Quantity @ Price</th>
<th class="align-center">Market</th>
<th class="align-center"></th>
<th class="align-center"></th>
<th class="align-right"></th>
</tr>
{{ range .Orders }}
{{ if .Invoice.ConfirmedAt.Valid }}
<tr class='{{ if eq .Side "BUY" }}yes{{ else }}no{{ end }}'>
<td class="align-left">
<td class="align-center">
<a href="/market/{{.Share.MarketId}}">{{.Share.MarketId}}</a>
</td>
<td class="align-center">{{.Side}}</td>
@ -61,35 +68,32 @@
{{ end }}
{{ end }}
</table>
</details>
<details open class="align-left mb-1">
<summary><span class="font-mono mb-1"><strong>Unpaid Orders</strong></span></summary>
</div>
<div class="align-left mb-1">
<span class="font-mono mb-1"><strong>Unpaid Orders</strong></span>
<table class="w-100p mb-1">
<tr>
<th class="align-left">Market</th>
<th class="align-center">Side</th>
<th class="align-center">Share</th>
<th class="align-right">Quantity @ Price</th>
<th class="align-right">Invoice</th>
<th class="align-center">Market</th>
<th class="align-center"></th>
<th class="align-center"></th>
<th class="align-right"></th>
<th class="align-center">Invoice</th>
</tr>
{{ range .Orders }}
{{ if not .Invoice.ConfirmedAt.Valid }}
<tr class='{{ if eq .Side "BUY" }}yes{{ else }}no{{ end }}'>
<td class="align-left">
<td class="align-center">
<a href="/market/{{.Share.MarketId}}">{{.Share.MarketId}}</a>
</td>
<td class="align-center">{{.Side}}</td>
<td class="align-center">{{.Share.Description}}</td>
<td class="align-right">{{.Quantity}} @ {{.Price}} ⚡</td>
<td class="align-right"><a href="/invoice/{{.InvoiceId}}">invoice</a></td>
<td class="align-center"><a href="/invoice/{{.InvoiceId}}">invoice</a></td>
</tr>
{{ end }}
{{ end }}
</table>
</details>
<form class="align-left" action="/logout" method="post">
<button type="submit">logout</button>
</form>
</div>
</div>
<footer class="flex justify-center">
<div>

View File

@ -45,6 +45,16 @@ nav > form > button:hover {
color: #ffffff;
}
@media (min-width: 768px) {
#qr > a > img {
width: 50%;
}
}
@media (min-width: 1024px) {
#qr > a > img {
width: 30%;
}
}
#qr > a:hover {
background: none;
}
@ -67,6 +77,7 @@ ul {
box-sizing: border-box;
margin: 1em auto;
padding: 0 1em;
min-width: 40vw;
max-width: 100vw;
}
@ -84,7 +95,7 @@ ul {
@media (min-width: 1024px) {
.container {
max-width: 30vw;
max-width: 60vw;
}
}

View File

@ -41,3 +41,7 @@ button.no.selected {
background-color: #ff7386;
color: white;
}
th {
font-size: small;
}