element-web-Github/res/css/components/views/settings/_AddRemoveThreepids.pcss
David Baker 4751c52d82
Refactor the various email/phone management UI into a single component (#12884)
* Refactor the various email/phone management UI into a single component

These were basically the same component copied & pasted 3 times and
tweaked to match the behaviour of each case. This de-dupes them into
one component.

This all could really benefit from playwright tests, but would require
setting up a dummy ID server in the playwright tests. This is all legacy
pre-MAS stuff so its questionable whether its worth the effort.

* Basic test, remove old tests

* Use different text to confirm remove & put headers back

although the two texts are both 'Remove' in practice

* Remove string

This was never triggered anyway with sydent & synapse because they
don't seem to agree on what error to return. In any case, I think it
makes more sense for it to be consistent with the email path, ie. using
a dialog.

* Avoid nested forms

* Snapshots

* More snapshots

* Test the hs side

* Snapshots

* Test IS bind/revoke

* Test remove can be cancelled

* Test unvalidated cases & fix phone error

* Reset state between tests

* Import useState directly

* One more direct React import
2024-08-14 13:13:57 +00:00

50 lines
1.3 KiB
Plaintext

/*
Copyright 2019 New Vector Ltd
Copyright 2024 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/*
* These used to live in General User Settings. These components are horribly duplicative
* but share the same styles. For now I'm putting them here so I can renamed the general
* tab sensibly and before I can refactor these components.
*/
.mx_AddRemoveThreepids_existing {
display: flex;
align-items: center;
}
.mx_AddRemoveThreepids_existing_address,
.mx_AddRemoveThreepids_existing_promptText {
flex: 1;
margin-right: 10px;
}
.mx_AddRemoveThreepids_existing_button {
margin-left: 5px;
}
.mx_EmailAddressesPhoneNumbers_verify {
display: flex;
}
.mx_EmailAddressesPhoneNumbers_existing_button {
justify-content: right;
}
.mx_EmailAddressesPhoneNumbers_verify_instructions {
flex: 1;
}