diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.html b/frontend/src/app/components/transactions-list/transactions-list.component.html index 1bc284d3f..7f79f4a85 100644 --- a/frontend/src/app/components/transactions-list/transactions-list.component.html +++ b/frontend/src/app/components/transactions-list/transactions-list.component.html @@ -341,7 +341,22 @@ @if (vout.isRunestone) { } @else { - {{ vout.scriptpubkey_asm | slice:0:200 | hex2ascii }} + + @if ((vout.scriptpubkey_asm | hex2ascii).length > 200) { + {{ vout.scriptpubkey_asm | hex2ascii | slice:0:200 }} + + @if ((vout.scriptpubkey_asm | hex2ascii).length > 200) { + @if (!showFullOpReturnPreview[vindex]) { + Show more + } @else { + Show less + } + } + + } @else { + {{ vout.scriptpubkey_asm | hex2ascii }} + } + } {{ vout.scriptpubkey_type | scriptpubkeyType }} @@ -392,6 +407,15 @@ + + + {{ vout.scriptpubkey_asm | hex2ascii | slice:0:8000 }} + + @@ -428,7 +452,7 @@ -
OP_RETURN data + @if (!showFullOpReturnData[vindex]) { {{ (vout.scriptpubkey_asm | hex2ascii | slice:0:1000) }} } @else { diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.scss b/frontend/src/app/components/transactions-list/transactions-list.component.scss index 4aa93907b..24e459d44 100644 --- a/frontend/src/app/components/transactions-list/transactions-list.component.scss +++ b/frontend/src/app/components/transactions-list/transactions-list.component.scss @@ -324,3 +324,25 @@ h2 { background-color: var(--primary); } } + +.scriptmessage.opreturn-msg { + max-width: 20px; + @media (min-width: 476px) { + max-width: 110px; + } + @media (min-width: 576px) { + max-width: 190px; + } + @media (min-width: 768px) { + max-width: 330px; + } + @media (min-width: 850px) { + max-width: 452px; + } + @media (min-width: 992px) { + max-width: 120px; + } + @media (min-width: 1200px) { + max-width: 180px; + } +} \ No newline at end of file diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.ts b/frontend/src/app/components/transactions-list/transactions-list.component.ts index 241c39101..582f6a92a 100644 --- a/frontend/src/app/components/transactions-list/transactions-list.component.ts +++ b/frontend/src/app/components/transactions-list/transactions-list.component.ts @@ -66,6 +66,7 @@ export class TransactionsListComponent implements OnInit, OnChanges, OnDestroy { showFullScriptPubkeyAsm: { [voutIndex: number]: boolean } = {}; showFullScriptPubkeyHex: { [voutIndex: number]: boolean } = {}; showFullOpReturnData: { [voutIndex: number]: boolean } = {}; + showFullOpReturnPreview: { [voutIndex: number]: boolean } = {}; showOrdData: { [key: string]: { show: boolean; inscriptions?: Inscription[]; runestone?: Runestone, runeInfo?: { [id: string]: { etching: Etching; txid: string; } }; } } = {}; similarityMatches: Map> = new Map(); @@ -551,6 +552,10 @@ export class TransactionsListComponent implements OnInit, OnChanges, OnDestroy { this.showFullOpReturnData[voutIndex] = !this.showFullOpReturnData[voutIndex]; } + toggleShowFullOpReturnPreview(voutIndex: number): void { + this.showFullOpReturnPreview[voutIndex] = !this.showFullOpReturnPreview[voutIndex]; + } + toggleOrdData(txid: string, type: 'vin' | 'vout', index: number) { const tx = this.transactions.find((tx) => tx.txid === txid); if (!tx) {