feat(viewer-selector): move selector to top end

sign · Sep 23, 2024 · d804ff1 · d804ff1
1 parent ff1436a
commit d804ff1
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 8 deletions.
diff --git a/src/app/pages/translate/pose-viewers/viewer-selector/viewer-selector.component.html b/src/app/pages/translate/pose-viewers/viewer-selector/viewer-selector.component.html
@@ -1,5 +1,5 @@
 <ng-container *transloco="let t; read: 'settings.poseViewer'">
-  <ion-fab vertical="center">
+  <ion-fab id="viewer-selector">
     <ion-fab-button
       size="small"
       [color]="fab.color"
@@ -8,7 +8,7 @@
       matTooltipPosition="before">
       <ion-icon [name]="fab.icon"></ion-icon>
     </ion-fab-button>
-    <ion-fab-list side="top">
+    <ion-fab-list side="bottom">
       @for (button of fabButtons; track button) {
       <ion-fab-button
         [color]="button.color"

diff --git a/src/app/pages/translate/pose-viewers/viewer-selector/viewer-selector.component.scss b/src/app/pages/translate/pose-viewers/viewer-selector/viewer-selector.component.scss
@@ -1,8 +1,9 @@
-:host {
-  display: inline-block;
-  width: 56px;
+ion-fab#viewer-selector {
+  top: 0;
+  right: 0;
 }
 
-ion-fab {
-  display: block;
+::ng-deep html[dir='rtl'] ion-fab#viewer-selector {
+  right: auto;
+  left: 0;
 }
diff --git a/...s/translate/spoken-to-signed/signed-language-output/signed-language-output.component.html b/...s/translate/spoken-to-signed/signed-language-output/signed-language-output.component.html
@@ -47,6 +47,6 @@
     <ion-spinner name="crescent" color="dark"></ion-spinner>
   </ion-button>
   }
-  <app-viewer-selector></app-viewer-selector>
 </div>
+<app-viewer-selector></app-viewer-selector>
 }