Use semantic heading in user settings Sidebar & Voip (#10782)

* split SettingsSection out of SettingsTab, replace usage

* correct copyright

* use semantic headings in GeneralRoomSettingsTab

* use SettingsTab and SettingsSubsection in room settings

* fix VoipRoomSettingsTab

* use SettingsSection components in space settings

* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* use ExternalLink components for external links

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* use new settings components in eventindexpanel

* findByTestId

* prettier

* semantic headings and style refresh for crypto settings

* e2e panel

* semantic headings and cleanup in Sidebar user settings

* semantic heading in voice user settings

* sonarcloud bug and test
This commit is contained in:
Kerry
2023-05-19 00:03:39 +00:00
committed by GitHub
parent d9a61c093c
commit 55336bf932
12 changed files with 442 additions and 185 deletions
@@ -14,67 +14,25 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_SidebarUserSettingsTab {
.mx_Checkbox {
margin-top: 12px;
font-size: $font-15px;
line-height: $font-24px;
color: $secondary-content;
}
.mx_SidebarUserSettingsTab_homeAllRoomsCheckbox {
margin-left: 24px;
.mx_SidebarUserSettingsTab_checkboxMicrocopy {
margin-bottom: 12px;
margin-left: 24px;
font-size: $font-15px;
line-height: $font-24px;
color: $secondary-content;
& + div {
margin-left: 48px;
}
}
.mx_SidebarUserSettingsTab_homeAllRoomsCheckbox {
margin-left: 24px;
& + div {
margin-left: 48px;
}
}
.mx_SidebarUserSettingsTab_homeCheckbox,
.mx_SidebarUserSettingsTab_favouritesCheckbox,
.mx_SidebarUserSettingsTab_peopleCheckbox,
.mx_SidebarUserSettingsTab_orphansCheckbox {
.mx_Checkbox_background + div {
padding-left: 20px;
position: relative;
&::before {
background-color: $secondary-content;
content: "";
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
width: 16px;
height: 16px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
}
}
.mx_SidebarUserSettingsTab_homeCheckbox .mx_Checkbox_background + div::before {
mask-image: url("$(res)/img/element-icons/home.svg");
}
.mx_SidebarUserSettingsTab_favouritesCheckbox .mx_Checkbox_background + div::before {
mask-image: url("$(res)/img/element-icons/roomlist/favorite.svg");
}
.mx_SidebarUserSettingsTab_peopleCheckbox .mx_Checkbox_background + div::before {
mask-image: url("$(res)/img/element-icons/room/members.svg");
.mx_SidebarUserSettingsTab_checkbox {
margin-bottom: $spacing-8;
// override checkbox styles˚
label {
align-items: flex-start !important;
}
.mx_SidebarUserSettingsTab_orphansCheckbox .mx_Checkbox_background + div::before {
mask-image: url("$(res)/img/element-icons/roomlist/hash-circle.svg");
svg {
height: 16px;
width: 16px;
margin-right: $spacing-8;
margin-bottom: -1px;
}
}