Update HTML and CSS
This commit is contained in:
parent
7558655458
commit
50244ee9ca
@ -33,8 +33,8 @@
|
||||
__| | ___| |_ __ | |__ (_)
|
||||
/ _` |/ _ \ | '_ \| '_ \| |
|
||||
| (_| | __/ | |_) | | | | |
|
||||
\__,_|\___|_| .__/|_| |_|_|.market
|
||||
|_| </pre>
|
||||
\__,_|\___|_| .__/|_| |_|_|
|
||||
|_| </pre>
|
||||
</strong>
|
||||
</code>
|
||||
<div class="font-mono mb-1">A prediction market using the lightning network [WIP]</div>
|
||||
|
@ -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">
|
||||
|
@ -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>
|
||||
|
@ -37,21 +37,28 @@
|
||||
</strong>
|
||||
</code>
|
||||
<div class="font-mono mb-1 align-left word-wrap">
|
||||
You are: {{substr .session.Pubkey 0 8}}
|
||||
<div class="mb-1">
|
||||
You are: {{substr .session.Pubkey 0 8}}
|
||||
</div>
|
||||
<div>
|
||||
<form class="align-left" action="/logout" method="post">
|
||||
<button type="submit">logout</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<details open class="align-left mb-1">
|
||||
<summary><span class="font-mono mb-1"><strong>Open Orders</strong></span></summary>
|
||||
<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>
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -41,3 +41,7 @@ button.no.selected {
|
||||
background-color: #ff7386;
|
||||
color: white;
|
||||
}
|
||||
|
||||
th {
|
||||
font-size: small;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user