UI improvements
This commit is contained in:
parent
a8c2c6187e
commit
b293fb3f06
27
css/main.css
27
css/main.css
@ -37,9 +37,9 @@ body[data-theme=dark] * {
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 0.8;
|
||||
font-size: 0.9rem;
|
||||
max-width: 65ch;
|
||||
line-height: 1.7;
|
||||
line-height: 1.5;
|
||||
color: rgba(var(--text-color), 0.8);
|
||||
}
|
||||
|
||||
@ -427,13 +427,34 @@ main {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#banner {
|
||||
padding: 1.5rem;
|
||||
background-color: rgba(var(--text-color), 0.06);
|
||||
border-radius: 0.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
table {
|
||||
max-width: 38rem;
|
||||
}
|
||||
|
||||
tr:nth-of-type(2n + 1) {
|
||||
background: rgba(var(--text-color), 0.06);
|
||||
}
|
||||
tr td {
|
||||
padding: 0.5rem 0;
|
||||
padding: 0.8rem;
|
||||
text-align: center;
|
||||
}
|
||||
tr td:first-of-type {
|
||||
text-align: left;
|
||||
}
|
||||
tr td:last-of-type {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 640px) {
|
||||
main {
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -34,9 +34,9 @@ body[data-theme="dark"] {
|
||||
}
|
||||
}
|
||||
p {
|
||||
font-size: 0.8;
|
||||
font-size: 0.9rem;
|
||||
max-width: 65ch;
|
||||
line-height: 1.7;
|
||||
line-height: 1.5;
|
||||
color: rgba(var(--text-color), 0.8);
|
||||
}
|
||||
img {
|
||||
@ -350,15 +350,33 @@ main {
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
#banner {
|
||||
padding: 1.5rem;
|
||||
background-color: rgba(var(--text-color), 0.06);
|
||||
border-radius: 0.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
table {
|
||||
max-width: 38rem;
|
||||
}
|
||||
tr {
|
||||
&:nth-of-type(2n + 1) {
|
||||
background: rgba(var(--text-color), 0.06);
|
||||
}
|
||||
td {
|
||||
padding: 0.5rem 0;
|
||||
padding: 0.8rem;
|
||||
text-align: center;
|
||||
&:first-of-type {
|
||||
text-align: left;
|
||||
}
|
||||
&:last-of-type {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
.stat-value {
|
||||
font-weight: 700;
|
||||
}
|
||||
@media screen and (max-width: 640px) {
|
||||
main {
|
||||
grid-template-rows: auto 1fr;
|
||||
|
||||
106
index.html
106
index.html
@ -271,18 +271,17 @@
|
||||
</nav>
|
||||
<article class="right language-html">
|
||||
<section id="dashboard" class="page">
|
||||
<h1 class="page__title">Tokenroom Economic system</h1>
|
||||
<div class="grid gap-0-5">
|
||||
<div>
|
||||
<p>Target: Consumption Valuation should be higher than Production valuation</p>
|
||||
<p>Amount to go till Consumption Valuation catches up with production Valuation</p>
|
||||
</div>
|
||||
<div id="amount-left-production-consumption-catchup">
|
||||
<div class="grid gap-0-5" id="banner">
|
||||
<strong> Target </strong>
|
||||
<p>Consumption Valuation should be higher than Production valuation.
|
||||
Amount to go till Consumption Valuation catches up with production Valuation
|
||||
</p>
|
||||
<b id="amount-left-production-consumption-catchup">
|
||||
<sm-spinner></sm-spinner>
|
||||
</div>
|
||||
</b>
|
||||
</div>
|
||||
<br>
|
||||
<div class="card-wrapper">
|
||||
<!-- <div class="card-wrapper">
|
||||
<div class="card">
|
||||
<h3>Expenses</h3>
|
||||
<p id="total-amount-issued">
|
||||
@ -302,13 +301,13 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Revenue (Booked + stayed)</h3>
|
||||
<h3>Gross Revenue (Booked + stayed)</h3>
|
||||
<p id="total-consumption-cost">
|
||||
<sm-spinner></sm-spinner>
|
||||
</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Consumption valuation</h3>
|
||||
<h3>Revenue from stays</h3>
|
||||
<p id="consumption-valuation">
|
||||
<sm-spinner></sm-spinner>
|
||||
</p>
|
||||
@ -319,7 +318,90 @@
|
||||
<sm-spinner></sm-spinner>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
Expenses
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="total-amount-issued" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
Price per room night
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="price-per-unit-consumption" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
Total room nights stayed
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="total-consumption-measured" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
Gross Revenue (Booked + stayed)
|
||||
Total room nights stayed
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="total-consumption-cost" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
Revenue from stays
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="consumption-valuation" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<h4>
|
||||
System Valuation
|
||||
</h4>
|
||||
<p>
|
||||
Includes rent of the property, maintenance, staff salaries, etc.
|
||||
</p>
|
||||
</td>
|
||||
<td id="system-valuation" class="stat-value">
|
||||
<sm-spinner></sm-spinner>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<section id="userinfo" class="page hide">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user