Compare commits
2 Commits
934a5cd50d
...
39c06cb68a
| Author | SHA1 | Date | |
|---|---|---|---|
39c06cb68a
|
|||
|
2bc34662a7
|
BIN
img/coffee.png
Normal file
BIN
img/coffee.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
img/copy-black.png
Normal file
BIN
img/copy-black.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
BIN
img/copy-white.png
Normal file
BIN
img/copy-white.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
50
index.html
50
index.html
@ -1,27 +1,38 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>加密货币捐赠</title>
|
<title>加密货币捐赠</title>
|
||||||
<link rel="icon" href="favicon.ico">
|
<link rel="icon" href="favicon.ico" />
|
||||||
<link rel="stylesheet" href="styles.css">
|
<link rel="stylesheet" href="styles.css" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h1 id="title"><img src="logo.png" alt="asadasd" width="24px"> 捐赠加密货币</h1>
|
<h1>
|
||||||
|
<img id="title-icon" src="logo.png" alt="" /><span id="title-text"
|
||||||
|
>捐赠加密货币</span
|
||||||
|
>
|
||||||
|
</h1>
|
||||||
<div class="donation-card">
|
<div class="donation-card">
|
||||||
<div class="select-wrapper">
|
<div class="select-wrapper">
|
||||||
<select id="blockchain" onchange="updateDonationInfo()"></select>
|
<select id="blockchain" onchange="updateDonationInfo()"></select>
|
||||||
<div id="icon-wrapper">
|
<div id="icon-wrapper">
|
||||||
<img id="blockchain-icon" src="icons/btc.png" alt="Blockchain Icon">
|
<img id="blockchain-icon" src="icons/btc.png" alt="Blockchain Icon" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="donation-info">
|
<div id="donation-info">
|
||||||
<img id="qr-code" src="qr/btc-taproot.png" alt="QR Code">
|
<img id="qr-code" src="qr/btc-taproot.png" alt="QR Code" />
|
||||||
<p id="address">bc1pfx4a7n6fuyum4dv6rjmg9nsuj7t9wdepjjgsp67d6n8hsdp8w47qw228fy</p>
|
<p id="address">
|
||||||
<button onclick="copyAddress()" id="copyAddress">复制地址</button>
|
bc1pfx4a7n6fuyum4dv6rjmg9nsuj7t9wdepjjgsp67d6n8hsdp8w47qw228fy
|
||||||
|
</p>
|
||||||
|
<button onclick="copyAddress()">
|
||||||
|
<img id="copyIcon" src="img/copy-white.png" alt="" /><span
|
||||||
|
id="copyAddress"
|
||||||
|
>复制地址</span
|
||||||
|
>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -30,9 +41,24 @@
|
|||||||
<li onclick="changeLanguage('zh')">中文</li>
|
<li onclick="changeLanguage('zh')">中文</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="social-media">
|
<div class="social-media">
|
||||||
<a href="https://github.com/earthjasonlin" target="_blank"><img class="social-icon" src="https://www.svgrepo.com/download/521688/github.svg" alt="GitHub"></a>
|
<a href="https://github.com/earthjasonlin" target="_blank"
|
||||||
<a href="https://t.me/zcl1103" target="_blank"><img class="social-icon" src="https://www.svgrepo.com/download/521874/telegram.svg" alt="Telegram"></a>
|
><img
|
||||||
<a href="mailto:earthjasonlin@126.com" target="_blank"><img class="social-icon" src="https://www.svgrepo.com/download/479773/email-8.svg" alt="e-Mail"></a>
|
class="social-icon"
|
||||||
|
src="https://www.svgrepo.com/download/521688/github.svg"
|
||||||
|
alt="GitHub"
|
||||||
|
/></a>
|
||||||
|
<a href="https://t.me/zcl1103" target="_blank"
|
||||||
|
><img
|
||||||
|
class="social-icon"
|
||||||
|
src="https://www.svgrepo.com/download/521874/telegram.svg"
|
||||||
|
alt="Telegram"
|
||||||
|
/></a>
|
||||||
|
<a href="mailto:earthjasonlin@126.com" target="_blank"
|
||||||
|
><img
|
||||||
|
class="social-icon"
|
||||||
|
src="https://www.svgrepo.com/download/479773/email-8.svg"
|
||||||
|
alt="e-Mail"
|
||||||
|
/></a>
|
||||||
</div>
|
</div>
|
||||||
<footer>
|
<footer>
|
||||||
<p>© 2024-now earthjasonlin. All rights reserved.</p>
|
<p>© 2024-now earthjasonlin. All rights reserved.</p>
|
||||||
|
|||||||
24
script.js
24
script.js
@ -1,15 +1,15 @@
|
|||||||
let currentLang = 'zh';
|
let currentLang = "zh";
|
||||||
let data, i18n;
|
let data, i18n;
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
loadData('data.json', loadBlockchainOptions);
|
loadData("data.json", loadBlockchainOptions);
|
||||||
changeLanguage(currentLang);
|
changeLanguage(currentLang);
|
||||||
updateCopyrightYear()
|
updateCopyrightYear();
|
||||||
});
|
});
|
||||||
|
|
||||||
function updateCopyrightYear() {
|
function updateCopyrightYear() {
|
||||||
const currentYear = new Date().getFullYear();
|
const currentYear = new Date().getFullYear();
|
||||||
let copyrightText
|
let copyrightText;
|
||||||
if (currentYear > 2024) {
|
if (currentYear > 2024) {
|
||||||
copyrightText = `© 2024-${currentYear} earthjasonlin. All rights reserved.`;
|
copyrightText = `© 2024-${currentYear} earthjasonlin. All rights reserved.`;
|
||||||
} else {
|
} else {
|
||||||
@ -20,27 +20,27 @@ function updateCopyrightYear() {
|
|||||||
|
|
||||||
function loadData(url, callback) {
|
function loadData(url, callback) {
|
||||||
fetch(url)
|
fetch(url)
|
||||||
.then(response => response.json())
|
.then((response) => response.json())
|
||||||
.then(json => {
|
.then((json) => {
|
||||||
data = json;
|
data = json;
|
||||||
callback();
|
callback();
|
||||||
})
|
})
|
||||||
.catch(error => console.error('Error loading JSON:', error));
|
.catch((error) => console.error("Error loading JSON:", error));
|
||||||
}
|
}
|
||||||
|
|
||||||
function loadI18n(url, callback) {
|
function loadI18n(url, callback) {
|
||||||
fetch(url)
|
fetch(url)
|
||||||
.then(response => response.json())
|
.then((response) => response.json())
|
||||||
.then(json => {
|
.then((json) => {
|
||||||
i18n = json;
|
i18n = json;
|
||||||
callback();
|
callback();
|
||||||
})
|
})
|
||||||
.catch(error => console.error('Error loading i18n JSON:', error));
|
.catch((error) => console.error("Error loading i18n JSON:", error));
|
||||||
}
|
}
|
||||||
|
|
||||||
function loadBlockchainOptions() {
|
function loadBlockchainOptions() {
|
||||||
const blockchainSelect = document.getElementById("blockchain");
|
const blockchainSelect = document.getElementById("blockchain");
|
||||||
blockchainSelect.innerHTML = '';
|
blockchainSelect.innerHTML = "";
|
||||||
|
|
||||||
for (const key in data) {
|
for (const key in data) {
|
||||||
const option = document.createElement("option");
|
const option = document.createElement("option");
|
||||||
@ -53,7 +53,7 @@ function loadBlockchainOptions() {
|
|||||||
|
|
||||||
function changeLanguage(lang) {
|
function changeLanguage(lang) {
|
||||||
loadI18n(`i18n/${lang}.json`, () => {
|
loadI18n(`i18n/${lang}.json`, () => {
|
||||||
document.getElementById("title").textContent = i18n.title;
|
document.getElementById("title-text").textContent = i18n.title;
|
||||||
document.getElementById("copyAddress").textContent = i18n.copyAddress;
|
document.getElementById("copyAddress").textContent = i18n.copyAddress;
|
||||||
loadBlockchainOptions();
|
loadBlockchainOptions();
|
||||||
});
|
});
|
||||||
|
|||||||
24
styles.css
24
styles.css
@ -1,5 +1,5 @@
|
|||||||
body {
|
body {
|
||||||
font-family: 'Roboto', sans-serif;
|
font-family: Microsoft YaHei;
|
||||||
background-color: #f2f2f2;
|
background-color: #f2f2f2;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -25,10 +25,16 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 24px;
|
font-size: 20px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#title-icon {
|
||||||
|
width: 30px;
|
||||||
|
vertical-align: bottom;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
.donation-card {
|
.donation-card {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
@ -56,13 +62,13 @@ select {
|
|||||||
height: 30px;
|
height: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#donation-info img {
|
#qr-code {
|
||||||
width: 150px;
|
width: 150px;
|
||||||
height: 150px;
|
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#address {
|
#address {
|
||||||
|
font-family: consolas;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
background-color: #f0f0f0;
|
background-color: #f0f0f0;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
@ -72,7 +78,7 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
background-color: #4CAF50;
|
background-color: #4caf50;
|
||||||
color: white;
|
color: white;
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
border: none;
|
border: none;
|
||||||
@ -86,6 +92,12 @@ button:hover {
|
|||||||
background-color: #45a049;
|
background-color: #45a049;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#copyIcon {
|
||||||
|
width: 16px;
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
.language-list {
|
.language-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -103,7 +115,7 @@ button:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.language-list li:hover {
|
.language-list li:hover {
|
||||||
color: #4CAF50;
|
color: #4caf50;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-media {
|
.social-media {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user