All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.
5.1.6 (2023-12-11)
Note: Version bump only for package @react-md/typography
5.1.3 (2022-05-07)
- fix typos throughout codebase (725d1a2)
- typos: fix additional typos throughout repo (ef20132)
5.1.2 (2022-04-02)
Note: Version bump only for package @react-md/typography
5.1.0 (2022-03-18)
- run lint-scripts --fix for consistent-type-imports (42d839d)
5.0.0 (2022-01-31)
- @react-md/typography: Fixed overline class name (1e544d0)
4.0.3 (2021-12-31)
4.0.1 (2021-11-27)
- Updated imports to use
import type
when possible (ba96bb6)
4.0.0 (2021-11-24)
- sass: Do not use legacy global functions (6159e16)
- Update to use new JSX Transform and latest
eslint
(8111cd3) - @react-md/typography: Renamed Text to
Typography
(30cf056)
- always skip lib check (229cef1)
- @react-md/format: ran
prettier
after upgrading to v2.4.0 (06110af) - react-md: Remove prop-types package and usage (2637a6f)
- stylelint: Updated to use
stylelint
(22d1598)
- Minimum React version is now 16.14 instead of 16.8
- @react-md/typography: The Text component has been renamed to Typography to
help with auto-imports conflicting with the Text element that exists in
lib.d.ts
- react-md: There will no longer be run-time prop validation with
the
prop-types
package.
3.1.0 (2021-09-10)
- react-md.dev: updated
sassdoc
for new module system (4746d26)
- ran
yarn format
to include new files (48d3d7f)
3.0.0 (2021-08-13)
- sass: use math.div instead of division since it's deprecated (d8c3f12)
- Added additional tests to bump test coverage (4d0371c)
- @react-md/dev-utils: updated
sassdoc
and variables to use everything.scss (a0f0699) - @react-md/dev-utils: updated variables command to work with
sass
(5376be1)
2.9.1 (2021-07-27)
- install: slighly reduce install size by excluding tests in publish (9d01a44)
2.9.0 (2021-07-18)
Note: Version bump only for package @react-md/typography
2.8.4 (2021-06-10)
Note: Version bump only for package @react-md/typography
2.8.3 (2021-05-18)
- @react-md/typography: Added examples for overriding typography styles (57033bd), closes #1147
- react-md.dev: updated tsdoc to work with
typedoc
(cf54c35)
2.8.2 (2021-04-23)
Note: Version bump only for package @react-md/typography
2.8.0 (2021-04-22)
- tsconfig: separate tsconfig by package instead of a single root (b278230)
2.7.1 (2021-03-23)
Note: Version bump only for package @react-md/typography
2.7.0 (2021-02-28)
- tsdoc: fixed remaining tsdoc syntax warnings (946f4dd)
- updated test coverage to not include conditional component PropTypes (24e5df1)
2.6.0 (2021-02-13)
Note: Version bump only for package @react-md/typography
2.5.5 (2021-01-30)
Note: Version bump only for package @react-md/typography
2.5.4 (2021-01-27)
Note: Version bump only for package @react-md/typography
2.5.0 (2020-12-15)
Note: Version bump only for package @react-md/typography
2.4.2 (2020-10-23)
Note: Version bump only for package @react-md/typography
2.4.1 (2020-10-17)
Note: Version bump only for package @react-md/typography
2.4.0 (2020-10-17)
- @react-md/theme: Better Contrast Colors by Default and dev-utils refactor (#955) (519b128)
2.3.1 (2020-09-15)
Note: Version bump only for package @react-md/typography
2.3.0 (2020-09-10)
Note: Version bump only for package @react-md/typography
2.2.2 (2020-09-02)
Note: Version bump only for package @react-md/typography
2.2.1 (2020-09-02)
Note: Version bump only for package @react-md/typography
2.1.2 (2020-08-01)
Note: Version bump only for package @react-md/typography
2.1.1 (2020-07-21)
Note: Version bump only for package @react-md/typography
2.1.0 (2020-07-12)
Note: Version bump only for package @react-md/typography
2.0.2 (2020-06-30)
- LICENSE: Removed the time range from license since it was incorrect (50c9021)
- Added
sideEffects
field topackage.json
(31820b9) sideEffects
formatting (78a7b6b)
No changes.
The typography package is kind of new for the v2 release since there weren't any
components beforehand for typography. This package exports three components:
Text
, TextContainer
, and SrOnly
. The Text
component can be used to
render any of the typography styles. The TextContainer
component is used to
create a centered block of text that uses the recommended line-width for
legibility on different device sizes. Finally, the SrOnly
component allows for
text to only be visible to screen readers.
In addition, the naming for the different typography styles have been renamed for the updated Material Design guidelines for typography.
All the default typography styles can be configured by declaring global variables that will be merged with the recommended values:
$rmd-typography-headline-1
$rmd-typography-headline-2
$rmd-typography-headline-3
$rmd-typography-headline-4
$rmd-typography-headline-5
$rmd-typography-headline-6
$rmd-typography-subtitle-1
$rmd-typography-subtitle-2
$rmd-typography-body-1
$rmd-typography-body-2
$rmd-typography-button
$rmd-typography-caption
$rmd-typography-overline
- typography will never modify the default tags by default
- all typography styles are configurable in a SCSS Map
- persistent typography across all device sizes
- switched from
px
torem
andem
for typography - removed the default
transition-timing-function
that was applied to all elements and pseudo elements - removed the default
min-width
andfont-size
on thehtml
- added a simpler "css reset" for the
html
andbody
that is in the @react-md/utils package now
- removed the
react-md-typography-utilities
mixin - removed all the SCSS placeholders
- every SCSS variable, function, and mixin has been renamed or removed
$rmd-typography-text-container-breakpoint: 37.5rem !default
- breakpoint to use for switching the typography max line-length from mobile to desktop$rmd-typography-font-weights
- a map of all the available font weights which can be overridden$rmd-typography-default-font-weights: light regular medium bold !default
all the default available font weights$rmd-typography-thin: 100 default
- the thin font weight value$rmd-typography-black: 900 !default
- the darkest font weight value@function rmd-typography-theme
- gets one of the theme values and validates that the theme name is valid@function rmd-typography-theme-var
- gets one of the theme values as a css variable with a fallback value and validates that the theme name is valid@function rmd-typography-value
- most likely mostly internal, but allows you to get one of the typography values based on the type@mixin rmd-typography-theme
- applies one of the theme values to a css property as a css variable@mixin rmd-typography-theme-update-var
- updates one of the theme values as a css variable@mixin rmd-typography-value
- applies the specifified typography type to an element with an optional list of properties to use@mixin rmd-typography-base
- applies the base typography to an element@mixin rmd-typography
- the inverse ofrmd-typography-value
that will default to apply all styles to an element@mixin rmd-text-container-base
- the default styles for creating a text container@mixin rmd-text-container-auto
- generally used with thermd-text-container-base
mixin to automatically update the max line-width based on media size@mixin rmd-text-overflow-ellispis
- updates a class name or selector so that long text will be overflown with an ellipsis
$md-font-family
was renamed to$rmd-typography-font-family
but keeps the same default value ofRoboto, sans-serif
$md-typography-max-line-length
was renamed and split into$rmd-typography-mobile-max-line-length
and$rmd-typography-desktop-max-line-length
with defaults of17em
and40em
respectively$md-font-light
was renamed to$rmd-typography-light
$md-font-regular
was renamed to$rmd-typography-regular
$md-font-medium
was renamed to$rmd-typography-medium
$md-font-bold
was renamed to$rmd-typography-bold
$md-font-semibold
was renamed to$rmd-typography-semi-bold
and changed the default value from600
to800
host-google-font
was renamed tormd-typography-host-google-font
host-material-icons
was renamed tormd-icon-host-google-icons
but is now part of the @react-md/icon package
- removed
$md-typography-extended
since global namespace is no longer touched - removed
$md-typography-include-text-container
since it is always created now for theTextContainer
component - removed
$md-typography-include-utilities
since there are no longer any utilities - removed the
$md-font-name
variable - removed the
$md-html-min-width
variable - removed all the old typography variables for the new naming conventions:
$md-display-4-font-size
$md-display-4-line-height
$md-display-3-font-size
$md-display-3-line-height
$md-display-2-font-size
$md-display-2-line-height
$md-display-1-font-size
$md-display-1-line-height
$md-headline-font-size
$md-headline-line-height
$md-title-font-size
$md-title-line-height
$md-subheading-mobile-font-size
$md-subheading-desktop-font-size:
$md-subheading-2-line-height
$md-subheading-1-line-height
$md-body-mobile-font-size
$md-body-desktop-font-size
$md-body-2-line-height
$md-body-1-line-height
$md-caption-font-size
- removed
$md-font-size-base
and$md-line-height
variables - removed the
react-md-typography-mobile
,react-md-typography-desktop
, andreact-md-typography-media
mixins since the typography no longer changes based on device size - removed the
react-md-theme-typography
mixin