From b41e32915f2bda9e40986d2a5845c65912bce62b Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Wed, 15 Dec 2021 01:15:16 +0400
Subject: [PATCH 1/2] Fixing broken RBF alert

fixes #516
---
 .../transaction/transaction.component.html    |  2 --
 .../transaction/transaction.component.scss    | 22 +++++--------------
 2 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html
index 1085f6335..818f7891b 100644
--- a/frontend/src/app/components/transaction/transaction.component.html
+++ b/frontend/src/app/components/transaction/transaction.component.html
@@ -20,8 +20,6 @@
         <app-clipboard [text]="txId"></app-clipboard>
       </span>
 
-      <span class="grow"></span>
-
       <div class="container-buttons">
         <ng-template [ngIf]="tx?.status?.confirmed">
           <button *ngIf="latestBlock" type="button" class="btn btn-sm btn-success">
diff --git a/frontend/src/app/components/transaction/transaction.component.scss b/frontend/src/app/components/transaction/transaction.component.scss
index d7d9fb5df..5ef48b9bf 100644
--- a/frontend/src/app/components/transaction/transaction.component.scss
+++ b/frontend/src/app/components/transaction/transaction.component.scss
@@ -3,25 +3,11 @@
 }
 
 .container-buttons {
-	text-align: right;
-  align-self: start;
-  width: auto;
-  margin-right: 15px;
-  right: 0;
-  position: absolute;
-	@media (min-width: 650px) {
-    right: auto;
-    margin-right: auto;
-    position: relative;
-  }
-	@media (min-width: 768px) {
-    align-self: center;
-		float: right;
-	}
+  align-self: center;
 }
 
 .title-block {
-  flex-direction: column;
+	flex-wrap: wrap;
   @media (min-width: 650px) {
     flex-direction: row;
   }
@@ -32,6 +18,7 @@
 }
 .tx-link {
   display: flex;
+	flex-grow: 1;
   margin-bottom: 0px;
   margin-top: 8px;
 	@media (min-width: 650px) {
@@ -45,6 +32,9 @@
     top: 1px;
     position: relative;
 	}
+	@media (max-width: 768px) {
+	  order: 3;
+	}
 }
 
 .td-width {

From 1c6b3a46c6f69bbd439f02067b360fa261da3d2e Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Wed, 15 Dec 2021 02:16:45 +0400
Subject: [PATCH 2/2] Correcting CPFP button position on mobile

fixes #1006
---
 .../components/transaction/transaction.component.html  |  2 +-
 .../components/transaction/transaction.component.scss  | 10 ++++++++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html
index 1085f6335..0174f9d43 100644
--- a/frontend/src/app/components/transaction/transaction.component.html
+++ b/frontend/src/app/components/transaction/transaction.component.html
@@ -196,7 +196,7 @@
       <h2 i18n="transaction.inputs-and-outputs|Transaction inputs and outputs">Inputs & Outputs</h2>
     </div>
 
-    <button type="button" class="btn btn-outline-info btn-sm float-right" (click)="txList.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
+    <button type="button" class="btn btn-outline-info details-button btn-sm float-right" (click)="txList.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
 
     <div class="clearfix"></div>
 
diff --git a/frontend/src/app/components/transaction/transaction.component.scss b/frontend/src/app/components/transaction/transaction.component.scss
index d7d9fb5df..c1ebd29a2 100644
--- a/frontend/src/app/components/transaction/transaction.component.scss
+++ b/frontend/src/app/components/transaction/transaction.component.scss
@@ -127,7 +127,6 @@
 	}
 }
 
-
 .title {
   h2 {
     line-height: 1;
@@ -137,7 +136,14 @@
 }
 
 .btn-outline-info {
-  margin-top: -10px;
+	margin-top: 5px;
+	@media (min-width: 768px){
+		margin-top: 0px;
+	}
+}
+
+.details-button {
+  margin-top: -5px;
 	@media (min-width: 768px){
 		display: inline-block;
     margin-top: 0px;