nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Move CSS for ResetIdentityPanel into EncryptionCard (#29311)

Browse Source 
* Move CSS for ResetIdentityPanel into EncryptionCard

This allows it to be re-used in other components. It's a *bit* magic
that EncryptionCard applies style to divs within it, although it
somewhat makes sense that it wants them styled a particular way.
The alternative would be to add another component for a div child of
encryption card like EncryptionCardButtons that just makes it flexbox
and centered: I'm not sure which is better.

* Update snapshot

* Update snapshot

* Do it the other way

Because we only want it in the destructive cards, not the other ones.

* Use flex component

* Also use gap prop and update snapshots

* Fix justification

* Snaspshots again

* Set align-items to normal

As center affected the list items too. Also add it to the flex
component because it didn't have it as an option.
This commit is contained in:
David Baker
2025-02-20 13:20:49 +00:00
committed by GitHub
parent e161f9fb18
commit e8954f08ce
8 changed files with 54 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
res/css/_components.pcss
View File

@@ -360,8 +360,8 @@
@import "./views/settings/encryption/_AdvancedPanel.pcss";
@import "./views/settings/encryption/_ChangeRecoveryKey.pcss";
@import "./views/settings/encryption/_EncryptionCard.pcss";
@import "./views/settings/encryption/_EncryptionCardEmphasisedContent.pcss";
@import "./views/settings/encryption/_RecoveryPanelOutOfSync.pcss";
@import "./views/settings/encryption/_ResetIdentityPanel.pcss";
@import "./views/settings/tabs/_SettingsBanner.pcss";
@import "./views/settings/tabs/_SettingsIndent.pcss";
@import "./views/settings/tabs/_SettingsSection.pcss";

13
res/css/views/settings/encryption/_EncryptionCardEmphasisedContent.pcss Normal file
View File

@@ -0,0 +1,13 @@
/*
* 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_EncryptionCard_emphasisedContent {
span {
font: var(--cpd-font-body-md-medium);
text-align: center;
}
}

19
res/css/views/settings/encryption/_ResetIdentityPanel.pcss
View File

@@ -1,19 +0,0 @@
/*
* 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_ResetIdentityPanel {
.mx_ResetIdentityPanel_content {
display: flex;
flex-direction: column;
gap: var(--cpd-space-3x);
> span {
font: var(--cpd-font-body-md-medium);
text-align: center;
}
}
}