mirror of
https://github.com/chanzuckerberg/cellxgene.git
synced 2026-10-09 05:38:12 +08:00
add bold prop
This commit is contained in:
@@ -141,7 +141,7 @@ class Category extends React.Component {
|
|||||||
<input disabled id={checkboxID} checked type="checkbox" />
|
<input disabled id={checkboxID} checked type="checkbox" />
|
||||||
<span className="bp3-control-indicator" />
|
<span className="bp3-control-indicator" />
|
||||||
</label>
|
</label>
|
||||||
<Truncate fontSize={12} size={220}>
|
<Truncate fontSize={12} size={globals.maxControlsWidth}>
|
||||||
<span
|
<span
|
||||||
style={{
|
style={{
|
||||||
cursor: "pointer",
|
cursor: "pointer",
|
||||||
@@ -191,7 +191,7 @@ class Category extends React.Component {
|
|||||||
) {
|
) {
|
||||||
return (
|
return (
|
||||||
<div style={{ marginBottom: 10, marginTop: 4 }}>
|
<div style={{ marginBottom: 10, marginTop: 4 }}>
|
||||||
<Truncate size={150} fontSize={12}>
|
<Truncate size={150} fontSize={12} bold>
|
||||||
<span style={{ fontWeight: 700 }}>{metadataField}</span>
|
<span style={{ fontWeight: 700 }}>{metadataField}</span>
|
||||||
</Truncate>
|
</Truncate>
|
||||||
<Truncate size={150} fontSize={12}>
|
<Truncate size={150} fontSize={12}>
|
||||||
|
|||||||
@@ -31,13 +31,15 @@ export default class Truncate extends Component {
|
|||||||
return this.fontIsLoaded ? "Roboto Condensed" : "Helvetica Neue";
|
return this.fontIsLoaded ? "Roboto Condensed" : "Helvetica Neue";
|
||||||
}
|
}
|
||||||
|
|
||||||
maybeTruncateString = (str, maxSize, fontSize) => {
|
maybeTruncateString = (str, maxSize, fontSize, bold, italic) => {
|
||||||
const activeFont = Truncate.getLoadedFont();
|
const activeFont = Truncate.getLoadedFont();
|
||||||
|
|
||||||
const renderedSize = pixelWidth(str, {
|
const renderedSize = pixelWidth(str, {
|
||||||
font: activeFont,
|
font: activeFont,
|
||||||
size: fontSize,
|
size: fontSize,
|
||||||
map: widthsMap,
|
map: widthsMap,
|
||||||
|
bold,
|
||||||
|
italic,
|
||||||
});
|
});
|
||||||
let truncatedString = null;
|
let truncatedString = null;
|
||||||
if (renderedSize > maxSize) {
|
if (renderedSize > maxSize) {
|
||||||
@@ -52,7 +54,7 @@ export default class Truncate extends Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { children, size, fontSize } = this.props;
|
const { children, size, fontSize, bold, italic } = this.props;
|
||||||
// Truncate only support a single child with a text child
|
// Truncate only support a single child with a text child
|
||||||
|
|
||||||
if (
|
if (
|
||||||
@@ -63,7 +65,9 @@ export default class Truncate extends Component {
|
|||||||
const truncatedString = this.maybeTruncateString(
|
const truncatedString = this.maybeTruncateString(
|
||||||
originalString,
|
originalString,
|
||||||
size,
|
size,
|
||||||
fontSize
|
fontSize,
|
||||||
|
bold,
|
||||||
|
italic
|
||||||
);
|
);
|
||||||
// Only make tooltip if string has to be truncated
|
// Only make tooltip if string has to be truncated
|
||||||
if (truncatedString) {
|
if (truncatedString) {
|
||||||
|
|||||||
Reference in New Issue
Block a user