mirror of
https://github.com/bitcoinresearchkit/brk.git
synced 2026-07-08 09:38:14 -07:00
website: redesign part 31
This commit is contained in:
@@ -46,7 +46,6 @@ function createReceiveQr(receiveAddress) {
|
||||
const image = document.createElement("img");
|
||||
const uri = `bitcoin:${receiveAddress.address}`;
|
||||
|
||||
image.className = "wallets__receive-qr";
|
||||
image.alt = `QR code for ${receiveAddress.address}`;
|
||||
image.src = createQrDataUrl(uri);
|
||||
|
||||
@@ -57,7 +56,7 @@ function createReceiveQr(receiveAddress) {
|
||||
* @param {ReceiveAddress} receiveAddress
|
||||
*/
|
||||
function createReceiveAddress(receiveAddress) {
|
||||
const element = createElement("div", "wallets__receive-address");
|
||||
const element = document.createElement("div");
|
||||
|
||||
element.append(createGroupedAddress(receiveAddress.address));
|
||||
|
||||
@@ -82,8 +81,8 @@ function openReceiveDialog(receiveAddress) {
|
||||
"dialog",
|
||||
"wallets__dialog wallets__receive-dialog",
|
||||
);
|
||||
const content = createElement("div", "wallets__receive-card");
|
||||
const actions = createElement("div", "wallets__receive-actions");
|
||||
const content = document.createElement("div");
|
||||
const actions = document.createElement("div");
|
||||
const copy = document.createElement("button");
|
||||
const close = document.createElement("button");
|
||||
|
||||
@@ -128,7 +127,6 @@ export function renderReceiveButton(element, receiveAddress) {
|
||||
const button = document.createElement("button");
|
||||
|
||||
button.type = "button";
|
||||
button.className = "wallets__receive-button";
|
||||
button.disabled = !receiveAddress;
|
||||
button.append("Receive");
|
||||
button.addEventListener("click", () => {
|
||||
|
||||
@@ -1,46 +1,45 @@
|
||||
main.wallets {
|
||||
.wallets__receive-button:disabled {
|
||||
border-color: color-mix(in oklch, var(--gray) 35%, transparent);
|
||||
color: var(--gray);
|
||||
background: transparent;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.wallets__receive-dialog {
|
||||
width: min(100% - 2rem, 32rem);
|
||||
}
|
||||
|
||||
.wallets__receive-card {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
> div {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-size: var(--font-size-lg);
|
||||
font-weight: 400;
|
||||
line-height: var(--line-height-lg);
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-size: var(--font-size-lg);
|
||||
font-weight: 400;
|
||||
line-height: var(--line-height-lg);
|
||||
}
|
||||
|
||||
> img {
|
||||
justify-self: center;
|
||||
width: min(100%, 18rem);
|
||||
aspect-ratio: 1;
|
||||
padding: 1rem;
|
||||
background: var(--white);
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
> div:first-of-type {
|
||||
color: var(--white);
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: var(--line-height-sm);
|
||||
}
|
||||
|
||||
> div:last-of-type {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
justify-content: end;
|
||||
|
||||
> button:first-child {
|
||||
border-color: var(--orange);
|
||||
color: var(--black);
|
||||
background: var(--orange);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.wallets__receive-qr {
|
||||
justify-self: center;
|
||||
width: min(100%, 18rem);
|
||||
aspect-ratio: 1;
|
||||
padding: 1rem;
|
||||
background: var(--white);
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
.wallets__receive-address {
|
||||
color: var(--white);
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: var(--line-height-sm);
|
||||
}
|
||||
|
||||
.wallets__receive-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
justify-content: end;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user