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

Use browser's font size instead of hardcoded 16px as root font size (#12246)

Browse source 
* WIP Use browser font size instead of hardcoded 16px

* Add font migration to v3

* Remove custom font size input

* Use a dropdown instead of a slider

* Add margin to the font size dropdown

* Fix `UpdateFontSizeDelta` action typo

* Fix `fontScale`in `Call.ts`

* Rename `baseFontSizeV3` to `fontSizeDelta`

* Update playwright test

* Add `default` next to the browser font size

* Remove remaining `TODO`

* Remove falsy `private`

* Improve doc

* Update snapshots after develop merge

* Remove commented import
This commit is contained in:
Florian Duros 2024-02-21 12:23:07 +01:00 • committed by GitHub
parent 36a8d503df
commit 6d55ce0217
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
17 changed files with 453 additions and 366 deletions
Download patch file Download diff file Expand all files Collapse all files

188
test/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap
View file

@ -247,6 +247,117 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<div
class="mx_SettingsSubsection_content mx_SettingsSubsection_contentStretch"
>
<div
class="mx_Field mx_Field_select mx_FontScalingPanel_Dropdown"
>
<select
id="mx_Field_1"
label="Font size"
placeholder="Font size"
type="text"
>
<option
value="-7"
>
9
</option>
<option
value="-6"
>
10
</option>
<option
value="-5"
>
11
</option>
<option
value="-4"
>
12
</option>
<option
value="-3"
>
13
</option>
<option
value="-2"
>
14
</option>
<option
value="-1"
>
15
</option>
<option
value="0"
>
16 (default)
</option>
<option
value="1"
>
17
</option>
<option
value="2"
>
18
</option>
<option
value="4"
>
20
</option>
<option
value="6"
>
22
</option>
<option
value="8"
>
24
</option>
<option
value="10"
>
26
</option>
<option
value="12"
>
28
</option>
<option
value="14"
>
30
</option>
<option
value="16"
>
32
</option>
<option
value="18"
>
34
</option>
<option
value="20"
>
36
</option>
</select>
<label
for="mx_Field_1"
>
Font size
</label>
</div>
<div
class="mx_FontScalingPanel_preview mx_EventTilePreview_loader"
>
@ -262,83 +373,6 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
/>
</div>
</div>
<div
class="mx_FontScalingPanel_fontSlider"
>
<div
class="mx_FontScalingPanel_fontSlider_smallText"
>
Aa
</div>
<div
class="mx_Slider"
>
<input
aria-label="Font size"
autocomplete="off"
max="21"
min="11"
step="1"
type="range"
value="16"
/>
<output
class="mx_Slider_selection"
style="left: calc(2px + 50% + 1.2em - 1.2em);"
>
<span
class="mx_Slider_selection_label"
>
16
</span>
</output>
</div>
<div
class="mx_FontScalingPanel_fontSlider_largeText"
>
Aa
</div>
</div>
<span
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_QgU2PomxwK"
type="checkbox"
/>
<label
for="checkbox_QgU2PomxwK"
>
<div
class="mx_Checkbox_background"
>
<div
class="mx_Checkbox_checkmark"
/>
</div>
<div>
Use custom size
</div>
</label>
</span>
<div
class="mx_Field mx_Field_input mx_AppearanceUserSettingsTab_checkboxControlledField"
>
<input
autocomplete="off"
disabled=""
id="font_size_field"
label="Font size"
placeholder="16"
type="number"
value="16"
/>
<label
for="font_size_field"
>
Font size
</label>
</div>
</div>
</div>
<div