earthjasonlin/donate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add logo, copy icon

Browse Source
This commit is contained in:
Zichao Lin 2024-08-22 22:49:04 +08:00
parent 934a5cd50d
commit 2bc34662a7
Signed by: earthjasonlin
GPG Key ID: 406D9913DE2E42FB
6 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
img/coffee.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 54 KiB

BIN
img/copy-black.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

BIN
img/copy-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

4
index.html
View File

@ -10,7 +10,7 @@
<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>
@ -21,7 +21,7 @@
<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">bc1pfx4a7n6fuyum4dv6rjmg9nsuj7t9wdepjjgsp67d6n8hsdp8w47qw228fy</p>
<button onclick="copyAddress()" id="copyAddress">复制地址</button> <button onclick="copyAddress()"><img id="copyIcon" src="img/copy-white.png" alt=""><span id="copyAddress">复制地址</span></button>
</div> </div>
</div> </div>
</div> </div>

2
script.js
View File

@ -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();
}); });

20
styles.css
View File

@ -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;
@ -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;