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

Use semantic headings in user settings Appearance (#10827)

Browse source 
* 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

* use semantic headings in User settings appearance tab

* update selectors in tests

* tidy
This commit is contained in:
Kerry 2023-05-22 09:12:11 +12:00 • committed by GitHub
parent e652177706
commit b3b03e5dcb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 765 additions and 770 deletions
Download patch file Download diff file Expand all files Collapse all files

91
res/css/views/settings/_FontScalingPanel.pcss
View file

@ -14,63 +14,48 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_FontScalingPanel {
color: $primary-content;
.mx_FontScalingPanel_preview {
--FontScalingPanel_preview-padding-block: 9px;
.mx_FontScalingPanel_preview,
.mx_FontScalingPanel_fontSlider {
margin-inline-end: var(--SettingsTab_fullWidthField-margin-inline-end);
border: 1px solid $quinary-content;
border-radius: 10px;
padding: 0 $spacing-16 var(--FontScalingPanel_preview-padding-block) $spacing-16;
pointer-events: none;
display: flow-root;
&.mx_IRCLayout {
padding-top: 9px; /* TODO: Use a spacing variable */
}
.mx_FontScalingPanel_preview {
--FontScalingPanel_preview-padding-block: 9px;
border: 1px solid $quinary-content;
border-radius: 10px;
padding: 0 $spacing-16 var(--FontScalingPanel_preview-padding-block) $spacing-16;
pointer-events: none;
display: flow-root;
&.mx_IRCLayout {
padding-top: 9px; /* TODO: Use a spacing variable */
}
.mx_EventTile[data-layout="bubble"] {
margin-top: 30px; /* TODO: Use a spacing variable */
}
.mx_EventTile_msgOption {
display: none;
}
.mx_EventTile[data-layout="bubble"] {
margin-top: 30px; /* TODO: Use a spacing variable */
}
.mx_FontScalingPanel_fontSlider {
display: flex;
align-items: center;
padding: 15px $spacing-20 35px; /* TODO: Use spacing variables */
background: rgba($quinary-content, 0.2);
border-radius: 10px;
font-size: $font-10px;
margin-top: $spacing-24;
margin-bottom: $spacing-24;
.mx_FontScalingPanel_fontSlider_smallText,
.mx_FontScalingPanel_fontSlider_largeText {
font-weight: 500;
}
.mx_FontScalingPanel_fontSlider_smallText {
font-size: $font-15px;
padding-inline-end: $spacing-20;
}
.mx_FontScalingPanel_fontSlider_largeText {
font-size: $font-18px;
padding-inline-start: $spacing-20;
}
}
.mx_FontScalingPanel_customFontSizeField {
margin-inline-start: var(--AppearanceUserSettingsTab_Field-margin-inline-start);
.mx_EventTile_msgOption {
display: none;
}
}
.mx_FontScalingPanel_fontSlider {
display: flex;
align-items: center;
padding: 15px $spacing-20 35px; /* TODO: Use spacing variables */
background: rgba($quinary-content, 0.2);
border-radius: 10px;
font-size: $font-10px;
.mx_FontScalingPanel_fontSlider_smallText,
.mx_FontScalingPanel_fontSlider_largeText {
font-weight: 500;
}
.mx_FontScalingPanel_fontSlider_smallText {
font-size: $font-15px;
padding-inline-end: $spacing-20;
}
.mx_FontScalingPanel_fontSlider_largeText {
font-size: $font-18px;
padding-inline-start: $spacing-20;
}
}