zecfoundation
/
zcash-explorer
mirror of https://github.com/ZcashFoundation/zcash-explorer.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Dark Mode

This commit is contained in:
Vamsi Krishna B 2022-12-31 19:00:39 +05:30
parent d8dee71f2d
commit 284ca3d35a
32 changed files with 451 additions and 303 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
assets/js/app.js
View File

@ -34,4 +34,43 @@ liveSocket.connect()
window.liveSocket = liveSocket window.liveSocket = liveSocket
liveSocket.enableDebug() liveSocket.enableDebug()
var themeToggleDarkIcon = document.getElementById('theme-toggle-dark-icon');
var themeToggleLightIcon = document.getElementById('theme-toggle-light-icon');
// Change the icons inside the button based on previous settings
if (localStorage.getItem('color-theme') === 'dark' || (!('color-theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
themeToggleLightIcon.classList.remove('hidden');
} else {
themeToggleDarkIcon.classList.remove('hidden');
}
var themeToggleBtn = document.getElementById('theme-toggle');
themeToggleBtn.addEventListener('click', function () {
// toggle icons inside button
themeToggleDarkIcon.classList.toggle('hidden');
themeToggleLightIcon.classList.toggle('hidden');
// if set via local storage previously
if (localStorage.getItem('color-theme')) {
if (localStorage.getItem('color-theme') === 'light') {
document.documentElement.classList.add('dark');
localStorage.setItem('color-theme', 'dark');
} else {
document.documentElement.classList.remove('dark');
localStorage.setItem('color-theme', 'light');
}
// if NOT set via local storage previously
} else {
if (document.documentElement.classList.contains('dark')) {
document.documentElement.classList.remove('dark');
localStorage.setItem('color-theme', 'light');
} else {
document.documentElement.classList.add('dark');
localStorage.setItem('color-theme', 'dark');
}
}
});

98
assets/static/privacy.html
View File

@ -1,53 +1,89 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Privacy Policy</title>
<link rel="stylesheet" href="/css/app.css"/>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Zcash Explorer - Privacy Policy</title>
<link rel="stylesheet" href="/css/app.css">
<meta content="EhhiDTAnERsYAX9XNwgLGTtSJkkBSgsCajZLWOuukVK0SGZjHeVz89xF" name="csrf-token">
<script defer type="text/javascript" src="/js/app.js"></script> <script defer type="text/javascript" src="/js/app.js"></script>
<script>
if (localStorage.getItem('color-theme') === 'dark' || (!('color-theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark')
}
</script>
</head> </head>
<body> <body>
<header> <header>
<nav x-data="{ open: false }" class="flex-shrink-0 bg-indigo-600"> <nav x-data="{ open: false }" class="shrink-0 bg-indigo-600 dark:bg-gray-800">
<div class="max-w-7xl mx-auto px-2 sm:px-4 lg:px-8"> <div class="max-w-7xl mx-auto px-2 sm:px-4 lg:px-8">
<div class="relative flex items-center justify-between h-16"> <div class="relative flex items-center justify-between h-16">
<!-- Logo section --> <!-- Logo section -->
<div class="flex items-center px-2 lg:px-0 xl:w-64"> <div class="flex items-center px-2 lg:px-0 xl:w-64">
<a href="/"> <a href="/">
<div class="flex-shrink-0"> <div class="shrink-0">
<img class="h-8 w-auto" src="/images/zcash-icon-white.svg" alt="Block Explorer"> <img class="h-8 w-auto" src="/images/zcash-icon-white.svg" alt="Zcash Block Explorer">
</div> </div>
</a> </a>
<a href="/"> <a href="/">
<div class="flex-shrink-0 px-1 text-white"> <div class="shrink-0 px-1 text-white dark:text-white">
Block Explorer ( beta ) Zcash Block Explorer
</div> </div>
</a> </a>
</div> </div>
<!-- Search section --> <!-- Search section -->
<div class="flex-1 flex justify-center lg:justify-end"> <div class="flex-1 flex justify-center lg:justify-end">
<div class="w-full px-2 lg:px-6"> <div class="w-full px-2 lg:px-6">
<label for="search" class="sr-only">transaction / block / address</label> <label for="search" class="sr-only">transaction / block / address</label>
<div class="relative text-indigo-200 focus-within:text-gray-400"> <div class="relative text-gray-200 dark:text-slate-200 focus-within:text-gray-400 dark:focus-within:text-slate-800">
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"> <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<svg class="h-5 w-5" x-description="Heroicon name: solid/search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <svg class="h-5 w-5" x-description="Heroicon name: solid/search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path> <path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path>
</svg> </svg>
</div> </div>
<form action="/search"> <form action="/search">
<input id="search" name="qs" class="block w-full pl-10 pr-3 py-2 bg-white border border-transparent rounded-md leading-5 bg-indigo-400 bg-opacity-25 text-indigo-100 placeholder-indigo-200 focus:outline-none focus:bg-white focus:ring-0 focus:placeholder-gray-400 focus:text-gray-900 sm:text-sm" placeholder="transaction / block / address" type="search"> <input id="search" name="qs" class="
block
w-full
pl-10
pr-3
py-2
border
border-transparent
rounded-md
leading-5
text-indigo-100
placeholder-indigo-200
focus:outline-none
focus:bg-white
focus:ring-0 focus:placeholder-gray-400
focus:text-gray-900
sm:text-sm
dark:focus:placeholder-white
dark:border-slate-600
dark:placeholder-slate-400
dark:text-white
dark:focus:ring-slate-500
dark:focus:border-slate-500
dark:hover:bg-slate-700 dark:focus:ring-slate-800
bg-white/25
dark:bg-slate-700
dark:focus:bg-slate-600
dark:placeholder-slate-200
dark:focus:text-gray-200
" placeholder="transaction / block / address" type="search">
</form> </form>
</div> </div>
</div> </div>
</div> </div>
<div class="flex lg:hidden"> <div class="flex lg:hidden">
<!-- Mobile menu button --> <!-- Mobile menu button -->
<button type="button" class="bg-indigo-600 inline-flex items-center justify-center p-2 rounded-md text-indigo-400 hover:text-white hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-indigo-600 focus:ring-white" aria-controls="mobile-menu" @click="open = !open" aria-expanded="true" x-bind:aria-expanded="open.toString()"> <button type="button" class="bg-indigo-600 dark:bg-slate-600 inline-flex items-center justify-center p-2 rounded-md text-indigo-400 dark:text-white hover:text-white hover:bg-indigo-600 dark:hover:bg-slate-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-indigo-600 dark:focus:ring-offset-slate-600 focus:ring-white dark:focus:ring-white" aria-controls="mobile-menu" @click="open = !open" aria-expanded="true" x-bind:aria-expanded="open.toString()">
<span class="sr-only">Open main menu</span> <span class="sr-only">Open main menu</span>
<svg x-description="Icon when menu is closed. <svg x-description="Icon when menu is closed.
Heroicon name: outline/menu-alt-1" x-state:on="Menu open" x-state:off="Menu closed" class="h-6 w-6 hidden" :class="{ 'hidden': open, 'block': !(open) }" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> Heroicon name: outline/menu-alt-1" x-state:on="Menu open" x-state:off="Menu closed" class="h-6 w-6 hidden" :class="{ 'hidden': open, 'block': !(open) }" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
@ -64,13 +100,13 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
<div class="flex items-center justify-end"> <div class="flex items-center justify-end">
<div class="flex"> <div class="flex">
<a href="/mempool" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white">Mempool</a> <a href="/mempool" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white dark:text-gray-400">Mempool</a>
<a href="/blocks" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white">Blocks</a> <a href="/blocks" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white dark:text-gray-400">Blocks</a>
<div x-data="{ open: false }" @keydown.escape.stop="open = false" @click.away="open = false" class="relative inline-block text-left"> <div x-data="{ open: false }" @keydown.escape.stop="open = false" @click.away="open = false" class="relative inline-block text-left">
<div> <div>
<button type="button" class=" inline-flex justify-center rounded-md px-4 py-2 text-sm font-medium focus:outline-none text-indigo-200 hover:text-white" id="options-menu" aria-expanded="true" @click="open = !open" aria-haspopup="true" x-bind:aria-expanded="open"> <button type="button" class=" inline-flex justify-center rounded-md px-4 py-2 text-sm font-medium focus:outline-none text-indigo-200 hover:text-white dark:text-gray-400" id="options-menu" aria-expanded="true" @click="open = !open" aria-haspopup="true" x-bind:aria-expanded="open">
Tools Tools
<svg class="-mr-1 ml-2 h-5 w-5" x-description="Heroicon name: solid/chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <svg class="-mr-1 ml-2 h-5 w-5" x-description="Heroicon name: solid/chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path> <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
@ -78,14 +114,12 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
</button> </button>
</div> </div>
<div x-description="Dropdown menu, show/hide based on menu state." x-show="open" x-transition:enter="transition ease-out duration-100" x-transition:enter-start="transform opacity-0 scale-95" x-transition:enter-end="transform opacity-100 scale-100" x-transition:leave="transition ease-in duration-75" x-transition:leave-start="transform opacity-100 scale-100" x-transition:leave-end="transform opacity-0 scale-95" class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="options-menu"> <div x-description="Dropdown menu, show/hide based on menu state." x-show="open" x-transition:enter="transition ease-out duration-100" x-transition:enter-start="transform opacity-0 scale-95" x-transition:enter-end="transform opacity-100 scale-100" x-transition:leave="transition ease-in duration-75" x-transition:leave-start="transform opacity-100 scale-100" x-transition:leave-end="transform opacity-0 scale-95" class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-gray-300" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
<div class="py-1" role="none"> <div class="py-1" role="none">
<a href="/nodes" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Nodes</a> <a href="/nodes" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Nodes</a>
<a href="/broadcast" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Broadcast Transaction</a> <a href="/broadcast" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Broadcast Transaction</a>
<a href="/payment-disclosure" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Payment Disclosure</a> <a href="/payment-disclosure" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Payment Disclosure</a>
</div> <a href="/vk" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Viewing Key</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -93,6 +127,14 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
</div> </div>
</div> </div>
<button id="theme-toggle" type="button" class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5">
<svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
<svg id="theme-toggle-light-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
</button>
</div>
</div>
<div x-description="Mobile menu, show/hide based on menu state." class="lg:hidden" id="mobile-menu" x-show="open"> <div x-description="Mobile menu, show/hide based on menu state." class="lg:hidden" id="mobile-menu" x-show="open">
<div class="px-2 pt-2 pb-3"> <div class="px-2 pt-2 pb-3">
@ -108,6 +150,9 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
<a href="/broadcast" class="text-indigo-200 hover:text-indigo-100 hover:bg-indigo-600 block px-3 py-2 rounded-md text-base font-medium">Broadcast Transaction</a> <a href="/broadcast" class="text-indigo-200 hover:text-indigo-100 hover:bg-indigo-600 block px-3 py-2 rounded-md text-base font-medium">Broadcast Transaction</a>
<a href="/payment-disclosure" class="text-indigo-200 hover:text-indigo-100 hover:bg-indigo-600 block px-3 py-2 rounded-md text-base font-medium">Payment Disclosure</a> <a href="/payment-disclosure" class="text-indigo-200 hover:text-indigo-100 hover:bg-indigo-600 block px-3 py-2 rounded-md text-base font-medium">Payment Disclosure</a>
<a href="/vk" class="text-indigo-200 hover:text-indigo-100 hover:bg-indigo-600 block px-3 py-2 rounded-md text-base font-medium">Viewing Key</a>
</div> </div>
</div> </div>
</div> </div>
@ -188,7 +233,8 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
</a> </a>
</div> </div>
<p class="mt-8 text-center text-base text-gray-400"> <p class="mt-8 text-center text-base text-gray-400">
&copy; 2021 Nighthawk Apps. &copy; <script>document.write(/\d{4}/.exec(Date())[0])</script>
Nighthawk Apps.
<span class="block sm:inline">Funded by Zcash Community Grants.</span> <span class="block sm:inline">Funded by Zcash Community Grants.</span>
</p> </p>
</div> </div>

1
assets/tailwind.config.js
View File

@ -2,6 +2,7 @@ const colors = require('tailwindcss/colors')
const defaultTheme = require('tailwindcss/defaultTheme') const defaultTheme = require('tailwindcss/defaultTheme')
module.exports = { module.exports = {
darkMode: 'class',
content: [ content: [
'../lib/**/*.ex', '../lib/**/*.ex',
'../lib/**/*.leex', '../lib/**/*.leex',

2
lib/zcash_explorer_web/live/block_count_live.ex
View File

@ -5,7 +5,7 @@ defmodule ZcashExplorerWeb.BlockCountLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= @block_count %> <%= @block_count %>
</p> </p>
""" """

28
lib/zcash_explorer_web/live/blockchain_info_live.ex
View File

@ -7,65 +7,65 @@ defmodule ZcashExplorerWeb.BlockChainInfoLive do
~L""" ~L"""
<div> <div>
<dl class="mt-5 grid grid-cols-1 gap-5 sm:grid-cols-3"> <dl class="mt-5 grid grid-cols-1 gap-5 sm:grid-cols-3">
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Blocks Blocks
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= @blockchain_info["blocks"] %> <%= @blockchain_info["blocks"] %>
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Commitments Commitments
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= @blockchain_info["commitments"] %> <%= @blockchain_info["commitments"] %>
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Difficulty Difficulty
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= @blockchain_info["difficulty"] %> <%= @blockchain_info["difficulty"] %>
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Sprout pool Sprout pool
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= sprout_value(@blockchain_info["valuePools"]) %> ZEC <%= sprout_value(@blockchain_info["valuePools"]) %> ZEC
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Sapling pool Sapling pool
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= sapling_value(@blockchain_info["valuePools"]) %> ZEC <%= sapling_value(@blockchain_info["valuePools"]) %> ZEC
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
Orchard pool Orchard pool
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= orchard_value(@blockchain_info["valuePools"]) %> ZEC <%= orchard_value(@blockchain_info["valuePools"]) %> ZEC
</dd> </dd>
</div> </div>
<div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6"> <div class="px-4 py-5 bg-white shadow rounded-lg overflow-hidden sm:p-6 dark:bg-gray-800">
<dt class="text-sm font-medium text-gray-500 truncate"> <dt class="text-sm font-medium text-gray-500 truncate">
zcashd version zcashd version
</dt> </dt>
<dd class="mt-1 text-3xl font-semibold text-gray-900"> <dd class="mt-1 text-3xl font-semibold text-gray-900 dark:text-white">
<%= @blockchain_info["build"] %> <%= @blockchain_info["build"] %>
</dd> </dd>
</div> </div>

2
lib/zcash_explorer_web/live/blockchain_size_live.ex
View File

@ -4,7 +4,7 @@ defmodule ZcashExplorerWeb.BlockChainSizeLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= Sizeable.filesize(@blockchain_size) %> <%= Sizeable.filesize(@blockchain_size) %>
</p> </p>
""" """

2
lib/zcash_explorer_web/live/difficulty_live.ex
View File

@ -4,7 +4,7 @@ defmodule ZcashExplorerWeb.DifficultyLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= Float.ceil(@difficulty,6) %> <%= Float.ceil(@difficulty,6) %>
</p> </p>
""" """

2
lib/zcash_explorer_web/live/mempool_info_live.ex
View File

@ -4,7 +4,7 @@ defmodule ZcashExplorerWeb.MempoolInfoLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= @mempool_info %> <%= @mempool_info %>
</p> </p>
""" """

2
lib/zcash_explorer_web/live/networksolps_live.ex
View File

@ -4,7 +4,7 @@ defmodule ZcashExplorerWeb.NetworkSolpsLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= @networksolps %> <%= @networksolps %>
</p> </p>
""" """

20
lib/zcash_explorer_web/live/nodes_live.ex
View File

@ -4,25 +4,25 @@ defmodule ZcashExplorerWeb.NodesLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden border-gray-200 rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<thead class="bg-white-500"> <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Address</th> <th scope="col" class="px-6 py-3">Address</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Version</th> <th scope="col" class="px-4 py-3">Version</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Block Height</th> <th scope="col" class="px-4 py-3">Block Height</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white-500 divide-y divide-gray-200"> <tbody class="bg-white-500 divide-y divide-gray-200">
<%= for node <- @zcash_nodes do %> <%= for node <- @zcash_nodes do %>
<tr class="hover:bg-indigo-50"> <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-indigo-500"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 animate-pulse dark:text-white dark:hover:text-white">
<%= node["addr"] %> <%= node["addr"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-medium">
<%= node["subver"] %> <%= node["subver"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-medium">
<%= node["synced_blocks"] %> <%= node["synced_blocks"] %>
</td> </td>
</tr> </tr>

2
lib/zcash_explorer_web/live/orchard_pool_live.ex
View File

@ -4,7 +4,7 @@ defmodule ZcashExplorerWeb.OrchardPoolLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<p class="text-2xl font-semibold text-gray-900"> <p class="text-2xl font-semibold text-gray-900 dark:dark:bg-slate-800 dark:text-slate-100">
<%= orchard_value(@blockchain_info["valuePools"]) %> ZEC <%= orchard_value(@blockchain_info["valuePools"]) %> ZEC
</p> </p>
""" """

28
lib/zcash_explorer_web/live/raw_mempool_live.ex
View File

@ -4,35 +4,35 @@ defmodule ZcashExplorerWeb.RawMempoolLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden border-gray-200 rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<thead class="bg-white-500"> <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Tx ID</th> <th scope="col" class="px-6 py-3">Tx ID</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Block</th> <th scope="col" class="px-4 py-3">Block</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Time</th> <th scope="col" class="px-4 py-3">Time</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Fee</th> <th scope="col" class="px-4 py-3">Fee</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Size</th> <th scope="col" class="px-4 py-3">Size</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white-500 divide-y divide-gray-200"> <tbody class="bg-white-500 divide-y divide-gray-200">
<%= for tx <- @raw_mempool do %> <%= for tx <- @raw_mempool do %>
<tr class="hover:bg-indigo-50"> <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 animate-pulse"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 animate-pulse dark:text-white dark:hover:text-white">
<a href='/transactions/<%= tx["txid"] %>'> <a href='/transactions/<%= tx["txid"] %>'>
<%= tx["txid"] %> <%= tx["txid"] %>
</a> </a>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-medium">
<%= tx["info"]["height"] %> <%= tx["info"]["height"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-MEDI">
<%= ZcashExplorerWeb.BlockView.mined_time_rel(tx["info"]["time"]) %> <%= ZcashExplorerWeb.BlockView.mined_time_rel(tx["info"]["time"]) %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-medium">
<%= ZcashExplorerWeb.TransactionView.format_zec(tx["info"]["fee"]) %> <%= ZcashExplorerWeb.TransactionView.format_zec(tx["info"]["fee"]) %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap text-sm font-medium">
<%= tx["info"]["size"] %> <%= tx["info"]["size"] %>
</td> </td>
</tr> </tr>

34
lib/zcash_explorer_web/live/recent_blocks_live.ex
View File

@ -4,41 +4,41 @@ defmodule ZcashExplorerWeb.RecentBlocksLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden border-gray-200 rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<thead class="bg-white-500"> <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Height</th> <th scope="col" class="px-6 py-3">Height</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Hash</th> <th scope="col" class="px-4 py-3">Hash</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Mined on</th> <th scope="col" class="px-4 py-3">Mined on</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Txns</th> <th scope="col" class="px-4 py-3">Txns</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Size</th> <th scope="col" class="px-4 py-3">Size</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Output (ZEC)</th> <th scope="col" class="px-4 py-3">Output (ZEC)</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white-500 divide-y divide-gray-200"> <tbody>
<%= for block <- @block_cache do %> <%= for block <- @block_cache do %>
<tr class="hover:bg-indigo-50"> <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-white">
<a href='/blocks/<%= block["height"] %>'> <a href='/blocks/<%= block["height"] %>'>
<%= block["height"] %> <%= block["height"] %>
</td> </td>
</a> </a>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500 hover:text-gray-600"> <td class="px-4 py-4 whitespace-nowrap">
<a href='/blocks/<%= block["hash"] %>'> <a href='/blocks/<%= block["hash"] %>'>
<%= block["hash"] %> <%= block["hash"] %>
</a> </a>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["time"] %> <%= block["time"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["tx_count"] %> <%= block["tx_count"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["size"] %> <%= block["size"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["output_total"] %> <%= block["output_total"] %>
</td> </td>

35
lib/zcash_explorer_web/live/recent_transactions_live.ex
View File

@ -4,38 +4,38 @@ defmodule ZcashExplorerWeb.RecentTransactionsLive do
@impl true @impl true
def render(assigns) do def render(assigns) do
~L""" ~L"""
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden border-gray-200 rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<thead class="bg-white-500"> <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Transaction ID</th> <th scope="col" class="px-6 py-3">Transaction ID</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Block#</th> <th scope="col" class="px-6 py-3">Block#</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Time (UTC )</th> <th scope="col" class="px-6 py-3">Time (UTC )</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Output (ZEC) </th> <th scope="col" class="px-6 py-3">Public Output (ZEC) </th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">TX Type</th> <th scope="col" class="px-4 py-3">TX Type</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white-500 divide-y divide-gray-200"> <tbody>
<%= for tx <- @transaction_cache do %> <%= for tx <- @transaction_cache do %>
<tr class="hover:bg-indigo-50"> <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-white">
<a href='/transactions/<%= tx["txid"] %>'> <a href='/transactions/<%= tx["txid"] %>'>
<%= tx["txid"] %> <%= tx["txid"] %>
</a> </a>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-6 py-4 whitespace-nowrap">
<a href='/blocks/<%= tx["block_height"] %>'> <a href='/blocks/<%= tx["block_height"] %>'>
<%= tx["block_height"] %> <%= tx["block_height"] %>
</a> </a>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-6 py-4 whitespace-nowrap">
<%= tx["time"] %> <%= tx["time"] %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-6 py-4 whitespace-nowrap">
<%= tx["tx_out_total"] %> <%= tx["tx_out_total"] %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 whitespace-nowrap">
<%= if tx["type"] == "coinbase" do %> <%= if tx["type"] == "coinbase" do %>
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-s font-medium bg-yellow-400 text-gray-900 capitalize"> <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-s font-medium bg-yellow-400 text-gray-900 capitalize">
💰 Coinbase 💰 Coinbase
@ -66,6 +66,11 @@ defmodule ZcashExplorerWeb.RecentTransactionsLive do
Mixed Mixed
</span> </span>
<% end %> <% end %>
<%= if tx["type"] == "unknown" do %>
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-s font-medium bg-gray-200 text-gray-900 capitalize">
Unknown
</span>
<% end %>
</td> </td>
</tr> </tr>
<% end %> <% end %>

44
lib/zcash_explorer_web/templates/address/address.html.eex
View File

@ -1,44 +1,46 @@
<main class="py-4"> <main class="py-4">
<div class="grid grid-cols-3 gap-4 px-4"> <div class="grid grid-cols-3 gap-4 px-4">
<div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3"> <div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10 dark:bg-gray-800">
<h2 id="technical-details" class="font-medium text-gray-900">Details for the Zcash address: <h2 id="technical-details" class="font-medium text-gray-900 dark:text-white">Details for the Zcash address:
</h2> </h2>
<p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words"> <p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words dark:text-100">
<%= @address %> <%= @address %>
</p> </p>
<div class="px-0">
<div class="flex flex-row py-2">
<div class="px-0 dark:bg-gray-400 ">
<img src='data:image/png;base64, <%= @qr %>' atl="QR code for the Zcash address <%= @address %>"/> <img src='data:image/png;base64, <%= @qr %>' atl="QR code for the Zcash address <%= @address %>"/>
</div> </div>
</div>
<div> <div>
<div class="flow-root mt-6"> <div class="flow-root mt-6">
<ul class="-my-5 divide-y divide-gray-200"> <ul class="my-5 divide-y divide-gray-200 dark:divide-gray-900">
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50 dark:hover:bg-gray-700 rounded">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium "> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Balance Balance
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50">
<%= ZcashExplorerWeb.TransactionView.format_zec(zatoshi_to_zec(@balance["balance"])) %> <%= ZcashExplorerWeb.TransactionView.format_zec(zatoshi_to_zec(@balance["balance"])) %>
</div> </div>
</div> </div>
</li> </li>
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50 dark:hover:bg-gray-700 rounded">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium"> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Received Received
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50">
<%= ZcashExplorerWeb.TransactionView.format_zec(zatoshi_to_zec(@balance["received"])) %> <%= ZcashExplorerWeb.TransactionView.format_zec(zatoshi_to_zec(@balance["received"])) %>
@ -47,14 +49,14 @@
</li> </li>
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50 dark:hover:bg-gray-700 rounded">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium"> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Spent Spent
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50">
<%= ZcashExplorerWeb.TransactionView.format_zec(spend_zatoshi(@balance["received"],@balance["balance"])) %> <%= ZcashExplorerWeb.TransactionView.format_zec(spend_zatoshi(@balance["received"],@balance["balance"])) %>
@ -100,8 +102,8 @@
</div> </div>
<div class="col-span-3 md:col-span-2 lg:col-span-2 sm:col-span-3"> <div class="col-span-3 md:col-span-2 lg:col-span-2 sm:col-span-3">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 dark:bg-gray-800">
<h2 id="technical-details" class="text-lg font-medium text-gray-900">Transactions from block <h2 id="technical-details" class="text-lg font-medium text-gray-900 dark:text-gray-300">Transactions from block
<%= if @capped_e == nil do%> <%= if @capped_e == nil do%>
#<%= @end_block %> #<%= @end_block %>
<% else %> <% else %>
@ -114,14 +116,14 @@
<!-- TX List --> <!-- TX List -->
<div class="bg-white lg:min-w-0 lg:flex-1"> <div class="bg-white lg:min-w-0 lg:flex-1 dark:bg-gray-800">
<ul class="relative z-0 divide-y divide-gray-200 border-b border-gray-200"> <ul class="relative z-0 divide-y divide-gray-200 border-gray-200 dark:divide-gray-500">
<%= for delta <- @txs do %> <%= for delta <- @txs do %>
<li class="relative pl-4 pr-6 py-5 hover:bg-indigo-50 sm:py-6 sm:pl-6 lg:pl-8 xl:pl-6"> <li class="relative pl-4 pr-6 py-5 hover:bg-indigo-50 sm:py-6 sm:pl-6 lg:pl-8 xl:pl-6 dark:hover:bg-gray-700 rounded">
<div class="flex items-center justify-between space-x-4"> <div class="flex items-center justify-between space-x-4">
<div class="min-w-0 space-y-3"> <div class="min-w-0 space-y-3">
@ -140,7 +142,7 @@
<% end %> <% end %>
<span class="block"> <span class="block">
<h2 class="text-sm font-medium"> <h2 class="text-sm font-medium dark:text-gray-50">
<a href='/transactions/<%= delta["txid"] %>'> <a href='/transactions/<%= delta["txid"] %>'>
<span class="absolute inset-0" aria-hidden="true"></span> <span class="absolute inset-0" aria-hidden="true"></span>
<%= if delta["satoshis"] > 0 do %> <%= if delta["satoshis"] > 0 do %>

30
lib/zcash_explorer_web/templates/address/u_address.html.heex
View File

@ -1,16 +1,18 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-3 gap-4 px-4"> <div class="grid grid-cols-3 gap-4 px-4">
<div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3"> <div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10 dark:bg-gray-800">
<h2 id="technical-details" class="font-medium text-gray-900">Details for the Zcash Unified Address: <h2 id="technical-details" class="font-medium text-gray-900 dark:text-white">Details for the Zcash Unified Address:
</h2> </h2>
<p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words select-all"> <p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words select-all dark:text-100">
<%= @address %> <%= @address %>
</p> </p>
<div class="px-0 py-2"> <div class="flex flex-row py-2">
<div class="px-0 dark:bg-gray-400 ">
<img src={'data:image/png;base64, #{ @qr }'} atl={"QR code for the Zcash Unified Address #{ @address }"}/> <img src={'data:image/png;base64, #{ @qr }'} atl={"QR code for the Zcash Unified Address #{ @address }"}/>
</div> </div>
</div>
<div> <div>
@ -19,18 +21,18 @@
</div> </div>
<div class="col-span-3 md:col-span-2 lg:col-span-2 sm:col-span-3 <div class="col-span-3 md:col-span-2 lg:col-span-2 sm:col-span-3
"> ">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 dark:bg-gray-800">
<div class="bg-white lg:min-w-0 lg:flex-1"> <div class="bg-white lg:min-w-0 lg:flex-1 dark:bg-gray-800">
<h2 class="text-2xl tracking-tight font-extrabold text-gray-900 sm:text-2xl md:text-2xl"> <h2 class="text-2xl tracking-tight text-gray-900 sm:text-2xl md:text-2xl">
<span class="block xl:inline">You are viewing the details of a </span> <span class="block xl:inline dark:text-gray-200">You are viewing the details of a </span>
<!-- space --> <!-- space -->
<span class="block text-indigo-600 inline">Zcash Unified Address.</span> <span class="block text-indigo-600 inline dark:text-indigo-300">Zcash Unified Address.</span>
</h2> </h2>
</div> </div>
<div class="mt-8"> <div class="mt-8">
<ul role="list" class="mt-2 border-t border-b border-gray-200 divide-y divide-gray-200"> <ul role="list" class="mt-2 border-t divide-y divide-gray-200 dark:divide-gray-900 dark:border-red-600">
<li class="relative py-6 flex space-x-4"> <li class="relative py-6 flex space-x-4">
<div class="shrink-0"> <div class="shrink-0">
@ -43,7 +45,7 @@
</div> </div>
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<h3 class="text-gray-900 text-xl"> <h3 class="text-gray-900 text-xl">
<span class="rounded-sm focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500"> <span class="rounded-sm focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500 dark:text-gray-200">
<span class="inset-0" aria-hidden="true"></span> <span class="inset-0" aria-hidden="true"></span>
Orchard Address Orchard Address
@ -68,7 +70,7 @@
</span> </span>
</div> </div>
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<h3 class="text-gray-900 text-xl"> <h3 class="text-gray-900 text-xl dark:text-gray-200">
<span class="inset-0" aria-hidden="true"></span> <span class="inset-0" aria-hidden="true"></span>
Sapling Address Sapling Address
</h3> </h3>
@ -91,7 +93,7 @@
</span> </span>
</div> </div>
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<h3 class="text-gray-900 text-xl"> <h3 class="text-gray-900 text-xl dark:text-gray-200">
<span class="inset-0" aria-hidden="true"></span> <span class="inset-0" aria-hidden="true"></span>
Transparent Address Transparent Address

33
lib/zcash_explorer_web/templates/address/z_address.html.heex
View File

@ -1,29 +1,33 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-3 gap-4 px-4"> <div class="grid grid-cols-3 gap-4 px-4">
<div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3"> <div class="col-span-3 md:col-span-1 lg:col-span-1 sm:col-span-3">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 sticky top-10 dark:bg-gray-800">
<h2 id="technical-details" class="font-medium text-gray-900">Details for the Zcash address: <h2 id="technical-details" class="font-medium text-gray-900 dark:text-white">Details for the Zcash address:
</h2> </h2>
<p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words"> <p class="mt-1 text-lg leading-6 max-w-2xl text-gray-500 font-mono break-words dark:text-100">
<%= @address %> <%= @address %>
</p> </p>
<div class="px-0"> <div class="flex flex-row py-2">
<div class="px-0 dark:bg-gray-400 ">
<img src={'data:image/png;base64, #{ @qr }'} atl={"QR code for the Zcash address #{ @address }"}/> <img src={'data:image/png;base64, #{ @qr }'} atl={"QR code for the Zcash address #{ @address }"}/>
</div> </div>
</div>
<div> <div>
<div class="flow-root mt-6"> <div class="flow-root mt-6">
<ul class="-my-5 divide-y divide-gray-200"> <ul class="my-5 divide-y divide-gray-200 dark:divide-gray-900">
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50 dark:hover:bg-gray-700 rounded">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium "> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Balance Balance
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50"> Private
Private
</div> </div>
</div> </div>
</li> </li>
@ -32,11 +36,11 @@
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium"> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Received Received
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50">
Private Private
</div> </div>
</div> </div>
@ -45,12 +49,11 @@
<li class="py-4 hover:bg-gray-50"> <li class="py-4 hover:bg-gray-50">
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<div class="flex-1 min-w-0"> <div class="flex-1 min-w-0">
<p class="text-sm text-gray-900 font-medium"> <p class="text-sm text-gray-900 font-medium dark:text-gray-200">
Spent Spent
</p> </p>
</div> </div>
<div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased"> <div class="inline-flex items-center px-2.5 py-0.5 text-sm leading-5 font-medium text-gray-700 tabular-nums antialiased dark:text-gray-50"> Private
Private
</div> </div>
</div> </div>
</li> </li>

4
lib/zcash_explorer_web/templates/block/basic_block.html.heex
View File

@ -7,9 +7,9 @@
<div class="space-y-6 lg:col-start-1 lg:col-span-2"> <div class="space-y-6 lg:col-start-1 lg:col-span-2">
<section aria-labelledby="block-details-title"> <section aria-labelledby="block-details-title">
<div class="bg-white shadow sm:rounded-lg"> <div class="bg-white shadow sm:rounded-lg dark:bg-gray-800">
<div class="px-4 py-5 sm:px-6"> <div class="px-4 py-5 sm:px-6">
<h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900"> <h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900 dark:bg-gray-200">
Details for the Zcash block #<%= @block_data["height"] %> Details for the Zcash block #<%= @block_data["height"] %>
</h2> </h2>
</div> </div>

16
lib/zcash_explorer_web/templates/block/blocks.html.heex
View File

@ -5,8 +5,8 @@
Zcash blocks mined on <%= @date %> Zcash blocks mined on <%= @date %>
</h3> </h3>
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="min-w-full dark:text-gray-400">
<thead class="bg-white-500"> <thead class="bg-white-500 dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Height</th> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Height</th>
<th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Hash</th> <th scope="col" class="px-4 py-3 text-left text-xs font-medium text-midnight-500 uppercase tracking-wider">Hash</th>
@ -17,8 +17,8 @@
</thead> </thead>
<tbody class="bg-white-500 divide-y divide-gray-200"> <tbody class="bg-white-500 divide-y divide-gray-200">
<%= for block <- @blocks_data do %> <%= for block <- @blocks_data do %>
<tr class="hover:bg-indigo-50"> <tr class="hover:bg-indigo-50 dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-white">
<a href={'/blocks/#{block["height"]}'}> <a href={'/blocks/#{block["height"]}'}>
@ -26,19 +26,19 @@
</a> </a>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<a href={'/blocks/#{block["hash"] }'}> <a href={'/blocks/#{block["hash"] }'}>
<%= block["hash"] %> <%= block["hash"] %>
</a> </a>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= mined_time_without_rel(block["time"]) %> <%= mined_time_without_rel(block["time"]) %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["confirmations"] %> <%= block["confirmations"] %>
</td> </td>
<td class="px-4 py-4 whitespace-nowrap text-sm font-medium text-gray-500"> <td class="px-4 py-4 whitespace-nowrap">
<%= block["difficulty"] %> <%= block["difficulty"] %>
</td> </td>

107
lib/zcash_explorer_web/templates/block/index.html.heex
View File

@ -2,96 +2,96 @@
<div class="grid gap-4 grid-cols-1 mx-8"> <div class="grid gap-4 grid-cols-1 mx-8">
<div class="space-y-6 lg:col-start-1 lg:col-span-2"> <div class="space-y-6 lg:col-start-1 lg:col-span-2">
<section aria-labelledby="block-details-title"> <section aria-labelledby="block-details-title">
<div class="bg-white shadow rounded-lg"> <div class="bg-white shadow rounded-lg dark:bg-gray-800">
<div class="px-4 py-5 sm:px-6"> <div class="px-4 py-5 sm:px-6">
<h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900 inline-block"> <h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900 inline-block dark:text-gray-50">
Details for the Zcash block</h2> Details for the Zcash block</h2>
<h2 class="inline-block text-gun-powder-500"> #<%= @block_data.height %></h2> <h2 class="inline-block text-gun-powder-500 dark:text-stone-300"> #<%= @block_data.height %></h2>
</div> </div>
<div class="border-t border-gray-200 px-4 py-5 sm:px-6"> <div class="border-t border-gray-200 px-4 py-5 sm:px-6">
<dl class="grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2"> <dl class="grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2">
<div class="sm:col-span-2"> <div class="sm:col-span-2">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Hash Hash
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900 break-words"> <dd class="mt-1 text-sm text-gray-900 break-words dark:text-gray-50">
<%= @block_data.hash %> <%= @block_data.hash %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Mined on Mined on
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= mined_time @block_data.time %> <%= mined_time @block_data.time %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Miner Miner
</dt> </dt>
<a href={'/address/#{mined_by(@block_data.tx)}'}> <a href={'/address/#{mined_by(@block_data.tx)}'}>
<dd class="mt-1 text-sm text-indigo-600 hover:text-indigo-500 break-words"> <dd class="mt-1 text-sm text-indigo-600 hover:text-indigo-400 break-words dark:text-indigo-200">
<%= mined_by @block_data.tx %> <%= mined_by @block_data.tx %>
</dd> </dd>
</a> </a>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Height Height
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= @block_data.height %> <%= @block_data.height %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Transaction count Transaction count
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= transaction_count @block_data.tx %> <%= transaction_count @block_data.tx %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Input count Input count
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= vin_count @block_data.tx %> <%= vin_count @block_data.tx %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Output count Output count
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= vout_count @block_data.tx %> <%= vout_count @block_data.tx %>
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Input total Input total
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= input_total @block_data.tx %> ZEC <%= input_total @block_data.tx %> ZEC
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Output total Output total
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= output_total @block_data.tx %> ZEC <%= output_total @block_data.tx %> ZEC
</dd> </dd>
</div> </div>
<div class="sm:col-span-1"> <div class="sm:col-span-1">
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500 dark:text-gray-300">
Output total Output total
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= output_total @block_data.tx %> ZEC <%= output_total @block_data.tx %> ZEC
</dd> </dd>
</div> </div>
@ -102,51 +102,51 @@
</section> </section>
</div> </div>
<section aria-labelledby="technical-details-title" class="lg:col-start-3 lg:col-span-1"> <section aria-labelledby="technical-details-title" class="lg:col-start-3 lg:col-span-1">
<div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6"> <div class="bg-white px-4 py-5 shadow rounded-lg sm:px-6 dark:bg-gray-800">
<h2 id="technical-details-" class="text-lg font-medium text-gray-900">Technical Details <h2 id="technical-details-" class="text-lg font-medium text-gray-900 dark:text-gray-50">Technical Details
</h2> </h2>
<dl class="mt-4 border-t border-b border-gray-200 divide-y divide-gray-200 "> <dl class="mt-4 border-t border-gray-200 divide-y divide-gray-200 divide-gray-600">
<div class="py-3 flex justify-between text-sm font-medium"> <div class="py-3 flex justify-between text-sm font-medium">
<dt class="text-gray-500">Difficulty</dt> <dt class="text-gray-500 dark:text-gray-300">Difficulty</dt>
<dd class="text-gray-900"><%= @block_data.difficulty %></dd> <dd class="text-gray-900 dark:text-gray-400"><%= @block_data.difficulty %></dd>
</div> </div>
<div class="py-3 flex justify-between text-sm font-medium"> <div class="py-3 flex justify-between text-sm font-medium">
<dt class="text-gray-500">Size</dt> <dt class="text-gray-500 dark:text-gray-300">Size</dt>
<dd class="text-gray-900"><%= @block_data.size %> bytes</dd> <dd class="text-gray-900 dark:text-gray-400"><%= @block_data.size %> bytes</dd>
</div> </div>
<div class="py-3 flex justify-between text-sm font-medium"> <div class="py-3 flex justify-between text-sm font-medium">
<dt class="text-gray-500">Version</dt> <dt class="text-gray-500 dark:text-gray-300">Version</dt>
<dd class="text-gray-900"><%= @block_data.version %></dd> <dd class="text-gray-900 dark:text-gray-50"><%= @block_data.version %></dd>
</div> </div>
<div class="py-3 flex justify-between text-sm font-medium"> <div class="py-3 flex justify-between text-sm font-medium">
<dt class="text-gray-500">Confirmations</dt> <dt class="text-gray-500 dark:text-gray-300">Confirmations</dt>
<dd class="text-gray-900"><%= @block_data.confirmations %></dd> <dd class="text-gray-900 dark:text-gray-100"><%= @block_data.confirmations %></dd>
</div> </div>
<div class="py-3 flex justify-between text-sm font-medium"> <div class="py-3 flex justify-between text-sm font-medium">
<dt class="text-gray-500">Bits</dt> <dt class="text-gray-500 dark:text-gray-300">Bits</dt>
<dd class="text-gray-900"><%= @block_data.bits %></dd> <dd class="text-gray-900 dark:text-gray-500"><%= @block_data.bits %></dd>
</div> </div>
<div class="sm:col-span-2"> <div class="sm:col-span-2">
<div class="py-3 text-sm font-medium"> <div class="py-3 text-sm font-medium">
<dt class="text-gray-500">Merkle root</dt> <dt class="text-gray-500 dark:text-gray-300">Merkle root</dt>
<dd class="text-gray-900 py-1 select-all break-words"> <dd class="text-gray-900 py-1 select-all break-words dark:text-gray-500">
<%= @block_data.merkleroot %> <%= @block_data.merkleroot %>
</dd> </dd>
</div> </div>
</div> </div>
<div class="sm:col-span-2"> <div class="sm:col-span-2">
<div class="py-3 text-sm font-medium"> <div class="py-3 text-sm font-medium">
<dt class="text-gray-500">Chainwork</dt> <dt class="text-gray-500 dark:text-gray-300">Chainwork</dt>
<dd class="text-gray-900 py-1 select-all break-words"> <dd class="text-gray-900 py-1 select-all break-words dark:text-gray-500">
<%= @block_data.chainwork %> <%= @block_data.chainwork %>
</dd> </dd>
</div> </div>
</div> </div>
<div class="sm:col-span-2"> <div class="sm:col-span-2">
<div class="py-3 text-sm font-medium"> <div class="py-3 text-sm font-medium">
<dt class="text-gray-500">Nonce</dt> <dt class="text-gray-500 dark:text-gray-300">Nonce</dt>
<dd class="text-gray-900 py-1 select-all break-words"> <dd class="text-gray-900 py-1 select-all break-words dark:text-gray-500">
<%= @block_data.nonce %> <%= @block_data.nonce %>
</dd> </dd>
</div> </div>
@ -157,9 +157,9 @@
<div class="space-y-6 lg:col-start-1 lg:col-span-4"> <div class="space-y-6 lg:col-start-1 lg:col-span-4">
<h4 class="font-medium text-gray-900">Transactions included in this block <h4 class="font-medium text-gray-900">Transactions included in this block
</h4> </h4>
<div class="shadow overflow-hidden border-b border-gray-200 rounded-lg overflow-x-auto"> <div class="shadow overflow-hidden rounded-lg overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200 bg-white shadow rounded-lg"> <table class="min-w-full bg-white shadow rounded-lg dark:text-gray-400">
<thead class="bg-white"> <thead class="bg-white dark:bg-gray-700 dark:text-gray-400">
<tr> <tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider "> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider ">
Block# Block#
@ -184,23 +184,23 @@
<tbody> <tbody>
<%= for transaction <- @block_data.tx do %> <%= for transaction <- @block_data.tx do %>
<tr class="bg-white hover:bg-indigo-50"> <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-white">
<%= @block_data.height %> <%= @block_data.height %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500"> <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-indigo-600 hover:text-indigo-500 dark:text-indigo-200 dark:hover:text-indigo-400">
<a href={'/transactions/#{transaction.txid}'}> <a href={'/transactions/#{transaction.txid}'}>
<%= transaction.txid %> <%= transaction.txid %>
</a> </a>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-50">
<%= length(transaction.vin) %> <%= length(transaction.vin) %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-50">
<%= length(transaction.vout) %> <%= length(transaction.vout) %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-50">
<%= tx_out_total transaction %> <%= tx_out_total transaction %>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
@ -234,6 +234,11 @@
Mixed Mixed
</span> </span>
<% end %> <% end %>
<%= if tx_type(transaction) == "unknown" do %>
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-s font-medium bg-gray-200 text-gray-900 capitalize">
Unknown
</span>
<% end %>
</td> </td>
</tr> </tr>
<% end %> <% end %>

2
lib/zcash_explorer_web/templates/layout/app.html.heex
View File

@ -1,5 +1,5 @@
<%= render ZcashExplorerWeb.LayoutView, "header.html", assigns %> <%= render ZcashExplorerWeb.LayoutView, "header.html", assigns %>
<div class="bg-gray-50"> <div class="bg-gray-50 dark:bg-gray-900">
<%= @inner_content %> <%= @inner_content %>
</div> </div>
<%= render ZcashExplorerWeb.LayoutView, "footer.html", assigns %> <%= render ZcashExplorerWeb.LayoutView, "footer.html", assigns %>

6
lib/zcash_explorer_web/templates/layout/footer.html.heex
View File

@ -1,14 +1,14 @@
<footer class="bg-gray-50"> <footer class="bg-gray-50 dark:bg-gray-900 isolate">
<div class="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8">
<nav class="-mx-5 -my-2 flex flex-wrap justify-center" aria-label="Footer"> <nav class="-mx-5 -my-2 flex flex-wrap justify-center" aria-label="Footer">
<div class="px-5 py-2"> <div class="px-5 py-2">
<a href="/privacy.html" class="text-base text-gray-500 hover:text-gray-900"> <a href="/privacy.html" class="text-base text-gray-500 hover:text-gray-900 dark:hover:text-slate-100">
Privacy Policy Privacy Policy
</a> </a>
</div> </div>
<div class="px-5 py-2"> <div class="px-5 py-2">
<a href="http://zcashfgzdzxwiy7yq74uejvo2ykppu4pzgioplcvdnpmc6gcu5k6vwyd.onion/" class="text-base text-gray-500 hover:text-gray-900"> <a href="http://zcashfgzdzxwiy7yq74uejvo2ykppu4pzgioplcvdnpmc6gcu5k6vwyd.onion/" class="text-base text-gray-500 hover:text-gray-900 dark:hover:text-slate-100">
Onion V3 Onion V3
</a> </a>
</div> </div>

62
lib/zcash_explorer_web/templates/layout/header.html.heex
View File

@ -1,5 +1,5 @@
<header> <header>
<nav x-data="{ open: false }" class="shrink-0 bg-indigo-600"> <nav x-data="{ open: false }" class="shrink-0 bg-indigo-600 dark:bg-gray-800">
<div class="max-w-7xl mx-auto px-2 sm:px-4 lg:px-8"> <div class="max-w-7xl mx-auto px-2 sm:px-4 lg:px-8">
<div class="relative flex items-center justify-between h-16"> <div class="relative flex items-center justify-between h-16">
<!-- Logo section --> <!-- Logo section -->
@ -10,7 +10,7 @@
</div> </div>
</a> </a>
<a href="/"> <a href="/">
<div class="shrink-0 px-1 text-white"> <div class="shrink-0 px-1 text-white dark:text-white">
Zcash Block Explorer Zcash Block Explorer
</div> </div>
</a> </a>
@ -19,21 +19,50 @@
<div class="flex-1 flex justify-center lg:justify-end"> <div class="flex-1 flex justify-center lg:justify-end">
<div class="w-full px-2 lg:px-6"> <div class="w-full px-2 lg:px-6">
<label for="search" class="sr-only">transaction / block / address</label> <label for="search" class="sr-only">transaction / block / address</label>
<div class="relative text-indigo-200 focus-within:text-gray-400"> <div class="relative text-gray-200 dark:text-slate-200 focus-within:text-gray-400 dark:focus-within:text-slate-800">
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"> <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<svg class="h-5 w-5" x-description="Heroicon name: solid/search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <svg class="h-5 w-5" x-description="Heroicon name: solid/search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path> <path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path>
</svg> </svg>
</div> </div>
<form action="/search"> <form action="/search">
<input id="search" name="qs" class="block w-full pl-10 pr-3 py-2 bg-white/25 border border-transparent rounded-md leading-5 bg-indigo-400/25 text-indigo-100 placeholder-indigo-200 focus:outline-none focus:bg-white focus:ring-0 focus:placeholder-gray-400 focus:text-gray-900 sm:text-sm" placeholder="transaction / block / address" type="search"> <input id="search" name="qs" class="
block
w-full
pl-10
pr-3
py-2
border
border-transparent
rounded-md
leading-5
text-indigo-100
placeholder-indigo-200
focus:outline-none
focus:bg-white
focus:ring-0 focus:placeholder-gray-400
focus:text-gray-900
sm:text-sm
dark:focus:placeholder-white
dark:border-slate-600
dark:placeholder-slate-400
dark:text-white
dark:focus:ring-slate-500
dark:focus:border-slate-500
dark:hover:bg-slate-700 dark:focus:ring-slate-800
bg-white/25
dark:bg-slate-700
dark:focus:bg-slate-600
dark:placeholder-slate-200
dark:focus:text-gray-200
" placeholder="transaction / block / address" type="search">
</form> </form>
</div> </div>
</div> </div>
</div> </div>
<div class="flex lg:hidden"> <div class="flex lg:hidden">
<!-- Mobile menu button --> <!-- Mobile menu button -->
<button type="button" class="bg-indigo-600 inline-flex items-center justify-center p-2 rounded-md text-indigo-400 hover:text-white hover:bg-indigo-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-indigo-600 focus:ring-white" aria-controls="mobile-menu" @click="open = !open" aria-expanded="true" x-bind:aria-expanded="open.toString()"> <button type="button" class="bg-indigo-600 dark:bg-slate-600 inline-flex items-center justify-center p-2 rounded-md text-indigo-400 dark:text-white hover:text-white hover:bg-indigo-600 dark:hover:bg-slate-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-indigo-600 dark:focus:ring-offset-slate-600 focus:ring-white dark:focus:ring-white" aria-controls="mobile-menu" @click="open = !open" aria-expanded="true" x-bind:aria-expanded="open.toString()">
<span class="sr-only">Open main menu</span> <span class="sr-only">Open main menu</span>
<svg x-description="Icon when menu is closed. <svg x-description="Icon when menu is closed.
Heroicon name: outline/menu-alt-1" x-state:on="Menu open" x-state:off="Menu closed" class="h-6 w-6 hidden" :class="{ 'hidden': open, 'block': !(open) }" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> Heroicon name: outline/menu-alt-1" x-state:on="Menu open" x-state:off="Menu closed" class="h-6 w-6 hidden" :class="{ 'hidden': open, 'block': !(open) }" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
@ -50,13 +79,13 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
<div class="flex items-center justify-end"> <div class="flex items-center justify-end">
<div class="flex"> <div class="flex">
<a href="/mempool" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white">Mempool</a> <a href="/mempool" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white dark:text-gray-400">Mempool</a>
<a href="/blocks" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white">Blocks</a> <a href="/blocks" class="px-3 py-2 rounded-md text-sm font-medium text-indigo-200 hover:text-white dark:text-gray-400">Blocks</a>
<div x-data="{ open: false }" @keydown.escape.stop="open = false" @click.away="open = false" class="relative inline-block text-left"> <div x-data="{ open: false }" @keydown.escape.stop="open = false" @click.away="open = false" class="relative inline-block text-left">
<div> <div>
<button type="button" class=" inline-flex justify-center rounded-md px-4 py-2 text-sm font-medium focus:outline-none text-indigo-200 hover:text-white" id="options-menu" aria-expanded="true" @click="open = !open" aria-haspopup="true" x-bind:aria-expanded="open"> <button type="button" class=" inline-flex justify-center rounded-md px-4 py-2 text-sm font-medium focus:outline-none text-indigo-200 hover:text-white dark:text-gray-400" id="options-menu" aria-expanded="true" @click="open = !open" aria-haspopup="true" x-bind:aria-expanded="open">
Tools Tools
<svg class="-mr-1 ml-2 h-5 w-5" x-description="Heroicon name: solid/chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <svg class="-mr-1 ml-2 h-5 w-5" x-description="Heroicon name: solid/chevron-down" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path> <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path>
@ -64,18 +93,25 @@ Heroicon name: outline/x" x-state:on="Menu open" x-state:off="Menu closed" class
</button> </button>
</div> </div>
<div x-description="Dropdown menu, show/hide based on menu state." x-show="open" x-transition:enter="transition ease-out duration-100" x-transition:enter-start="transform opacity-0 scale-95" x-transition:enter-end="transform opacity-100 scale-100" x-transition:leave="transition ease-in duration-75" x-transition:leave-start="transform opacity-100 scale-100" x-transition:leave-end="transform opacity-0 scale-95" class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="options-menu"> <div x-description="Dropdown menu, show/hide based on menu state." x-show="open" x-transition:enter="transition ease-out duration-100" x-transition:enter-start="transform opacity-0 scale-95" x-transition:enter-end="transform opacity-100 scale-100" x-transition:leave="transition ease-in duration-75" x-transition:leave-start="transform opacity-100 scale-100" x-transition:leave-end="transform opacity-0 scale-95" class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-gray-300" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">
<div class="py-1" role="none"> <div class="py-1" role="none">
<a href="/nodes" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Nodes</a> <a href="/nodes" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Nodes</a>
<a href="/broadcast" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Broadcast Transaction</a> <a href="/broadcast" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Broadcast Transaction</a>
<a href="/payment-disclosure" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Payment Disclosure</a> <a href="/payment-disclosure" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Payment Disclosure</a>
<a href="/vk" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white" role="menuitem">Viewing Key</a> <a href="/vk" class="block px-4 py-2 text-sm hover:bg-gray-200 bg-white dark:bg-gray-300 dark:hover:bg-gray-500" role="menuitem">Viewing Key</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<button id="theme-toggle" type="button" class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5">
<svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
<svg id="theme-toggle-light-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
</button>
</div> </div>
</div> </div>
<div x-description="Mobile menu, show/hide based on menu state." class="lg:hidden" id="mobile-menu" x-show="open"> <div x-description="Mobile menu, show/hide based on menu state." class="lg:hidden" id="mobile-menu" x-show="open">

7
lib/zcash_explorer_web/templates/layout/root.html.heex
View File

@ -8,6 +8,13 @@
<link rel="stylesheet" href={"#{Routes.static_path(@conn, "/css/app.css")}"}/> <link rel="stylesheet" href={"#{Routes.static_path(@conn, "/css/app.css")}"}/>
<%= csrf_meta_tag() %> <%= csrf_meta_tag() %>
<script defer type="text/javascript" src={"#{Routes.static_path(@conn, "/js/app.js")}"}></script> <script defer type="text/javascript" src={"#{Routes.static_path(@conn, "/js/app.js")}"}></script>
<script>
if (localStorage.getItem('color-theme') === 'dark' || (!('color-theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark')
}
</script>
</head> </head>
<body> <body>
<%= @inner_content %> <%= @inner_content %>

2
lib/zcash_explorer_web/templates/page/blockchain_info.html.heex
View File

@ -1,4 +1,4 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-1 mx-8"> <div class="grid grid-cols-1 mx-8">
<%= live_render(@conn, ZcashExplorerWeb.BlockChainInfoLive) %> <%= live_render(@conn, ZcashExplorerWeb.BlockChainInfoLive) %>
</div> </div>

12
lib/zcash_explorer_web/templates/page/broadcast.html.heex
View File

@ -1,6 +1,6 @@
<div class="mx-8 my-4"> <div class="mx-8 h-screen">
<h3 class="text-lg leading-6 font-medium text-gray-900 py-3"> <h3 class="text-lg leading-6 font-medium text-gray-900 py-3 dark:text-white">
Broadcast Zcash Transaction Broadcast Zcash Transaction
</h3> </h3>
@ -43,7 +43,7 @@
</div> </div>
<div class="ml-3"> <div class="ml-3">
<h3 class="text-sm font-medium text-green-800"> <h3 class="text-sm font-medium text-green-800 dark:text-slate-100">
Transaction broadcasted Transaction broadcasted
</h3> </h3>
@ -71,12 +71,12 @@
<form class="space-y-8" action="/broadcast" method="post"> <form class="space-y-8" action="/broadcast" method="post">
<div class="space-y-8 divide-y divide-gray-200 sm:space-y-5"> <div class="space-y-8 divide-slate-400 sm:space-y-5">
<p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600"> <p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600 dark:text-slate-50">
Paste the raw transaction here in hex format to broadcast it over the Zcash network. Paste the raw transaction here in hex format to broadcast it over the Zcash network.
</p> </p>
<input type="hidden" value={@csrf_token} name="_csrf_token"/> <input type="hidden" value={@csrf_token} name="_csrf_token"/>
<textarea id="broadcast" name="tx-hex" rows="22" class="w-full shadow-sm bg-indigo-400/5 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border border-gray-300 rounded-md font-mono text-green-400 "> <textarea id="broadcast" name="tx-hex" rows="22" class="w-full shadow-sm bg-slate-400/5 sm:text-sm border border-gray-300 rounded-md font-mono text-green-400 ">
</textarea> </textarea>
<div class="pt-5 pb-5"> <div class="pt-5 pb-5">

10
lib/zcash_explorer_web/templates/page/disclosure.html.heex
View File

@ -1,6 +1,6 @@
<div class="mx-8 my-4"> <div class="mx-8 h-screen">
<h3 class="text-lg leading-6 font-medium text-gray-900 py-3"> <h3 class="text-lg leading-6 font-medium text-gray-900 py-3 dark:text-white">
Payment Disclosure Payment Disclosure
</h3> </h3>
@ -41,7 +41,7 @@
</svg> </svg>
</div> </div>
<div class="ml-3"> <div class="ml-3">
<h3 class="text-sm font-medium text-green-800"> <h3 class="text-sm font-medium text-green-800 dark:text-white">
Details of the payment disclosure successfully retrieved from zcashd. Details of the payment disclosure successfully retrieved from zcashd.
</h3> </h3>
</div> </div>
@ -171,12 +171,12 @@
<p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600 py-4"> <p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600 py-4 dark:text-slate-100">
Paste the Zcash payment disclosure hexdata here to reveal details of a shielded payment. Paste the Zcash payment disclosure hexdata here to reveal details of a shielded payment.
</p> </p>
<form class="space-y-8" action="/payment-disclosure" method="post"> <form class="space-y-8" action="/payment-disclosure" method="post">
<div class="space-y-8 divide-y divide-red-200 sm:space-y-5"> <div class="space-y-8 sm:space-y-5">
<input type="hidden" value={@csrf_token} name="_csrf_token"/> <input type="hidden" value={@csrf_token} name="_csrf_token"/>

28
lib/zcash_explorer_web/templates/page/index.html.heex
View File

@ -3,7 +3,7 @@
<div> <div>
<dl class="mt-5 grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-4"> <dl class="mt-5 grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-4">
<div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden"> <div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden dark:bg-gray-800">
<dt> <dt>
<div class="absolute bg-green-500 rounded-md p-3"> <div class="absolute bg-green-500 rounded-md p-3">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@ -14,16 +14,16 @@
</dt> </dt>
<dd class="ml-16 pb-6 flex items-baseline sm:pb-7"> <dd class="ml-16 pb-6 flex items-baseline sm:pb-7">
<%= live_render(@conn, ZcashExplorerWeb.OrchardPoolLive) %> <%= live_render(@conn, ZcashExplorerWeb.OrchardPoolLive) %>
<div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6"> <div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 dark:bg-gray-700">
<div class="text-sm"> <div class="text-sm">
<a href="/blockchain-info" class="font-medium text-indigo-600 hover:text-indigo-500">View blockchain info<span class="sr-only"> View blockchain info</span></a> <a href="/blockchain-info" class="font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-slate-50">View blockchain info<span class="sr-only"> View blockchain info</span></a>
</div> </div>
</div> </div>
</dd> </dd>
</div> </div>
<div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden"> <div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden dark:bg-gray-800">
<dt> <dt>
<div class="absolute bg-green-500 rounded-md p-3"> <div class="absolute bg-green-500 rounded-md p-3">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
@ -36,15 +36,15 @@
<%= live_render(@conn, ZcashExplorerWeb.BlockCountLive) %> <%= live_render(@conn, ZcashExplorerWeb.BlockCountLive) %>
<div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6"> <div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 dark:bg-gray-700">
<div class="text-sm"> <div class="text-sm">
<a href="/blocks" class="font-medium text-indigo-600 hover:text-indigo-500"> View blocks<span class="sr-only"> View blocks</span></a> <a href="/blocks" class="font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-slate-50"> View blocks<span class="sr-only"> View blocks</span></a>
</div> </div>
</div> </div>
</dd> </dd>
</div> </div>
<div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden"> <div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden dark:bg-gray-800">
<dt> <dt>
<div class="absolute bg-indigo-500 rounded-md p-3"> <div class="absolute bg-indigo-500 rounded-md p-3">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@ -55,15 +55,15 @@
</dt> </dt>
<dd class="ml-16 pb-6 flex items-baseline sm:pb-7"> <dd class="ml-16 pb-6 flex items-baseline sm:pb-7">
<%= live_render(@conn, ZcashExplorerWeb.MempoolInfoLive) %> <%= live_render(@conn, ZcashExplorerWeb.MempoolInfoLive) %>
<div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6"> <div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 dark:bg-gray-700">
<div class="text-sm"> <div class="text-sm">
<a href="/mempool" class="font-medium text-indigo-600 hover:text-indigo-500">View mempool transactions<span class="sr-only"> View mempool transactions</span></a> <a href="/mempool" class="font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-slate-50">View mempool transactions<span class="sr-only"> View mempool transactions</span></a>
</div> </div>
</div> </div>
</dd> </dd>
</div> </div>
<div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden"> <div class="relative bg-white pt-5 px-4 pb-12 sm:pt-6 sm:px-6 shadow rounded-lg overflow-hidden dark:bg-gray-800">
<dt> <dt>
<div class="absolute bg-green-500 rounded-md p-3"> <div class="absolute bg-green-500 rounded-md p-3">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@ -74,9 +74,9 @@
</dt> </dt>
<dd class="ml-16 pb-6 flex items-baseline sm:pb-7"> <dd class="ml-16 pb-6 flex items-baseline sm:pb-7">
<%= live_render(@conn, ZcashExplorerWeb.BlockChainSizeLive) %> <%= live_render(@conn, ZcashExplorerWeb.BlockChainSizeLive) %>
<div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6"> <div class="absolute bottom-0 inset-x-0 bg-gray-50 px-4 py-4 sm:px-6 dark:bg-gray-700">
<div class="text-sm"> <div class="text-sm">
<a href="/blockchain-info" class="font-medium text-indigo-600 hover:text-indigo-500">View blockchain info<span class="sr-only"> View blockchain info</span></a> <a href="/blockchain-info" class="font-medium text-indigo-600 hover:text-indigo-500 dark:text-white dark:hover:text-slate-50">View blockchain info<span class="sr-only"> View blockchain info</span></a>
</div> </div>
</div> </div>
</dd> </dd>
@ -86,7 +86,7 @@
<div class="grid gap-4 grid-cols-1 md:grid-cols-1 mx-4 my-2"> <div class="grid gap-4 grid-cols-1 md:grid-cols-1 mx-4 my-2">
<div> <div>
<h3 class="text-lg leading-6 font-medium text-midnight-500 py-3"> <h3 class="text-lg leading-6 font-medium text-midnight-500 py-3 dark:text-white">
Recent Blocks Recent Blocks
</h3> </h3>
<%= live_render(@conn, ZcashExplorerWeb.RecentBlocksLive) %> <%= live_render(@conn, ZcashExplorerWeb.RecentBlocksLive) %>
@ -94,7 +94,7 @@
</div> </div>
<div> <div>
<h3 class="text-lg leading-6 font-medium text-gray-900 py-3"> <h3 class="text-lg leading-6 font-medium text-gray-900 py-3 dark:text-white">
Recent Transactions Recent Transactions
</h3> </h3>
<%= live_render(@conn, ZcashExplorerWeb.RecentTransactionsLive) %> <%= live_render(@conn, ZcashExplorerWeb.RecentTransactionsLive) %>

2
lib/zcash_explorer_web/templates/page/nodes.html.heex
View File

@ -1,4 +1,4 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-1 mx-8"> <div class="grid grid-cols-1 mx-8">
<h3 class="text-lg leading-6 font-medium text-gray-500 py-2"> <h3 class="text-lg leading-6 font-medium text-gray-500 py-2">
Network nodes connected to Zcash Block Explorer: Network nodes connected to Zcash Block Explorer:

10
lib/zcash_explorer_web/templates/page/vk.html.heex
View File

@ -1,6 +1,6 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-1 mx-8"> <div class="grid grid-cols-1 mx-8">
<h3 class="text-lg leading-6 font-medium text-gray-500 py-2"> <h3 class="text-lg leading-6 font-medium text-gray-500 py-2 dark:text-white">
Zcash Viewing Key Zcash Viewing Key
</h3> </h3>
<form class="space-y-8" action="/vk" method="post"> <form class="space-y-8" action="/vk" method="post">
@ -32,7 +32,7 @@
</div> </div>
<% end %> <% end %>
<p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600"> <p class="mt-1 mb-2 max-w-2xl text-sm text-gray-600 dark:text-slate-50">
Paste the viewing key, click on the "Start Importing" button and grab a coffee! Paste the viewing key, click on the "Start Importing" button and grab a coffee!
</p> </p>
<input type="hidden" value={@csrf_token} name="_csrf_token"/> <input type="hidden" value={@csrf_token} name="_csrf_token"/>
@ -41,9 +41,9 @@
<div> <div>
<label for="height" class="block text-sm font-medium text-gray-700">Start Height</label> <label for="height" class="block text-sm font-medium text-gray-700 dark:text-white">Start Height</label>
<div class="mt-1"> <div class="mt-1">
<input type="text" name="scan-height" id="scan-height" class="shadow-sm focus:ring-indigo-500 bg-opacity-5 focus:border-indigo-500 block w-1/4 sm:text-sm border-gray-300` bg-indigo-400/25 rounded-md text-green-400 font-mono" placeholder="height" value={@height}> <input type="text" name="scan-height" id="scan-height" class="shadow-sm focus:ring-indigo-500 bg-opacity-5 focus:border-indigo-500 block w-1/4 sm:text-sm border-gray-300 bg-indigo-400/25 rounded-md text-green-400 font-mono border dark:border-gray-100" placeholder="height" value={@height}>
</div> </div>
</div> </div>

2
lib/zcash_explorer_web/templates/page/vk_txs.html.heex
View File

@ -1,4 +1,4 @@
<main class="py-4"> <main class="py-4 h-screen">
<div class="grid grid-cols-1 mx-8"> <div class="grid grid-cols-1 mx-8">
<h3 class="text-lg leading-6 font-medium text-gray-500 py-2"> <h3 class="text-lg leading-6 font-medium text-gray-500 py-2">
Zcash Viewing Key Zcash Viewing Key

54
lib/zcash_explorer_web/templates/transaction/tx.html.heex
View File

@ -2,11 +2,11 @@
<div class="grid gap-4 mx-2 grid-cols-1 md:mx-8"> <div class="grid gap-4 mx-2 grid-cols-1 md:mx-8">
<div class="space-y-6 lg:col-start-1 lg:col-span-2"> <div class="space-y-6 lg:col-start-1 lg:col-span-2">
<section aria-labelledby="block-details-title"> <section aria-labelledby="block-details-title">
<div class="bg-white-500 shadow rounded-lg"> <div class="bg-white-500 shadow rounded-lg dark:bg-gray-800">
<div class="px-4 py-5 sm:px-6"> <div class="px-4 py-5 sm:px-6">
<h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900 inline-block break-words"> <h2 id="block-details-title" class="text-lg leading-6 font-medium text-gray-900 inline-block break-words dark:text-gray-50">
Details for the Zcash Transaction ID </h2> Details for the Zcash Transaction ID </h2>
<h2 class="md:inline-block text-gun-powder-500 break-words"><%= @tx.txid %> <h2 class="md:inline-block text-gun-powder-500 break-words dark:text-gray-200"><%= @tx.txid %>
</h2> </h2>
</div> </div>
<div class="border-t border-gray-200 px-4 py-5 sm:px-6"> <div class="border-t border-gray-200 px-4 py-5 sm:px-6">
@ -16,7 +16,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Confirmations Confirmations
</dt> </dt>
<dd class="mt-1 text-xl font-semibold text-gray-900"> <dd class="mt-1 text-xl font-semibold text-gray-900 dark:text-gray-50">
<%= if @tx.confirmations == nil do %> <%= if @tx.confirmations == nil do %>
0 0
<% else %> <% else %>
@ -30,7 +30,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Time (UTC) Time (UTC)
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= ZcashExplorerWeb.BlockView.mined_time(@tx.time) %> <%= ZcashExplorerWeb.BlockView.mined_time(@tx.time) %>
</dd> </dd>
</div> </div>
@ -82,7 +82,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Block Id Block Id
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900 break-words"> <dd class="mt-1 text-sm text-gray-900 break-words dark:text-gray-50">
<a href={'/blocks/#{@tx.height}'}> <a href={'/blocks/#{@tx.height}'}>
<%= @tx.height %> <%= @tx.height %>
</a> </a>
@ -93,7 +93,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Public Inputs / Outputs Public Inputs / Outputs
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= vin_vout_count @tx %> <%= vin_vout_count @tx %>
</dd> </dd>
</div> </div>
@ -102,7 +102,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Shielded Inputs / Outputs Shielded Inputs / Outputs
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900 break-words"> <dd class="mt-1 text-sm text-gray-900 break-words dark:text-gray-50">
<%= length(@tx.vShieldedSpend) %> / <%= length(@tx.vShieldedOutput) %> <%= length(@tx.vShieldedSpend) %> / <%= length(@tx.vShieldedOutput) %>
</dd> </dd>
</div> </div>
@ -111,7 +111,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
JoinSplits ? JoinSplits ?
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900 break-words"> <dd class="mt-1 text-sm text-gray-900 break-words dark:text-gray-50">
<%= if ZcashExplorerWeb.BlockView.contains_sprout(@tx) do %> <%= if ZcashExplorerWeb.BlockView.contains_sprout(@tx) do %>
Yes - Yes -
<%= ZcashExplorerWeb.BlockView.get_joinsplit_count(@tx) %> <%= ZcashExplorerWeb.BlockView.get_joinsplit_count(@tx) %>
@ -125,7 +125,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
<%= get_shielded_pool_label(@tx) %> <%= get_shielded_pool_label(@tx) %>
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900 break-words"> <dd class="mt-1 text-sm text-gray-900 break-words dark:text-gray-50">
<%= format_zec(get_shielded_pool_value(@tx)) %> <%= format_zec(get_shielded_pool_value(@tx)) %>
</dd> </dd>
</div> </div>
@ -135,7 +135,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Overwintered? Overwintered?
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= @tx.overwintered %> <%= @tx.overwintered %>
</dd> </dd>
</div> </div>
@ -143,7 +143,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Size (bytes) Size (bytes)
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= @tx.size %> <%= @tx.size %>
</dd> </dd>
</div> </div>
@ -151,7 +151,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Version Version
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= @tx.version %> <%= @tx.version %>
</dd> </dd>
</div> </div>
@ -159,7 +159,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Locktime Locktime
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= @tx.locktime %> <%= @tx.locktime %>
</dd> </dd>
</div> </div>
@ -167,7 +167,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Transaction fee Transaction fee
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<%= if ZcashExplorerWeb.BlockView.tx_type(@tx) == "coinbase" do %> <%= if ZcashExplorerWeb.BlockView.tx_type(@tx) == "coinbase" do %>
0.0 ZEC 0.0 ZEC
<% end %> <% end %>
@ -201,7 +201,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Raw TX Raw TX
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<a href={'/transactions/#{@tx.txid}/raw'} class="font-medium text-indigo-600 hover:text-indigo-500"> <a href={'/transactions/#{@tx.txid}/raw'} class="font-medium text-indigo-600 hover:text-indigo-500">
<span class="flex-1 w-0 break-all"> <span class="flex-1 w-0 break-all">
JSON JSON
@ -215,7 +215,7 @@
<dt class="text-sm font-medium text-gray-500"> <dt class="text-sm font-medium text-gray-500">
Orchard Action transfers Orchard Action transfers
</dt> </dt>
<dd class="mt-1 text-sm text-gray-900"> <dd class="mt-1 text-sm text-gray-900 dark:text-gray-50">
<span class="flex-1 w-0 break-all"> <span class="flex-1 w-0 break-all">
<%= orchard_actions(@tx) %> <%= orchard_actions(@tx) %>
@ -229,21 +229,21 @@
</div> </div>
</section> </section>
<h4 class="font-medium text-gray-900"> <h4 class="font-medium text-gray-900 dark:text-gray-50">
Transfers PublicTransfers
</h4> </h4>
<div class="grid md:grid-cols-2 gap-4 sm:grid-cols-1 lg:grid-cols-9"> <div class="grid md:grid-cols-2 gap-4 sm:grid-cols-1 lg:grid-cols-9">
<div class="sm:col-span-9 md:col-span-9 lg:col-span-4"> <div class="sm:col-span-9 md:col-span-9 lg:col-span-4">
Inputs (<%= vin_count(@tx.vin) %>) <h6 class="dark:text-gray-50">Inputs (<%= vin_count(@tx.vin) %>) </h6>
<div class="py-4"> <div class="py-4">
<%= if vin_count(@tx.vin) > 0 && ZcashExplorerWeb.BlockView.tx_type(@tx) != "coinbase" do %> <%= if vin_count(@tx.vin) > 0 && ZcashExplorerWeb.BlockView.tx_type(@tx) != "coinbase" do %>
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 py-2"> <dd class="mt-1 text-sm text-gray-900 sm:mt-0 py-2">
<ul class="border border-gray-200 rounded-md divide-y divide-gray-200"> <ul class="border border-gray-200 rounded-md divide-y divide-gray-200 dark:border-gray-800 dark:divide-gray-600">
<%= for input <- @tx.vin do %> <%= for input <- @tx.vin do %>
<li class="pl-3 pr-4 py-3 flex items-center justify-between text-sm hover:bg-indigo-50"> <li class="pl-3 pr-4 py-3 flex items-center justify-between text-sm hover:bg-indigo-50 dark:hover:bg-gray-800">
<div class="w-0 flex-1 flex items-center"> <div class="w-0 flex-1 flex items-center dark:text-gray-50">
<a href={'/address/#{input.address}'}> <a href={'/address/#{input.address}'}>
@ -290,22 +290,24 @@ Inputs (<%= vin_count(@tx.vin) %>)
<div class="lg:col-span-4"> <div class="lg:col-span-4">
<h6 class="dark:text-gray-50">
Outputs (<%= vout_count(@tx.vout) %>) Outputs (<%= vout_count(@tx.vout) %>)
</h6>
<div class="py-3"> <div class="py-3">
<%= if vout_count(@tx.vout) > 0 do %> <%= if vout_count(@tx.vout) > 0 do %>
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2 py-2"> <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2 py-2">
<ul class="border border-gray-200 rounded-md divide-y divide-gray-200"> <ul class="border rounded-md divide-y border-gray-200 divide-gray-200 dark:border-gray-800 dark:divide-gray-600">
<%= for op <- @tx.vout do %> <%= for op <- @tx.vout do %>
<%= for address <- op.scriptPubKey.addresses do %> <%= for address <- op.scriptPubKey.addresses do %>
<li class="pl-2 pr-4 py-3 flex items-center justify-between text-sm hover:bg-indigo-50"> <li class="pl-2 pr-4 py-3 flex items-center justify-between text-sm hover:bg-indigo-50 dark:hover:bg-gray-800">
<div class="w-0 flex-1 flex items-center"> <div class="w-0 flex-1 flex items-center">
<a href={'/address/#{address }'}> <a href={'/address/#{address }'}>
<span class="flex-1 w-0 break-all"> <span class="flex-1 w-0 break-all dark:text-gray-50">
<%= address %> <%= address %>
</span> </span>