style(settings): flatten the addresses and advanced blocks so the whole General page reads as one flat list
This commit is contained in:
parent
d985b289c9
commit
fd6115cf85
2 changed files with 6 additions and 24 deletions
|
|
@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue