From 4068930db72fe53b9fe78c27fb30f2bbce1d52e3 Mon Sep 17 00:00:00 2001
From: redphx <96280+redphx@users.noreply.github.com>
Date: Sun, 12 May 2024 14:40:15 +0700
Subject: [PATCH] Fix bug with Game Bar when showing it on the right side

---
 src/assets/css/game-bar.styl     | 3 ++-
 src/modules/game-bar/game-bar.ts | 5 +++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/assets/css/game-bar.styl b/src/assets/css/game-bar.styl
index 27cbaea..9752e80 100644
--- a/src/assets/css/game-bar.styl
+++ b/src/assets/css/game-bar.styl
@@ -33,7 +33,7 @@
         transition: opacity 0.1s ease-in;
 
         &.bx-show {
-            opacity: 1;
+            opacity: 0.9;
 
             + svg {
                 display: none !important;
@@ -111,6 +111,7 @@
         direction: rtl;
 
         .bx-game-bar-container {
+            direction: ltr;
             border-radius: 10px 0 0 10px;
         }
     }
diff --git a/src/modules/game-bar/game-bar.ts b/src/modules/game-bar/game-bar.ts
index dd51f4f..1012a07 100644
--- a/src/modules/game-bar/game-bar.ts
+++ b/src/modules/game-bar/game-bar.ts
@@ -45,6 +45,11 @@ export class GameBar {
             new MicrophoneAction(),
         ];
 
+        // Reverse the action list if Game Bar's position is on the right side
+        if (position === 'bottom-right') {
+            this.actions.reverse();
+        }
+
         // Render actions
         for (const action of this.actions) {
             $container.appendChild(action.render());