From 708920b5927da458355c2f0ad8aa1a2ebe923b6d Mon Sep 17 00:00:00 2001 From: Chris Holt Date: Thu, 19 Nov 2020 15:28:11 -0800 Subject: [PATCH 1/2] ensure all web components leverage the body font design token --- packages/web-components/src/menu-item/menu-item.styles.ts | 1 + packages/web-components/src/slider-label/slider-label.styles.ts | 1 + packages/web-components/src/text-field/text-field.styles.ts | 1 + 3 files changed, 3 insertions(+) diff --git a/packages/web-components/src/menu-item/menu-item.styles.ts b/packages/web-components/src/menu-item/menu-item.styles.ts index 183f5caf60b5a..75a6be3ad80f6 100644 --- a/packages/web-components/src/menu-item/menu-item.styles.ts +++ b/packages/web-components/src/menu-item/menu-item.styles.ts @@ -26,6 +26,7 @@ export const MenuItemStyles = css` color: ${neutralForegroundRestBehavior.var}; fill: ${neutralForegroundRestBehavior.var}; cursor: pointer; + font-family: var(--body-font); font-size: var(--type-ramp-base-font-size); line-height: var(--type-ramp-base-line-height); border-radius: calc(var(--corner-radius) * 1px); diff --git a/packages/web-components/src/slider-label/slider-label.styles.ts b/packages/web-components/src/slider-label/slider-label.styles.ts index ccee13f423933..e7dbb5cf6270e 100644 --- a/packages/web-components/src/slider-label/slider-label.styles.ts +++ b/packages/web-components/src/slider-label/slider-label.styles.ts @@ -5,6 +5,7 @@ import { heightNumber, neutralOutlineRestBehavior } from '../styles'; export const SliderLabelStyles = css` ${display('block')} :host { + font-family: var(--body-font); } .root { position: absolute; diff --git a/packages/web-components/src/text-field/text-field.styles.ts b/packages/web-components/src/text-field/text-field.styles.ts index 134aeeebffc58..5d8d37f4faf52 100644 --- a/packages/web-components/src/text-field/text-field.styles.ts +++ b/packages/web-components/src/text-field/text-field.styles.ts @@ -43,6 +43,7 @@ export const TextFieldStyles = css` border: none; padding: 0 calc(var(--design-unit) * 2px + 1px); color: ${neutralForegroundRestBehavior.var}; + font-family: inherit; font-size: var(--type-ramp-base-font-size); line-height: var(--type-ramp-base-line-height); } From 9541c0aca3aef9b9b9814f1fe362c68daf0db97d Mon Sep 17 00:00:00 2001 From: Chris Holt Date: Thu, 19 Nov 2020 15:28:31 -0800 Subject: [PATCH 2/2] Change files --- ...hhol-ensure-all-components-leverage-body-font-var.json | 8 ++++++++ 1 file changed, 8 insertions(+) create mode 100644 change/@fluentui-web-components-2020-11-19-15-28-31-users-chhol-ensure-all-components-leverage-body-font-var.json diff --git a/change/@fluentui-web-components-2020-11-19-15-28-31-users-chhol-ensure-all-components-leverage-body-font-var.json b/change/@fluentui-web-components-2020-11-19-15-28-31-users-chhol-ensure-all-components-leverage-body-font-var.json new file mode 100644 index 0000000000000..995a01dd256a9 --- /dev/null +++ b/change/@fluentui-web-components-2020-11-19-15-28-31-users-chhol-ensure-all-components-leverage-body-font-var.json @@ -0,0 +1,8 @@ +{ + "type": "patch", + "comment": "ensure all web components leverage the body font design token", + "packageName": "@fluentui/web-components", + "email": "chhol@microsoft.com", + "dependentChangeType": "patch", + "date": "2020-11-19T23:28:31.598Z" +}