diff --git a/src/handbook/src/ui/widgets/ItemCard.tsx b/src/handbook/src/ui/widgets/ItemCard.tsx index 3f7604c64..cb951cbe6 100644 --- a/src/handbook/src/ui/widgets/ItemCard.tsx +++ b/src/handbook/src/ui/widgets/ItemCard.tsx @@ -163,7 +163,12 @@ class ItemCard extends React.Component { diff --git a/src/handbook/src/ui/widgets/MiniCard.tsx b/src/handbook/src/ui/widgets/MiniCard.tsx index 1afda7a8a..1a5f25db6 100644 --- a/src/handbook/src/ui/widgets/MiniCard.tsx +++ b/src/handbook/src/ui/widgets/MiniCard.tsx @@ -19,7 +19,7 @@ interface IState { class MiniCard extends React.Component { loading: number | any; - + containerRef: React.RefObject; textRef: React.RefObject; @@ -55,21 +55,21 @@ class MiniCard extends React.Component { private adjustFontSize() { const container = this.containerRef.current; const text = this.textRef.current; - + if (!container || !text) { return; } - + const containerWidth = container.offsetWidth; const textWidth = text.scrollWidth; - + const fontSize = parseFloat(window.getComputedStyle(text).fontSize); const availableWidth = containerWidth - 10; const scaleFactor = availableWidth / textWidth; - + if (scaleFactor < 1) { const newFontSize = fontSize * scaleFactor; - text.style.fontSize = newFontSize + 'px'; + text.style.fontSize = newFontSize + "px"; } } @@ -98,7 +98,9 @@ class MiniCard extends React.Component { )} {(!this.state.loaded || !this.state.icon) && ( -

{this.props.data.name}

+

+ {this.props.data.name} +

)}