Tweak bottom of space panel buttons in expanded state (#7213)

src/components/views/spaces/QuickSettingsButton.tsx

@@ -34,8 +34,9 @@ import SettingsStore from "../../../settings/SettingsStore";
 import { SettingLevel } from "../../../settings/SettingLevel";
 import dis from "../../../dispatcher/dispatcher";
 import { RecheckThemePayload } from "../../../dispatcher/payloads/RecheckThemePayload";
+import classNames from "classnames";
 
-const QuickSettingsButton = () => {
+const QuickSettingsButton = ({ isPanelCollapsed = false }) => {
     const orderedThemes = useMemo(getOrderedThemes, []);
     const [menuDisplayed, handle, openMenu, closeMenu] = useContextMenu<HTMLDivElement>();
 
@@ -137,11 +138,14 @@ const QuickSettingsButton = () => {
 
     return <>
         <AccessibleTooltipButton
-            className="mx_QuickSettingsButton"
+            className={classNames("mx_QuickSettingsButton", { expanded: !isPanelCollapsed })}
             onClick={openMenu}
             title={_t("Quick settings")}
             inputRef={handle}
-        />
+            forceHide={!isPanelCollapsed}
+        >
+            { !isPanelCollapsed ? _t("Settings") : null }
+        </AccessibleTooltipButton>
 
         { contextMenu }
     </>;