javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 08:09:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(dynamic-font): remove --ion-default-dynamic-font (#28966)

Browse Source 
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
This commit is contained in:
Maria Hutt
2024-02-05 14:28:58 -08:00
committed by GitHub
parent b43b9ecfe0
commit 9b25c4f456
2 changed files with 14 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
BREAKING.md
View File

@ -103,6 +103,8 @@ For more information on the new dark theme files, refer to the [Dark Mode docume
<h2 id="version-8x-global-styles">Global Styles</h2> <h2 id="version-8x-global-styles">Global Styles</h2>
<h4 id="version-8x-text-color">Text Color</h4>
The `core.css` file has been updated to set the text color on the `body` element: The `core.css` file has been updated to set the text color on the `body` element:
```diff ```diff
@ -113,6 +115,17 @@ body {
This allows components to inherit the color properly when used outside of Ionic Framework and is required for custom themes to work properly. However, it may have unintentional side effects in apps if the color was not expected to inherit. This allows components to inherit the color properly when used outside of Ionic Framework and is required for custom themes to work properly. However, it may have unintentional side effects in apps if the color was not expected to inherit.
<h4 id="version-8x-dynamic-font">Dynamic Font</h4>
The `core.css` file has been updated to enable dynamic font scaling by default.
The `--ion-default-dynamic-font` variable has been removed and replaced with `--ion-dynamic-font`.
Developers who had previously chosen dynamic font scaling by activating it in their global stylesheets can revert to the default setting by removing their custom CSS. In doing so, their application will seamlessly continue utilizing dynamic font scaling as it did before. It's essential to note that altering the font-size of the html element should be avoided, as it may disrupt the proper functioning of dynamic font scaling.
Developers who want to disable dynamic font scaling can set `--ion-dynamic-font: initial;` in their global stylesheets. However, this is not recommended because it may introduce accessibility challenges for users who depend on enlarged font sizes.
For more information on the dynamic font, refer to the [Dynamic Font Scaling documentation](https://ionicframework.com/docs/layout/dynamic-font-scaling).
<h2 id="version-8x-components">Components</h2> <h2 id="version-8x-components">Components</h2>
<h4 id="version-8x-button">Button</h4> <h4 id="version-8x-button">Button</h4>

2
core/src/css/core.scss
View File

@ -87,7 +87,7 @@ html.md {
} }
html { html {
--ion-default-dynamic-font: -apple-system-body; --ion-dynamic-font: -apple-system-body;
--ion-font-family: var(--ion-default-font); --ion-font-family: var(--ion-default-font);
} }