Copy css to its own file

This commit is contained in:
David Baker
2025-02-07 10:22:12 +01:00
parent f818d6e600
commit fc9bc0903c
3 changed files with 32 additions and 5 deletions

View File

@@ -358,6 +358,7 @@
@import "./views/settings/_UserProfileSettings.pcss";
@import "./views/settings/encryption/_AdvancedPanel.pcss";
@import "./views/settings/encryption/_ChangeRecoveryKey.pcss";
@import "./views/settings/encryption/_DeleteKeyStoragePanel.pcss";
@import "./views/settings/encryption/_EncryptionCard.pcss";
@import "./views/settings/encryption/_RecoveryPanelOutOfSync.pcss";
@import "./views/settings/encryption/_ResetIdentityPanel.pcss";

View File

@@ -0,0 +1,26 @@
/*
* Copyright 2024 New Vector Ltd.
*
* SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
* Please see LICENSE files in the repository root for full details.
*/
.mx_DeleteKeyStoragePanel {
.mx_DeleteKeyStoragePanel_content {
display: flex;
flex-direction: column;
gap: var(--cpd-space-3x);
> span {
font: var(--cpd-font-body-md-medium);
text-align: center;
}
}
.mx_DeleteKeyStoragePanel_footer {
display: flex;
flex-direction: column;
gap: var(--cpd-space-4x);
justify-content: center;
}
}

View File

@@ -15,14 +15,14 @@ import { EncryptionCard } from "./EncryptionCard";
import { useKeyStoragePanelViewModel } from "../../../viewmodels/settings/encryption/KeyStoragePanelViewModel";
import SdkConfig from "../../../../SdkConfig";
interface ResetIdentityPanelProps {
interface Props {
onFinish: () => void;
}
/**
* Confirms that the user really wants to turn off and delete their key storage
*/
export function DeleteKeyStoragePanel({ onFinish }: ResetIdentityPanelProps): JSX.Element {
export function DeleteKeyStoragePanel({ onFinish }: Props): JSX.Element {
const { setEnabled } = useKeyStoragePanelViewModel();
const [busy, setBusy] = useState(false);
@@ -48,9 +48,9 @@ export function DeleteKeyStoragePanel({ onFinish }: ResetIdentityPanelProps): JS
Icon={ErrorIcon}
destructive={true}
title={_t("settings|encryption|delete_key_storage|title")}
className="mx_ResetIdentityPanel"
className="mx_DeleteKeyStoragePanel"
>
<div className="mx_ResetIdentityPanel_content">
<div className="mx_DeleteKeyStoragePanel_content">
{_t("settings|encryption|delete_key_storage|description")}
<VisualList>
<VisualListItem Icon={CrossIcon} destructive={true}>
@@ -61,7 +61,7 @@ export function DeleteKeyStoragePanel({ onFinish }: ResetIdentityPanelProps): JS
</VisualListItem>
</VisualList>
</div>
<div className="mx_ResetIdentityPanel_footer">
<div className="mx_DeleteKeyStoragePanel_footer">
<Button destructive={true} onClick={onDeleteClick} disabled={busy}>
{_t("settings|encryption|delete_key_storage|confirm")}
</Button>