From cda6567c4c4e7b1316e815a4127fe213fd4deafc Mon Sep 17 00:00:00 2001
From: nymkappa <1612910616@pm.me>
Date: Sat, 15 Jul 2023 16:50:18 +0900
Subject: [PATCH] [network selector] fix rtl issue

---
 .../bisq-master-page.component.html               |  2 +-
 .../bisq-master-page.component.scss               | 15 +++++++++++++++
 .../liquid-master-page.component.html             |  2 +-
 .../liquid-master-page.component.scss             | 15 +++++++++++++++
 .../master-page/master-page.component.html        |  2 +-
 .../master-page/master-page.component.scss        | 15 +++++++++++++++
 6 files changed, 48 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/components/bisq-master-page/bisq-master-page.component.html b/frontend/src/app/components/bisq-master-page/bisq-master-page.component.html
index 010723125..61597a2ed 100644
--- a/frontend/src/app/components/bisq-master-page/bisq-master-page.component.html
+++ b/frontend/src/app/components/bisq-master-page/bisq-master-page.component.html
@@ -41,7 +41,7 @@
 
   <div ngbDropdown (window:resize)="onResize($event)" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED || env.LIQUID_TESTNET_ENABLED">
     <button ngbDropdownToggle type="button" class="btn btn-secondary dropdown-toggle-split d-flex justify-content-center align-items-center" aria-haspopup="true">
-      <app-svg-images class="d-flex justify-content-center align-items-center" name="bisq" width="20" height="20" viewBox="0 0 80 80" style="width: 20px; height: 20px; margin-right: 5px;"></app-svg-images>
+      <app-svg-images class="d-flex justify-content-center align-items-center current-network-svg" name="bisq" width="20" height="20" viewBox="0 0 80 80"></app-svg-images>
     </button>
     <div ngbDropdownMenu [ngClass]="{'dropdown-menu-right' : isMobile}">
       <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + (networkPaths['mainnet'] || '/')" ngbDropdownItem class="mainnet"><app-svg-images name="bitcoin" width="22" height="22" viewBox="0 0 65 65" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Mainnet</a>
diff --git a/frontend/src/app/components/bisq-master-page/bisq-master-page.component.scss b/frontend/src/app/components/bisq-master-page/bisq-master-page.component.scss
index c4ecbb0ce..c7c9bddc2 100644
--- a/frontend/src/app/components/bisq-master-page/bisq-master-page.component.scss
+++ b/frontend/src/app/components/bisq-master-page/bisq-master-page.component.scss
@@ -147,3 +147,18 @@ nav {
 .navbar-brand {
   margin-right: 5px;
 }
+
+.current-network-svg {
+  width: 20px;
+  height: 20px;
+  margin-right: 5px;
+}
+
+:host-context(.rtl-layout) {
+  .current-network-svg {
+    width: 20px;
+    height: 20px;
+    margin-left: 5px;
+    margin-right: 0px;
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
index 61d0ab61a..476c78622 100644
--- a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
+++ b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.html
@@ -46,7 +46,7 @@
 
   <div ngbDropdown (window:resize)="onResize()" class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED || env.LIQUID_TESTNET_ENABLED">
     <button ngbDropdownToggle type="button" class="btn btn-secondary dropdown-toggle-split d-flex justify-content-center align-items-center" aria-haspopup="true">
-      <app-svg-images class="d-flex justify-content-center align-items-center" [name]="network.val === '' ? 'liquid' : network.val" width="20" height="20" viewBox="0 0 125 125" style="width: 20px; height: 20px; margin-right: 5px;"></app-svg-images>
+      <app-svg-images class="d-flex justify-content-center align-items-center current-network-svg" [name]="network.val === '' ? 'liquid' : network.val" width="20" height="20" viewBox="0 0 125 125"></app-svg-images>
     </button>
     <div ngbDropdownMenu [ngClass]="{'dropdown-menu-right' : isMobile}">
       <a [href]="env.MEMPOOL_WEBSITE_URL + urlLanguage + (networkPaths['mainnet'] || '')" ngbDropdownItem class="mainnet"><app-svg-images name="bitcoin" width="22" height="22" viewBox="0 0 65 65" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Mainnet</a>
diff --git a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.scss b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.scss
index fefa1dd95..bcdaccfe5 100644
--- a/frontend/src/app/components/liquid-master-page/liquid-master-page.component.scss
+++ b/frontend/src/app/components/liquid-master-page/liquid-master-page.component.scss
@@ -136,4 +136,19 @@ nav {
 }
 .navbar-dark .navbar-nav .nav-link {
   color: #f1f1f1;
+}
+
+.current-network-svg {
+  width: 20px;
+  height: 20px;
+  margin-right: 5px;
+}
+
+:host-context(.rtl-layout) {
+  .current-network-svg {
+    width: 20px;
+    height: 20px;
+    margin-left: 5px;
+    margin-right: 0px;
+  }
 }
\ No newline at end of file
diff --git a/frontend/src/app/components/master-page/master-page.component.html b/frontend/src/app/components/master-page/master-page.component.html
index 26c5018df..79daf7de6 100644
--- a/frontend/src/app/components/master-page/master-page.component.html
+++ b/frontend/src/app/components/master-page/master-page.component.html
@@ -19,7 +19,7 @@
 
   <div (window:resize)="onResize()" ngbDropdown class="dropdown-container" *ngIf="env.TESTNET_ENABLED || env.SIGNET_ENABLED || env.LIQUID_ENABLED || env.BISQ_ENABLED || env.LIQUID_TESTNET_ENABLED">
     <button ngbDropdownToggle type="button" class="btn btn-secondary dropdown-toggle-split d-flex justify-content-center align-items-center" aria-haspopup="true">
-      <app-svg-images class="d-flex justify-content-center align-items-center" [name]="network.val === '' ? 'bitcoin' : network.val" width="20" height="20" viewBox="0 0 65 65" style="width: 20px; height: 20px; margin-right: 5px;"></app-svg-images>
+      <app-svg-images class="d-flex justify-content-center align-items-center current-network-svg" [name]="network.val === '' ? 'bitcoin' : network.val" width="20" height="20" viewBox="0 0 65 65"></app-svg-images>
     </button>
     <div ngbDropdownMenu [ngClass]="{'dropdown-menu-right' : isMobile}">
       <a ngbDropdownItem class="mainnet" [routerLink]="networkPaths['mainnet'] || '/'"><app-svg-images name="bitcoin" width="22" height="22" viewBox="0 0 65 65" style="width: 25px; height: 25px;" class="mainnet mr-1"></app-svg-images> Mainnet</a>
diff --git a/frontend/src/app/components/master-page/master-page.component.scss b/frontend/src/app/components/master-page/master-page.component.scss
index 54a22a470..fc8b4eb5a 100644
--- a/frontend/src/app/components/master-page/master-page.component.scss
+++ b/frontend/src/app/components/master-page/master-page.component.scss
@@ -193,3 +193,18 @@ nav {
     font-size: 7px;
   }
 }
+
+.current-network-svg {
+  width: 20px;
+  height: 20px;
+  margin-right: 5px;
+}
+
+:host-context(.rtl-layout) {
+  .current-network-svg {
+    width: 20px;
+    height: 20px;
+    margin-left: 5px;
+    margin-right: 0px;
+  }
+}
\ No newline at end of file