Nathan Woodburn
2e7f752ae2
- Added JavaScript snippet for handling Dark/Light mode switching - Updated meta tags to include Twitter image and Open Graph image for splash page - Created sitemap.xml file with URLs for home, setup, and usage pages
287 lines
17 KiB
HTML
287 lines
17 KiB
HTML
<!DOCTYPE html>
|
|
<html data-bs-theme="auto" lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
|
|
<title>Home - FireWallet</title>
|
|
<link rel="canonical" href="https://firewallet.woodburn.au/">
|
|
<meta property="og:url" content="https://firewallet.woodburn.au/">
|
|
<meta name="twitter:image" content="https://firewallet.woodburn.au/assets/img/splash.png">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="FireWallet">
|
|
<meta name="twitter:title" content="FireWallet">
|
|
<meta name="description" content="The Handshake wallet that is just Fire">
|
|
<meta name="twitter:description" content="The Handshake wallet that is just Fire">
|
|
<meta property="og:description" content="The Handshake wallet that is just Fire">
|
|
<meta name="twitter:card" content="summary">
|
|
<meta property="og:image" content="https://firewallet.woodburn.au/assets/img/splash.png">
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "http://schema.org",
|
|
"@type": "WebSite",
|
|
"name": "FireWallet",
|
|
"url": "https://firewallet.woodburn.au"
|
|
}
|
|
</script>
|
|
<script>
|
|
(function() {
|
|
|
|
// JavaScript snippet handling Dark/Light mode switching
|
|
|
|
const getStoredTheme = () => localStorage.getItem('theme');
|
|
const setStoredTheme = theme => localStorage.setItem('theme', theme);
|
|
const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
|
|
|
|
const getPreferredTheme = () => {
|
|
|
|
if (forcedTheme) return forcedTheme;
|
|
|
|
const storedTheme = getStoredTheme();
|
|
if (storedTheme) {
|
|
return storedTheme;
|
|
}
|
|
|
|
const pageTheme = document.documentElement.getAttribute('data-bs-theme');
|
|
|
|
if (pageTheme) {
|
|
return pageTheme;
|
|
}
|
|
|
|
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
}
|
|
|
|
const setTheme = theme => {
|
|
if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
document.documentElement.setAttribute('data-bs-theme', 'dark');
|
|
} else {
|
|
document.documentElement.setAttribute('data-bs-theme', theme);
|
|
}
|
|
}
|
|
|
|
setTheme(getPreferredTheme());
|
|
|
|
const showActiveTheme = (theme, focus = false) => {
|
|
const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
|
|
|
|
if (!themeSwitchers.length) return;
|
|
|
|
for (const themeSwitcher of themeSwitchers) {
|
|
|
|
const themeSwitcherText = document.querySelector('#theme-text');
|
|
const activeThemeIcon = document.querySelector('.theme-icon-active use');
|
|
const btnToActive = document.querySelector('[data-bs-theme-value="' + theme + '"]');
|
|
|
|
document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
|
|
element.classList.remove('active');
|
|
element.setAttribute('aria-pressed', 'false');
|
|
});
|
|
|
|
btnToActive.classList.add('active');
|
|
btnToActive.setAttribute('aria-pressed', 'true');
|
|
}
|
|
}
|
|
|
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
|
|
const storedTheme = getStoredTheme();
|
|
if (storedTheme !== 'light' && storedTheme !== 'dark') {
|
|
setTheme(getPreferredTheme());
|
|
}
|
|
});
|
|
|
|
window.addEventListener('DOMContentLoaded', () => {
|
|
showActiveTheme(getPreferredTheme());
|
|
|
|
document.querySelectorAll('[data-bs-theme-value]')
|
|
.forEach(toggle => {
|
|
toggle.addEventListener('click', () => {
|
|
const theme = toggle.getAttribute('data-bs-theme-value');
|
|
setStoredTheme(theme);
|
|
setTheme(theme);
|
|
showActiveTheme(theme);
|
|
})
|
|
})
|
|
});
|
|
})();
|
|
</script>
|
|
<link rel="icon" type="image/png" sizes="900x768" href="assets/img/FW.png">
|
|
<link rel="icon" type="image/png" sizes="900x768" href="assets/img/FW.png">
|
|
<link rel="icon" type="image/png" sizes="900x768" href="assets/img/FW.png">
|
|
<link rel="icon" type="image/png" sizes="900x768" href="assets/img/FW.png">
|
|
<link rel="icon" type="image/png" sizes="900x768" href="assets/img/FW.png">
|
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&display=swap">
|
|
<link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
|
|
<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
|
|
<link rel="stylesheet" href="assets/fonts/fontawesome5-overrides.min.css">
|
|
</head>
|
|
|
|
<body>
|
|
<nav class="navbar navbar-dark navbar-expand-md sticky-top py-3" id="mainNav">
|
|
<div class="container"><a class="navbar-brand d-flex align-items-center" href="/"><span class="bs-icon-md bs-icon-rounded shadow d-flex justify-content-center align-items-center me-2 bs-icon"><img src="assets/img/FW.png" width="100%"></span><span>FireWallet</span></a>
|
|
<nav class="navbar navbar-light navbar-expand-md">
|
|
<div class="container-fluid"><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-1"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
|
<div class="collapse navbar-collapse" id="navcol-1">
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item"><a class="nav-link active" href="/">Home</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="setup">Setup</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="usage">Usage</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="https://github.com/Nathanwoodburn/FireWallet" target="_blank">Git Repo</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav><button class="navbar-toggler" data-bs-toggle="collapse"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
|
|
</div>
|
|
</nav>
|
|
<header class="bg-dark">
|
|
<div class="container pt-4 pt-xl-5">
|
|
<div class="row pt-5">
|
|
<div class="col-md-8 col-xl-6 text-center text-md-start mx-auto">
|
|
<div class="text-center">
|
|
<p class="fw-bold text-success mb-2">New Frontend for HSD</p>
|
|
<h1 class="fw-bold">The Handshake Wallet That is Fire</h1>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="padding-top: 20px;text-align: center;"><a class="btn btn-primary" role="button" target="_blank" href="https://github.com/nathanwoodburn/firewallet">Get Started</a></div>
|
|
</header>
|
|
<section style="background: rgb(39,38,46);">
|
|
<div class="container bg-dark py-5" style="background: rgb(39, 38, 46);">
|
|
<div class="row">
|
|
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
|
<p class="fw-bold text-success mb-2">Features</p>
|
|
<h3 class="fw-bold">What FireWallet can do for you</h3>
|
|
</div>
|
|
</div>
|
|
<div class="py-5 p-lg-5">
|
|
<div class="row row-cols-1 row-cols-md-2 mx-auto" style="max-width: 900px;">
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><i class="fas fa-money-bill-wave text-success"></i></div>
|
|
<h5 class="fw-bold card-title">HNS coin transactions</h5>
|
|
<p class="text-muted card-text mb-4">Send and Receive HNS easily from FireWallet</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><i class="fa fa-gavel text-success"></i></div>
|
|
<h5 class="fw-bold card-title">Participate in auctions</h5>
|
|
<p class="text-muted card-text mb-4">Open auctions, bid on names, reveal bids and claim won names through the domain page.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-4">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-shield-lock-fill text-success">
|
|
<path fill-rule="evenodd" d="M8 0c-.69 0-1.843.265-2.928.56-1.11.3-2.229.655-2.887.87a1.54 1.54 0 0 0-1.044 1.262c-.596 4.477.787 7.795 2.465 9.99a11.777 11.777 0 0 0 2.517 2.453c.386.273.744.482 1.048.625.28.132.581.24.829.24s.548-.108.829-.24a7.159 7.159 0 0 0 1.048-.625 11.775 11.775 0 0 0 2.517-2.453c1.678-2.195 3.061-5.513 2.465-9.99a1.541 1.541 0 0 0-1.044-1.263 62.467 62.467 0 0 0-2.887-.87C9.843.266 8.69 0 8 0zm0 5a1.5 1.5 0 0 1 .5 2.915l.385 1.99a.5.5 0 0 1-.491.595h-.788a.5.5 0 0 1-.49-.595l.384-1.99A1.5 1.5 0 0 1 8 5z"></path>
|
|
</svg></div>
|
|
<h5 class="fw-bold card-title">Connect your Ledger device</h5>
|
|
<p class="text-muted card-text mb-4">Don't compromise your security but trusting FireWallet or your computer. By using a Ledger you can ensure you approve any transaction and that your private key never has any possibility of touching the internet.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-4">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<div class="bs-icon-lg d-flex justify-content-center align-items-center mb-3 bs-icon" style="top: 1rem;right: 1rem;position: absolute;"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-send-fill text-success">
|
|
<path d="M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083l6-15Zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471-.47 1.178Z"></path>
|
|
</svg></div>
|
|
<h5 class="fw-bold card-title">Batch transactions</h5>
|
|
<p class="text-muted card-text mb-4">Save on fees by sending transactions in batches. Why pay for 100 individual bid transactions when you can save by paying for 1 transactions which contains all the Bids.<br><br>(This will save you HNS but will not reduce your cost to 1 bids mining fee as this transaction will be bigger than your usual transaction)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section style="background: rgb(39,38,46);">
|
|
<div class="container bg-dark py-5" style="background: rgb(39, 38, 46);">
|
|
<div class="row">
|
|
<div class="col-md-8 col-xl-6 text-center mx-auto">
|
|
<p class="fw-bold text-success mb-2">Features</p>
|
|
</div>
|
|
</div>
|
|
<div class="py-5 p-lg-5">
|
|
<div class="row row-cols-1 row-cols-md-1 mx-auto" style="max-width: 900px;">
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<p style="color: rgb(25,245,170);font-size: 20px;text-align: center;">Portfolio</p><img src="https://github.com/Nathanwoodburn/FireWallet/raw/master/assets/portfolio.png" width="100%" alt="Portfolio Page">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<p style="color: rgb(25,245,170);font-size: 20px;text-align: center;">Sending HNS</p><img src="assets/img/sending-HIP2.png" width="100%" alt="Send HNS Page">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<p style="color: rgb(25,245,170);font-size: 20px;text-align: center;">Receive HNS and Domains</p><img src="https://github.com/Nathanwoodburn/FireWallet/raw/master/assets/receive.png" width="100%" alt="Receive Page">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<p style="color: rgb(25,245,170);font-size: 20px;text-align: center;">Domain DNS Editing</p><img src="https://github.com/Nathanwoodburn/FireWallet/raw/master/assets/dns.png" width="100%" alt="DNS Edit Page">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-5">
|
|
<div class="card shadow-sm">
|
|
<div class="card-body px-4 py-5 px-md-5">
|
|
<p style="color: rgb(25,245,170);font-size: 20px;text-align: center;">Batching</p><img src="https://github.com/Nathanwoodburn/FireWallet/raw/master/assets/batch.png" width="100%" alt="Bacth Page">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section>
|
|
<div class="container py-5">
|
|
<div class="mx-auto" style="max-width: 900px;">
|
|
<div class="row row-cols-1 row-cols-md-2 d-flex justify-content-center">
|
|
<div class="col mb-4">
|
|
<div class="card bg-primary-light">
|
|
<div class="card-body text-center px-4 py-5 px-md-5">
|
|
<p class="fw-bold text-primary card-text mb-2">Self Custody</p>
|
|
<h5 class="fw-bold card-title mb-3">Don't trust anyone else to store your crypto. Remember "Not Your Key, Not Your Crypto"</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col mb-4">
|
|
<div class="card bg-secondary-light">
|
|
<div class="card-body text-center px-4 py-5 px-md-5">
|
|
<p class="fw-bold text-secondary card-text mb-2">Open Source</p>
|
|
<h5 class="fw-bold card-title mb-3">Check the code and compile it yourself to ensure there isn't anything bad in there</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<footer class="bg-dark">
|
|
<div class="container py-4 py-lg-5">
|
|
<hr>
|
|
<div class="text-muted d-flex justify-content-between align-items-center pt-3">
|
|
<p class="mb-0">Copyright © 2023 FireWallet</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
|
|
<script src="assets/js/script.min.js"></script>
|
|
</body>
|
|
|
|
</html> |