fix: [text] block breaks the style attribute (microsoft#27129)

* fix: [text] block breaks the style attribute * chnage files * addresed comments * Update packages/web-components/src/text/text.styles.ts Co-authored-by: Chris Holt <chhol@microsoft.com> * addressed pr comments --------- Co-authored-by: Chris Holt <chhol@microsoft.com>
radium-v · Apr 30, 2024 · 958d608 · 958d608
1 parent 0d5e91c
commit 958d608
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/change/@fluentui-web-components-91a1543a-10b0-4b10-9d32-0535f7a8e631.json b/change/@fluentui-web-components-91a1543a-10b0-4b10-9d32-0535f7a8e631.json
@@ -0,0 +1,7 @@
+{
+ "type": "prerelease",
+ "comment": "fix: [text] block breaks the style attribute",
+ "packageName": "@fluentui/web-components",
+ "email": "jes@microsoft.com",
+ "dependentChangeType": "patch"
+}
diff --git a/packages/web-components/src/text/text.styles.ts b/packages/web-components/src/text/text.styles.ts
@@ -42,19 +42,21 @@ export const styles = css`
  line-height: ${lineHeightBase300};
  font-weight: ${fontWeightRegular};
  text-align: start;
- display: inline;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  margin: 0;
+ display: inline;
  }
+
  :host([nowrap]) ::slotted(*) {
  white-space: nowrap;
  overflow: hidden;
  }
  :host([truncate]) ::slotted(*) {
  text-overflow: ellipsis;
  }
+ :host([block]),
  :host([block]) ::slotted(*) {
  display: block;
  }