diff --git a/src/components/views/settings/LayoutSwitcher.tsx b/src/components/views/settings/LayoutSwitcher.tsx index dd008206d5b1..d53b33281c00 100644 --- a/src/components/views/settings/LayoutSwitcher.tsx +++ b/src/components/views/settings/LayoutSwitcher.tsx @@ -15,7 +15,7 @@ */ import React, { JSX, useEffect, useState } from "react"; -import { InlineField, ToggleControl, Label, Root, RadioControl } from "@vector-im/compound-web"; +import { HelpMessage, InlineField, Label, RadioControl, Root, ToggleControl } from "@vector-im/compound-web"; import SettingsSubsection from "./shared/SettingsSubsection"; import { _t } from "../../../languageHandler"; @@ -144,6 +144,7 @@ function useEventTileInfo(): EventTileInfo { */ function ToggleCompactLayout(): JSX.Element { const compactLayoutEnabled = useSettingValue("useCompactLayout"); + const layout = useSettingValue("layout"); return ( } + control={ + + } > + {_t("settings|appearance|compact_layout_description")} ); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 470dea4bd6ba..2ebc616d9f2f 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -2421,7 +2421,8 @@ "always_show_message_timestamps": "Always show message timestamps", "appearance": { "bundled_emoji_font": "Use bundled emoji font", - "compact_layout": "Show compact layout", + "compact_layout": "Show compact text and messages", + "compact_layout_description": "Modern layout must be selected to use this feature.", "custom_font": "Use a system font", "custom_font_description": "Set the name of a font installed on your system & %(brand)s will attempt to use it.", "custom_font_name": "System font name",