style(settings): flatten the addresses and advanced blocks so the whole General page reads as one flat list

This commit is contained in:
heaven 2026-06-04 13:14:10 +03:00
parent d985b289c9
commit fd6115cf85
2 changed files with 6 additions and 24 deletions

View file

@ -17,8 +17,6 @@ import {
import { MatrixError } from 'matrix-js-sdk'; import { MatrixError } from 'matrix-js-sdk';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { SettingTile } from '../../../components/setting-tile'; import { SettingTile } from '../../../components/setting-tile';
import { SequenceCard } from '../../../components/sequence-card';
import { SequenceCardStyle } from '../../room-settings/styles.css';
import { useMatrixClient } from '../../../hooks/useMatrixClient'; import { useMatrixClient } from '../../../hooks/useMatrixClient';
import { useRoom } from '../../../hooks/useRoom'; import { useRoom } from '../../../hooks/useRoom';
import { import {
@ -56,12 +54,7 @@ export function RoomPublishedAddresses({ permissions }: RoomPublishedAddressesPr
const loading = mainState.status === AsyncStatus.Loading; const loading = mainState.status === AsyncStatus.Loading;
return ( return (
<SequenceCard <Box direction="Column" gap="400">
className={SequenceCardStyle}
variant="SurfaceVariant"
direction="Column"
gap="400"
>
<SettingTile <SettingTile
title={t('RoomSettings.published_addresses')} title={t('RoomSettings.published_addresses')}
description={ description={
@ -127,7 +120,7 @@ export function RoomPublishedAddresses({ permissions }: RoomPublishedAddressesPr
</Box> </Box>
)} )}
</CutoutCard> </CutoutCard>
</SequenceCard> </Box>
); );
} }
@ -379,12 +372,7 @@ export function RoomLocalAddresses({ permissions }: { permissions: RoomPermissio
const { localAliasesState, addLocalAlias, removeLocalAlias } = useLocalAliases(room.roomId); const { localAliasesState, addLocalAlias, removeLocalAlias } = useLocalAliases(room.roomId);
return ( return (
<SequenceCard <Box direction="Column" gap="400">
className={SequenceCardStyle}
variant="SurfaceVariant"
direction="Column"
gap="400"
>
<SettingTile <SettingTile
title={t('RoomSettings.local_addresses')} title={t('RoomSettings.local_addresses')}
description={t('RoomSettings.local_addresses_desc')} description={t('RoomSettings.local_addresses_desc')}
@ -437,6 +425,6 @@ export function RoomLocalAddresses({ permissions }: { permissions: RoomPermissio
</CutoutCard> </CutoutCard>
)} )}
{expand && <LocalAddressInput addLocalAlias={addLocalAlias} />} {expand && <LocalAddressInput addLocalAlias={addLocalAlias} />}
</SequenceCard> </Box>
); );
} }

View file

@ -20,7 +20,6 @@ import { useTranslation } from 'react-i18next';
import { MatrixError, Method } from 'matrix-js-sdk'; import { MatrixError, Method } from 'matrix-js-sdk';
import { RoomTombstoneEventContent } from 'matrix-js-sdk/lib/types'; import { RoomTombstoneEventContent } from 'matrix-js-sdk/lib/types';
import { SequenceCard } from '../../../components/sequence-card'; import { SequenceCard } from '../../../components/sequence-card';
import { SequenceCardStyle } from '../../room-settings/styles.css';
import { SettingTile } from '../../../components/setting-tile'; import { SettingTile } from '../../../components/setting-tile';
import { useRoom } from '../../../hooks/useRoom'; import { useRoom } from '../../../hooks/useRoom';
import { AsyncStatus, useAsyncCallback } from '../../../hooks/useAsyncCallback'; import { AsyncStatus, useAsyncCallback } from '../../../hooks/useAsyncCallback';
@ -217,12 +216,7 @@ export function RoomUpgrade({ permissions, requestClose }: RoomUpgradeProps) {
const [prompt, setPrompt] = useState(false); const [prompt, setPrompt] = useState(false);
return ( return (
<SequenceCard <Box direction="Column" gap="400">
className={SequenceCardStyle}
variant="SurfaceVariant"
direction="Column"
gap="400"
>
<SettingTile <SettingTile
title={ title={
room.isSpaceRoom() ? t('RoomSettings.upgrade_space') : t('RoomSettings.upgrade_room') room.isSpaceRoom() ? t('RoomSettings.upgrade_space') : t('RoomSettings.upgrade_room')
@ -282,6 +276,6 @@ export function RoomUpgrade({ permissions, requestClose }: RoomUpgradeProps) {
> >
{prompt && <RoomUpgradeDialog requestClose={() => setPrompt(false)} />} {prompt && <RoomUpgradeDialog requestClose={() => setPrompt(false)} />}
</SettingTile> </SettingTile>
</SequenceCard> </Box>
); );
} }