From cfbe1cb066697a8cd0b5ebf45fb5e5c49048a076 Mon Sep 17 00:00:00 2001
From: Suguru Hirahara <luixxiul@users.noreply.github.com>
Date: Sun, 19 Jun 2022 12:35:04 +0000
Subject: [PATCH] Stop using absolute property to place beta pill on
 RoomPreviewCard (#8872)

---
 res/css/views/rooms/_RoomPreviewCard.scss      | 12 +++++-------
 src/components/views/rooms/RoomPreviewCard.tsx |  2 +-
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/res/css/views/rooms/_RoomPreviewCard.scss b/res/css/views/rooms/_RoomPreviewCard.scss
index 322a8c4251..782eb29248 100644
--- a/res/css/views/rooms/_RoomPreviewCard.scss
+++ b/res/css/views/rooms/_RoomPreviewCard.scss
@@ -71,6 +71,11 @@ limitations under the License.
                 color: $secondary-content;
             }
         }
+
+        // XXX Remove this when video rooms leave beta
+        .mx_BetaCard_betaPill {
+            align-self: start;
+        }
     }
 
     .mx_RoomPreviewCard_avatar {
@@ -105,13 +110,6 @@ limitations under the License.
                 mask-image: url('$(res)/img/element-icons/call/video-call.svg');
             }
         }
-
-        // XXX Remove this when video rooms leave beta
-        .mx_BetaCard_betaPill {
-            position: absolute;
-            right: $spacing-24;
-            top: $spacing-32;
-        }
     }
 
     h1.mx_RoomPreviewCard_name {
diff --git a/src/components/views/rooms/RoomPreviewCard.tsx b/src/components/views/rooms/RoomPreviewCard.tsx
index 65dadc96f6..132ba6720e 100644
--- a/src/components/views/rooms/RoomPreviewCard.tsx
+++ b/src/components/views/rooms/RoomPreviewCard.tsx
@@ -102,6 +102,7 @@ const RoomPreviewCard: FC<IProps> = ({ room, onJoinButtonClicked, onRejectButton
                         { inviteSender }
                     </div> : null }
                 </div>
+                <BetaPill onClick={viewLabs} tooltipTitle={_t("Video rooms are a beta feature")} />
             </div>;
         }
 
@@ -152,7 +153,6 @@ const RoomPreviewCard: FC<IProps> = ({ room, onJoinButtonClicked, onRejectButton
         avatarRow = <>
             <RoomAvatar room={room} height={50} width={50} viewAvatarOnClick />
             <div className="mx_RoomPreviewCard_video" />
-            <BetaPill onClick={viewLabs} tooltipTitle={_t("Video rooms are a beta feature")} />
         </>;
     } else if (room.isSpaceRoom()) {
         avatarRow = <RoomAvatar room={room} height={80} width={80} viewAvatarOnClick />;