schmidt1024/xmrpay.link
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add document-and-coin favicon concept and sync paid favicon state

Browse Source
This commit is contained in:
Alexander Schmidt
2026-03-26 13:10:30 +01:00
parent 9cc50188c0
commit a2c3d8dd00
4 changed files with 56 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app.js
View File

@@ -464,6 +464,7 @@
}
paymentSummary.innerHTML = html;
paymentSummary.classList.remove('paid-confirmed');
resetFavicon();
}
function updatePageTitle(xmrAmount, desc) {
@@ -993,6 +994,7 @@
paymentStatus.className = 'payment-status pending';
paymentSummary.classList.remove('paid-confirmed');
qrContainer.classList.add('confirming');
resetFavicon();
var existingStamp = qrContainer.querySelector('.paid-stamp');
if (!existingStamp) {
@@ -1063,13 +1065,29 @@
}
}
function getBaseFaviconHref() {
var link = document.getElementById('favicon');
if (!link) return 'favicon.svg';
var baseHref = link.getAttribute('data-base-href') || link.getAttribute('href') || 'favicon.svg';
if (!link.getAttribute('data-base-href')) {
link.setAttribute('data-base-href', baseHref);
}
return baseHref;
}
function resetFavicon() {
var link = document.getElementById('favicon');
if (!link) return;
link.href = getBaseFaviconHref();
}
function setPaidFavicon() {
var canvas = document.createElement('canvas');
canvas.width = 32;
canvas.height = 32;
var ctx = canvas.getContext('2d');
// Draw Monero logo
// Draw current base favicon and overlay paid badge
var img = new Image();
img.onload = function () {
ctx.drawImage(img, 0, 0, 32, 32);
@@ -1086,6 +1104,6 @@
var link = document.getElementById('favicon');
link.href = canvas.toDataURL('image/png');
};
img.src = 'favicon.svg';
img.src = getBaseFaviconHref();
}
})();

2
app.min.js vendored
View File

File diff suppressed because one or more lines are too long

18
branding/logo-doc-coin-monero.svg Normal file
View File

@@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" role="img" aria-label="xmrpay.link document with Monero coin concept">
<g transform="translate(-13.8 -13.4) scale(1.21)">
<path d="M28 18h44l18 18v60a10 10 0 0 1-10 10H28a10 10 0 0 1-10-10V28a10 10 0 0 1 10-10z" fill="#ffffff"/>
<path d="M72 18v18h18" fill="#e5e7eb"/>
<g fill="none" stroke="#111827" stroke-linejoin="round" stroke-linecap="round">
<path d="M28 18h44l18 18v60a10 10 0 0 1-10 10H28a10 10 0 0 1-10-10V28a10 10 0 0 1 10-10z" stroke-width="4"/>
<path d="M72 18v18h18" stroke-width="4"/>
<rect x="30" y="42" width="36" height="4" rx="2" fill="#111827" stroke="none"/>
<rect x="30" y="54" width="28" height="4" rx="2" fill="#111827" stroke="none"/>
<rect x="30" y="66" width="22" height="4" rx="2" fill="#111827" stroke="none"/>
</g>
<circle cx="84" cy="86" r="24" fill="#f26821"/>
<circle cx="84" cy="86" r="24" fill="none" stroke="#111827" stroke-width="4"/>
<g transform="translate(57.3 59.3) scale(0.175)">
<path d="m 270.75,190.58 h -0.72 -37.14 v -104.12 l -80.69,80.69 -80.69,-80.69 v 104.12 h -37.14 -0.72 a 124.61,124.61 0 0 0 12.42,26.92 h 52.36 v -66.05 l 53.77,53.77 53.77,-53.77 v 66.05 h 52.36 a 124.61,124.61 0 0 0 12.42,-26.92 z" fill="#ffffff"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

20
favicon.svg
View File

@@ -1,4 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 304.39 304.39">
<circle cx="152.2" cy="152.2" r="152.2" fill="#f26821"/>
<path d="m 270.75,190.58 h -0.72 -37.14 v -104.12 l -80.69,80.69 -80.69,-80.69 v 104.12 h -37.14 -0.72 a 124.61,124.61 0 0 0 12.42,26.92 h 52.36 v -66.05 l 53.77,53.77 53.77,-53.77 v 66.05 h 52.36 a 124.61,124.61 0 0 0 12.42,-26.92 z" fill="#fff"/>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" role="img" aria-label="xmrpay.link document with Monero coin concept">
<g transform="translate(-13.8 -13.4) scale(1.21)">
<path d="M28 18h44l18 18v60a10 10 0 0 1-10 10H28a10 10 0 0 1-10-10V28a10 10 0 0 1 10-10z" fill="#ffffff"/>
<path d="M72 18v18h18" fill="#e5e7eb"/>
<g fill="none" stroke="#111827" stroke-linejoin="round" stroke-linecap="round">
<path d="M28 18h44l18 18v60a10 10 0 0 1-10 10H28a10 10 0 0 1-10-10V28a10 10 0 0 1 10-10z" stroke-width="4"/>
<path d="M72 18v18h18" stroke-width="4"/>
<rect x="30" y="42" width="36" height="4" rx="2" fill="#111827" stroke="none"/>
<rect x="30" y="54" width="28" height="4" rx="2" fill="#111827" stroke="none"/>
<rect x="30" y="66" width="22" height="4" rx="2" fill="#111827" stroke="none"/>
</g>
<circle cx="84" cy="86" r="24" fill="#f26821"/>
<circle cx="84" cy="86" r="24" fill="none" stroke="#111827" stroke-width="4"/>
<g transform="translate(57.3 59.3) scale(0.175)">
<path d="m 270.75,190.58 h -0.72 -37.14 v -104.12 l -80.69,80.69 -80.69,-80.69 v 104.12 h -37.14 -0.72 a 124.61,124.61 0 0 0 12.42,26.92 h 52.36 v -66.05 l 53.77,53.77 53.77,-53.77 v 66.05 h 52.36 a 124.61,124.61 0 0 0 12.42,-26.92 z" fill="#ffffff"/>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 386 B

After

Width:  |  Height:  |  Size: 1.3 KiB