Cannot multiple text styling
Opened this issue · 0 comments
fahmidyt commented
Hey.. I am trying to styling Text using
font-weight: bold; font-style: italic;
and the problem has showed up. The text only read one of that css style.
This is my code:
export const BI = style.Text`
font-weight: bold;
font-style: italic;
`;
export const Row = style.View`
display: flex;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: ${props => {
return props.mb ? props.mb : "4px";
}}
`;
export const Container = style.View`
margin: 16.56px 36.72px 0px 39.6px;
font-family: 'Roboto';
background-color: #fff;
font-size: 10px;
`;
export const Col = style.View`
width: ${props => {
return props.width ? props.width : "auto";
}}
`;
const Report = ({data}) => (
<Document>
<Page size="A4">
<Container>
<Row>
<Col>
<BI>This is some text.</BI>
</Col>
</Row>
</Container>
</Page>
</Document>
);