mirror of
https://github.com/darkrenaissance/darkfi.git
synced 2026-01-09 14:48:08 -05:00
1020627ebe
This commit updates the Explorer application’s UI, providing a preliminary re-theming inspired by the Darkfi Book site. The updated design offers a familiar and visually appealing interface, along with improvements to responsiveness and usability on larger displays. These updates include changes to styling, layout, and modifications to key pages, such as the home page, block page, and transaction page. This implementation represents the initial stage of improving the UI, making it more appealing for development and demos. It is not final, as further improvements will be made iteratively.
123 lines
3.9 KiB
HTML
123 lines
3.9 KiB
HTML
<!--
|
|
This file is part of DarkFi (https://dark.fi)
|
|
|
|
Copyright (C) 2020-2024 Dyne.org foundation
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
-->
|
|
|
|
{% extends "base.html" %}
|
|
{% block title %}Explorer{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="content-container">
|
|
|
|
<!-- Explorer Search -->
|
|
<div class="search-container">
|
|
<h1>Explore</h1>
|
|
<form action="/search">
|
|
<input class="search-input" type="text" placeholder="Search for a block or transaction.." name="search_hash">
|
|
</form>
|
|
</div>
|
|
|
|
<!--Network Summary -->
|
|
<div class="content-section" style="padding-bottom: 0px;">
|
|
<h2 class="content-section-header">Network Summary</h2>
|
|
<ul>
|
|
<li>Height: {{ basic_stats[0] }}</li>
|
|
<li>Epoch: {{ basic_stats[1] }}</li>
|
|
<li>Last block: <a href="block/{{ basic_stats[2] }}">{{ basic_stats[2] }}</a></li>
|
|
<li>Total blocks: {{ basic_stats[3] }}</li>
|
|
<li>Total transactions: {{ basic_stats[4] }}</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!--Latest Blocks -->
|
|
<div class="content-section">
|
|
<h2 class="content-section-header">Latest Blocks</h2>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Height</th>
|
|
<th>Hash</th>
|
|
<th>Timestamp</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for block in blocks %}
|
|
<tr>
|
|
<td>{{ block[3] }}</td>
|
|
<td><a href="block/{{ block[0] }}">{{ block[0] }}</a></td>
|
|
<td>{{ block[4] }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!--Total Network Gas Consumption -->
|
|
<div class="content-section">
|
|
<h2 class="content-section-header">Total Network Gas Consumption</h2>
|
|
{% if metric_stats %}
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th>Average</th>
|
|
<th>Minimum</th>
|
|
<th>Maximum</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Total</td>
|
|
<td>{{ metric_stats[0] }}</td>
|
|
<td>{{ metric_stats[1] }}</td>
|
|
<td>{{ metric_stats[2] }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>WASM</td>
|
|
<td>{{ metric_stats[3] }}</td>
|
|
<td>{{ metric_stats[4] }}</td>
|
|
<td>{{ metric_stats[5] }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>ZK Circuits</td>
|
|
<td>{{ metric_stats[6] }}</td>
|
|
<td>{{ metric_stats[7] }}</td>
|
|
<td>{{ metric_stats[8] }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Signatures</td>
|
|
<td>{{ metric_stats[9] }}</td>
|
|
<td>{{ metric_stats[10] }}</td>
|
|
<td>{{ metric_stats[11] }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Deployments</td>
|
|
<td>{{ metric_stats[12] }}</td>
|
|
<td>{{ metric_stats[13] }}</td>
|
|
<td>{{ metric_stats[14] }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
{% else %}
|
|
Gas consumption details are not available.
|
|
{% endif %}
|
|
</div>
|
|
|
|
</div>
|
|
{% endblock %}
|
|
|