From 53fcb0c36ecc84727790f305c0ffbc388a3c2e4c Mon Sep 17 00:00:00 2001
From: Suguru Hirahara <luixxiul@users.noreply.github.com>
Date: Mon, 8 May 2023 03:01:00 +0000
Subject: [PATCH] Remove mixin `mx_Tooltip_dark` and rename class
 `mx_Tooltip_dark` (#10801)

* Remove a mixin - mx_Tooltip_dark

The mixin has been used on `_AppsDrawer.pcss` only.

* Rename mx_Tooltip_dark based on the naming policy

'mx_Tooltip_dark' has been used on `AppPermission.tsx` only.
---
 res/css/_common.pcss                            | 16 ----------------
 res/css/views/rooms/_AppsDrawer.pcss            | 13 ++++++++++++-
 src/components/views/elements/AppPermission.tsx |  2 +-
 3 files changed, 13 insertions(+), 18 deletions(-)

diff --git a/res/css/_common.pcss b/res/css/_common.pcss
index dd09d912a3..26d4033c0e 100644
--- a/res/css/_common.pcss
+++ b/res/css/_common.pcss
@@ -695,22 +695,6 @@ legend {
     color: $username-variant8-color;
 }
 
-@define-mixin mx_Tooltip_dark {
-    box-shadow: none;
-    background-color: $tooltip-timeline-bg-color;
-    color: $tooltip-timeline-fg-color;
-    border: none;
-    border-radius: 3px;
-    padding: 6px 8px;
-}
-
-/* This is a workaround for our mixins not supporting child selectors */
-.mx_Tooltip_dark {
-    .mx_Tooltip_chevron::after {
-        border-right-color: $tooltip-timeline-bg-color;
-    }
-}
-
 @define-mixin ProgressBarColour $colour {
     color: $colour;
     &::-moz-progress-bar {
diff --git a/res/css/views/rooms/_AppsDrawer.pcss b/res/css/views/rooms/_AppsDrawer.pcss
index c6e141497d..4580b9c133 100644
--- a/res/css/views/rooms/_AppsDrawer.pcss
+++ b/res/css/views/rooms/_AppsDrawer.pcss
@@ -359,7 +359,18 @@ $MinWidth: 240px;
 }
 
 .mx_AppPermissionWarning_tooltip {
-    @mixin mx_Tooltip_dark;
+    box-shadow: none;
+    background-color: $tooltip-timeline-bg-color;
+    color: $tooltip-timeline-fg-color;
+    border: none;
+    border-radius: 3px;
+    padding: 6px 8px;
+
+    &.mx_AppPermissionWarning_tooltip--dark {
+        .mx_Tooltip_chevron::after {
+            border-right-color: $tooltip-timeline-bg-color;
+        }
+    }
 
     ul {
         list-style-position: inside;
diff --git a/src/components/views/elements/AppPermission.tsx b/src/components/views/elements/AppPermission.tsx
index 23187850d4..33ca2ba4d4 100644
--- a/src/components/views/elements/AppPermission.tsx
+++ b/src/components/views/elements/AppPermission.tsx
@@ -115,7 +115,7 @@ export default class AppPermission extends React.Component<IProps, IState> {
         const warningTooltip = (
             <TextWithTooltip
                 tooltip={warningTooltipText}
-                tooltipClass="mx_AppPermissionWarning_tooltip mx_Tooltip_dark"
+                tooltipClass="mx_AppPermissionWarning_tooltip mx_AppPermissionWarning_tooltip--dark"
             >
                 <span className="mx_AppPermissionWarning_helpIcon" />
             </TextWithTooltip>