Compare commits

..

2 Commits

Author SHA1 Message Date
5c0acdc32e
feat: add bg image 2024-08-22 23:17:12 +08:00
29c82d721d
feat: add thank you 2024-08-22 23:10:38 +08:00
6 changed files with 21 additions and 3 deletions

@ -1,5 +1,6 @@
{ {
"title": "Donate Cryptocurrency", "title": "Donate Cryptocurrency",
"thankYou": "🎉Thank you for your support!🎉<br>Your support is the driving force for my progress!",
"copyAddress": "Copy Address", "copyAddress": "Copy Address",
"copyAddressSuccess": "Address Copied!", "copyAddressSuccess": "Address Copied!",
"english": "English", "english": "English",

@ -1,5 +1,6 @@
{ {
"title": "捐赠加密货币", "title": "捐赠加密货币",
"thankYou": "🎉非常感谢您的支持!🎉<br>您的支持是我前进的最大动力!",
"copyAddress": "复制地址", "copyAddress": "复制地址",
"copyAddressSuccess": "复制成功", "copyAddressSuccess": "复制成功",
"english": "English", "english": "English",

BIN
img/bg.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

@ -3,7 +3,7 @@
<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>Donate to me 🥤</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>
@ -15,6 +15,7 @@
>捐赠加密货币</span >捐赠加密货币</span
> >
</h1> </h1>
<div id="thank-you">非常感谢您的支持!<br />您的支持是我前进的最大动力!</div>
<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>

@ -53,6 +53,7 @@ function loadBlockchainOptions() {
function changeLanguage(lang) { function changeLanguage(lang) {
loadI18n(`i18n/${lang}.json`, () => { loadI18n(`i18n/${lang}.json`, () => {
document.getElementById("thank-you").innerHTML = i18n.thankYou;
document.getElementById("title-text").textContent = i18n.title; document.getElementById("title-text").textContent = i18n.title;
document.getElementById("copyAddress").textContent = i18n.copyAddress; document.getElementById("copyAddress").textContent = i18n.copyAddress;
loadBlockchainOptions(); loadBlockchainOptions();

@ -1,6 +1,10 @@
body { body {
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
background-color: #f2f2f2; /* background-color: #f2f2f2; */
background-image: url("img/bg.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -9,13 +13,16 @@ body {
} }
.container { .container {
z-index: 1;
background-color: rgba(255, 255, 255, 0.6);
border-radius: 15px;
text-align: center; text-align: center;
padding: 20px; padding: 20px;
} }
.card { .card {
width: 300px; width: 300px;
background-color: #ffffff; background-color: rgba(255, 255, 255, 0.6);
border-radius: 15px; border-radius: 15px;
padding: 20px; padding: 20px;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
@ -35,6 +42,13 @@ h1 {
margin-right: 8px; margin-right: 8px;
} }
#thank-you {
font-size: 16px;
line-height: 1.5em;
margin-bottom: 20px;
color: #e48237ff;
}
.donation-card { .donation-card {
text-align: center; text-align: center;
} }