Use semantic headings in user settings Keyboard (#10793)

* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* findByTestId

* prettier

* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* use semantic headings in usersettingspreferences

* rethemendex

* put back margin var
This commit is contained in:
Kerry 2023-05-17 14:34:55 +12:00 committed by GitHub
parent 38ae8e98e4
commit 68b1930852
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 1117 additions and 1050 deletions

View file

@ -15,31 +15,26 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_KeyboardUserSettingsTab .mx_SettingsTab_section {
ul {
margin: 0;
padding: 0;
}
.mx_KeyboardShortcut_shortcutRow,
.mx_KeyboardShortcut {
display: flex;
justify-content: space-between;
align-items: center;
}
.mx_KeyboardShortcut_shortcutRow {
column-gap: $spacing-8;
margin-bottom: $spacing-4;
/* TODO: Use flexbox */
&:last-of-type {
margin-bottom: 0;
}
.mx_KeyboardShortcut {
flex-wrap: nowrap;
column-gap: 5px; /* TODO: Use a spacing variable */
}
}
.mx_KeyboardShortcut_shortcutList {
margin: 0;
padding: 0;
width: 100%;
display: grid;
grid-gap: $spacing-4;
}
.mx_KeyboardShortcut_shortcutRow,
.mx_KeyboardShortcut {
display: flex;
justify-content: space-between;
align-items: center;
}
.mx_KeyboardShortcut_shortcutRow {
column-gap: $spacing-8;
}
.mx_KeyboardShortcut {
flex-wrap: nowrap;
column-gap: $spacing-4;
}