Display description of E2E advanced panel as subsection text (#8889)

res/css/_components.scss

@@ -280,7 +280,6 @@
 @import "./views/settings/_CrossSigningPanel.scss";
 @import "./views/settings/_CryptographyPanel.scss";
 @import "./views/settings/_DevicesPanel.scss";
-@import "./views/settings/_E2eAdvancedPanel.scss";
 @import "./views/settings/_EmailAddresses.scss";
 @import "./views/settings/_FontScalingPanel.scss";
 @import "./views/settings/_ImageSizePanel.scss";

res/css/views/settings/_E2eAdvancedPanel.scss

@@ -1,19 +0,0 @@
-/*
-Copyright 2020 The Matrix.org Foundation C.I.C.
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-.mx_E2eAdvancedPanel_settingLongDescription {
-    margin-right: 150px;
-}

src/components/views/settings/E2eAdvancedPanel.tsx

@@ -30,7 +30,7 @@ const E2eAdvancedPanel = props => {
         <SettingsFlag name={SETTING_MANUALLY_VERIFY_ALL_SESSIONS}
             level={SettingLevel.DEVICE}
         />
-        <div className="mx_E2eAdvancedPanel_settingLongDescription">{ _t(
+        <div className="mx_SettingsTab_subsectionText">{ _t(
             "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.",
         ) }</div>
     </div>;