imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use semantic headings in user settings - Notifications (#10948)

Browse source 
* use semantic headings in user notif settings

* unset margin for subsection content when no heading

* remove debug
This commit is contained in:
Kerry 2023-05-24 11:36:09 +12:00 • committed by GitHub
parent f491f2f951
commit 9211da20f4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 81 additions and 85 deletions
Download patch file Download diff file Expand all files Collapse all files

4
res/css/components/views/settings/shared/_SettingsSubsection.pcss
View file

@ -52,4 +52,8 @@ limitations under the License.
&.mx_SettingsSubsection_contentStretch {
justify-items: stretch;
}
&.mx_SettingsSubsection_noHeading {
margin-top: 0;
}
}

56
res/css/views/settings/_Notifications.pcss
View file

@ -20,7 +20,6 @@ limitations under the License.
grid-template-columns: auto repeat(3, 62px);
place-items: center center;
grid-gap: 8px;
margin-top: $spacing-40;
/* Override StyledRadioButton default styles */
.mx_StyledRadioButton {
@ -34,6 +33,11 @@ limitations under the License.
display: none;
}
}
// left align section heading
.mx_SettingsSubsectionHeading {
justify-self: start;
}
}
.mx_UserNotifSettings_gridRowContainer {
@ -51,10 +55,6 @@ limitations under the License.
/* force it inline using float */
float: left;
}
.mx_UserNotifSettings_gridRowHeading {
font-size: $font-18px;
font-weight: var(--font-semi-bold);
}
.mx_UserNotifSettings_gridColumnLabel {
color: $secondary-content;
@ -70,39 +70,35 @@ limitations under the License.
margin-top: -$spacing-4;
}
.mx_UserNotifSettings {
color: $primary-content; /* override from default settings page styles */
.mx_UserNotifSettings_floatingSection {
margin-top: 40px;
.mx_UserNotifSettings_floatingSection {
margin-top: 40px;
& > div:first-child {
/* section header */
font-size: $font-18px;
font-weight: var(--font-semi-bold);
}
> table {
border-collapse: collapse;
border-spacing: 0;
margin-top: 8px;
tr > td:first-child {
/* Just for a bit of spacing */
padding-right: 8px;
}
}
& > div:first-child {
/* section header */
font-size: $font-18px;
font-weight: var(--font-semi-bold);
}
.mx_UserNotifSettings_clearNotifsButton {
> table {
border-collapse: collapse;
border-spacing: 0;
margin-top: 8px;
}
.mx_TagComposer {
margin-top: 35px; /* lots of distance from the last line of the table */
tr > td:first-child {
/* Just for a bit of spacing */
padding-right: 8px;
}
}
}
.mx_UserNotifSettings_clearNotifsButton {
margin-top: 8px;
}
.mx_TagComposer {
margin-top: 35px; /* lots of distance from the last line of the table */
}
.mx_AccessibleButton.mx_NotificationSound_browse {
margin-right: 10px;
}