handle many signatures

This commit is contained in:
Mononaut
2025-04-21 14:57:11 +00:00
parent 27b4dd485a
commit 773037b857
2 changed files with 29 additions and 20 deletions

View File

@@ -63,8 +63,8 @@
<fa-icon [icon]="['fas', 'lock-open']" [fixedWidth]="true"></fa-icon>
</span>
} @else {
@for (sig of tx['_sigs'][vindex]; track sig.signature; let idx = $index) {
@if (idx < 10) {
@for (sig of tx['_sigs'][vindex].slice(0, 7); track sig.signature; let idx = $index) {
@if (idx < 7) {
<span
class="sig sig-key sighash-{{sig.sighash}}"
(mouseenter)="showSigInfo(i, vindex, sig)"
@@ -76,9 +76,9 @@
</span>
}
}
@if (tx['_sigs'][vindex].length > 10) {
@if (tx['_sigs'][vindex].length > 7) {
<span class="sig sig-key sig-overflow">
+{{ tx['_sigs'][vindex].length - 10 }}
+{{ tx['_sigs'][vindex].length - 7 }}
</span>
}
}

View File

@@ -52,18 +52,26 @@
.sig-td:hover {
.sig-stack {
.sig-key {
@for $i from 1 through 10 {
@for $i from 1 through 8 {
&:nth-child(#{$i}) {
transform: translate(#{($i - 1) * 6}px, #{($i - 1) * 6}px);
}
}
}
.sig-overflow {
opacity: 1;
transform: translate(30px, 40px);
}
}
}
.sig {
cursor: pointer;
&.sig-overflow {
opacity: 0;
}
&.sighash-0 {
--sigColor: var(--green);
@@ -91,16 +99,18 @@
}
color: var(--sigColor);
@for $i from 1 through 10 {
&:nth-child(#{$i}) {
transform: translate(#{($i - 1) * 3}px, #{($i - 1) * 3}px);
color: color-mix(in srgb, var(--sigColor) #{100 - ($i - 1) * 10} + '%', black);
z-index: #{10 - $i};
&.sig-key {
@for $i from 1 through 8 {
&:nth-child(#{$i}) {
transform: translate(#{($i - 1) * 3}px, #{($i - 1) * 3}px);
color: color-mix(in srgb, var(--sigColor) #{100 - ($i - 1) * 10} + '%', black);
z-index: #{10 - $i};
}
}
}
@for $i from 4 through 10 {
&:nth-child(#{$i}) {
transform: translate(9px, 9px);
@for $i from 4 through 8 {
&:nth-child(#{$i}) {
transform: translate(9px, 9px);
}
}
}
@@ -131,14 +141,13 @@
// background-color: var(--tertiary);
color: white;
border-radius: 50%;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
z-index: 1;
padding: 5px;
margin-left: 10px;
margin-right: 10px;
display: block;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.mobile-bottomcol {