Skip to content

Commit

Permalink
fix btc:usd layout display in TX info cmp
Browse files Browse the repository at this point in the history
  • Loading branch information
danielzlatanov committed Sep 24, 2024
1 parent 3a7514e commit 8de6f3a
Showing 1 changed file with 39 additions and 28 deletions.
67 changes: 39 additions & 28 deletions src/app/insights/transaction-info/transaction-info.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -115,16 +115,15 @@ <h2 class="font-bold text-white fade-col">Bitcoin</h2>
<i class="fas fa-coins mr-1 text-base text-orange-400"></i>
Amount
</p>
<ng-container>
<p>
{{ totalAmount }} BTC •
<span class="text-green-400 break-all">
{{ totalAmount * btcPrice | number : "1.2-2" }} USD</span
>
</p>
<div class="flex flex-col sm:flex-row items-start">
<span class="block sm:inline"> {{ totalAmount }} BTC </span>

<p></p>
</ng-container>
<span class="text-gray-400 mx-2 hidden sm:inline"></span>

<span class="text-green-400 break-all block sm:inline">
{{ totalAmount * btcPrice | number : "1.2-2" }} USD
</span>
</div>
</div>

<div class="p-4 border-b border-gray-700">
Expand All @@ -134,15 +133,17 @@ <h2 class="font-bold text-white fade-col">Bitcoin</h2>
></i>
Fee
</p>
<ng-container>
<p *ngIf="fee > 0">
{{ fee }} BTC •
<span class="text-green-400 break-all">
{{ fee * btcPrice | number : "1.2-2" }} USD</span
>
</p>
<p *ngIf="fee == 0">No fee</p>
</ng-container>

<p *ngIf="fee > 0" class="flex flex-col sm:flex-row items-start">
<span class="block sm:inline">{{ fee }} BTC</span>

<span class="text-gray-400 mx-2 hidden sm:inline"></span>

<span class="text-green-400 break-all block sm:inline">
{{ fee * btcPrice | number : "1.2-2" }} USD
</span>
</p>
<p *ngIf="fee == 0">No fee</p>
</div>

<div class="p-4 border-b border-gray-700">
Expand Down Expand Up @@ -239,11 +240,16 @@ <h3 class="text-gray-400 text-lg font-medium mb-2 ml-4">Inputs</h3>
></i>
Amount
</p>
<p class="text-white break-all">
{{ input.amount }} BTC •
<span class="text-green-400">
{{ input.amount * btcPrice | number : "1.2-2" }} USD</span
>
<p
class="text-white flex flex-col lg:flex-row items-start break-all"
>
<span class="block sm:inline">{{ input.amount }} BTC</span>

<span class="text-gray-400 mx-2 hidden lg:inline"></span>

<span class="text-green-400 break-all block sm:inline">
{{ input.amount * btcPrice | number : "1.2-2" }} USD
</span>
</p>
</div>
</div>
Expand Down Expand Up @@ -305,11 +311,16 @@ <h3 class="text-gray-400 text-lg font-medium mb-2 ml-4">Outputs</h3>
></i>
Amount
</p>
<p class="text-white break-all">
{{ output.value }} BTC •
<span class="text-green-400">
{{ output.value * btcPrice | number : "1.2-2" }} USD</span
>
<p
class="text-white flex flex-col lg:flex-row items-start break-all"
>
<span class="block sm:inline">{{ output.value }} BTC</span>

<span class="text-gray-400 mx-2 hidden lg:inline"></span>

<span class="text-green-400 break-all block lg:inline">
{{ output.value * btcPrice | number : "1.2-2" }} USD
</span>
</p>
</div>
</div>
Expand Down

0 comments on commit 8de6f3a

Please sign in to comment.