Mirror/brk
1
0
Fork 0
mirror of https://github.com/bitcoinresearchkit/brk.git synced 2026-07-19 15:08:12 -07:00
Code Issues Packages Projects Releases Wiki Activity

website: redesign part 31

Browse Source
This commit is contained in:
nym21
2026-06-18 22:39:28 +02:00
parent 408d83c350
commit 00f7d69ea6
37 changed files with 811 additions and 703 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website_next/wallets/wallet/address/index.js
+8 -8
View File
@@ -14,14 +14,14 @@ export function createGroupedAddress(text) {
const groups = text.match(/.{1,4}/g) ?? [];
for (let groupIndex = 0; groupIndex < groups.length; groupIndex += 1) {
const group = createElement("span", "wallets__address-group");
const group = document.createElement("span");
for (const character of groups[groupIndex]) {
const span = createElement(
"span",
Number.isNaN(Number(character))
? "wallets__address-letter"
: "wallets__address-number",
const span = document.createElement("span");
span.setAttribute(
"data-wallets-address-character",
Number.isNaN(Number(character)) ? "letter" : "number",
);
span.append(character);
@@ -55,7 +55,7 @@ function createPrivateAddress(address) {
* @param {WalletAddress} row
*/
function createAddressBadge(row) {
const badge = createElement("span", "wallets__address-badge");
const badge = document.createElement("span");
const label = row.branchLabel?.toLowerCase() ?? "address";
badge.setAttribute("data-wallets-address-branch", label);
@@ -69,7 +69,7 @@ function createAddressBadge(row) {
*/
export function createAddressCellContent(row) {
const element = createElement("div", "wallets__address-cell");
const anonSet = createElement("span", "wallets__address-meta");
const anonSet = document.createElement("span");
anonSet.append(`anon set: ${formatNumber(row.historyBucketSize)}`);
element.append(
website_next/wallets/wallet/address/style.css
+25 -25
View File
@@ -2,24 +2,24 @@ main.wallets {
.wallets__address-cell {
display: grid;
gap: 0.25rem;
}
.wallets__address-meta {
color: var(--gray);
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
}
> span:first-child {
display: inline-flex;
align-items: center;
justify-self: start;
min-height: 1rem;
border: 1px solid color-mix(in oklch, var(--gray) 28%, transparent);
border-radius: 0.25rem;
padding: 0 0.25rem;
color: color-mix(in oklch, var(--white) 76%, var(--gray));
line-height: 1;
}
.wallets__address-badge {
display: inline-flex;
align-items: center;
justify-self: start;
min-height: 1rem;
border: 1px solid color-mix(in oklch, var(--gray) 28%, transparent);
border-radius: 0.25rem;
padding: 0 0.25rem;
color: color-mix(in oklch, var(--white) 76%, var(--gray));
line-height: 1;
> span:last-child {
color: var(--gray);
font-size: var(--font-size-xs);
line-height: var(--line-height-xs);
}
}
.wallets__address {
@@ -27,17 +27,17 @@ main.wallets {
flex-wrap: wrap;
gap: 0 0.375rem;
max-width: 40rem;
}
.wallets__address-group {
white-space: nowrap;
}
> span {
white-space: nowrap;
}
.wallets__address-letter {
color: var(--white);
}
[data-wallets-address-character="letter"] {
color: var(--white);
}
.wallets__address-number {
color: color-mix(in oklch, var(--white) 50%, var(--gray));
[data-wallets-address-character="number"] {
color: color-mix(in oklch, var(--white) 50%, var(--gray));
}
}
}