From 18d7f7c525684d2f165f8b14f44a03515900c6ec Mon Sep 17 00:00:00 2001
From: Suguru Hirahara <luixxiul@users.noreply.github.com>
Date: Sun, 12 Jun 2022 14:52:55 +0000
Subject: [PATCH] Use mx_SettingsTab_subsectionText for the text under the top
 header of appearance user settings tab (#8822)

---
 .../views/settings/tabs/user/_AppearanceUserSettingsTab.scss   | 3 ++-
 .../views/settings/tabs/user/AppearanceUserSettingsTab.tsx     | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss b/res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss
index a4e4eccd210..b276f780947 100644
--- a/res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss
+++ b/res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss
@@ -15,8 +15,9 @@ limitations under the License.
 */
 
 .mx_AppearanceUserSettingsTab {
-    > .mx_SettingsTab_SubHeading {
+    .mx_SettingsTab_subsectionText {
         margin-block: $spacing-12 $spacing-32;
+        color: $primary-content; // Same as mx_SettingsTab
     }
 
     .mx_Field {
diff --git a/src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx b/src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx
index 7c0821a1391..5742d6544cf 100644
--- a/src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx
+++ b/src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx
@@ -143,7 +143,7 @@ export default class AppearanceUserSettingsTab extends React.Component<IProps, I
         return (
             <div className="mx_SettingsTab mx_AppearanceUserSettingsTab">
                 <div className="mx_SettingsTab_heading">{ _t("Customise your appearance") }</div>
-                <div className="mx_SettingsTab_SubHeading">
+                <div className="mx_SettingsTab_subsectionText">
                     { _t("Appearance Settings only affect this %(brand)s session.", { brand }) }
                 </div>
                 <ThemeChoicePanel />