Styling (fontWeight) not getting applied

laclance commented 1 year ago

I've been struggling with styling sometimes not getting applied but then other times it does, mostly with dynamic styling but some predefined like fontWeight as shown in the repl.

windows 11 chrome browser "@react-pdf/renderer": "^3.0.1",

https://react-pdf.org/repl?code=3187b0760ce02e00408a057025803c450298c0bc300500943807cf805032500f0022230080b61985311653150028086039860e9c6042400bc33600de0088020801659017d86768013c00d94e9d3d48800ebc009a9a461f801510460170c00cc015800d21ce27ce5fe0085d0a041191c00d9dd3d29bc2cac002440009c25c0a179b51d5c3c452854d445d9b2b9ac305160b57465ca302000e9314a5588002c31b5b440a801e98b4b8801b93ca87acaa074f4ab6beaa000991a5ada3bba4ad80644baf9040ab93ae8199959d80806c9412046c620706001954775ae5a30a06b8012317930f00d38a71dbf380066296b848308e1700018b28094800c5788c24369348e5935890cc0800168004ac15e18164d0ca1035800750c121f84d282a20046da5e30000d644f5281da0954401885c8a3e5f2d9396854da67f75292a020c9382a112b84229128981a231d55c7e309c49824a29549a6a2c089461a4859c0e6247902fe729a16a1511cc8641c7bd80506e0d16135379814c18049e0a888543a0b09d6223a80000

const Quixote = () => (
   <Document>
    <Page
      size={"A4"}
      style={{
        paddingTop: 35,
        paddingBottom: 65,
        paddingHorizontal: 35,
      }}
    >
      <Text style={styles.text}>hello</Text>;
      <Text style={styles.text2}>hello</Text>;
    </Page>
  </Document>
);

const styles = StyleSheet.create({
   text: {
    fontSize: 50,
    fontFamily: "Times-Roman",
    fontWeight: "black",
    color: "#545454",
  },
  text2: {
    fontSize: 50,
    fontFamily: "Times-Roman",
    fontWeight: "normal",
    color: "#545454",
  }
});

ReactPDF.render(<Quixote />);

jcsavage2 commented 1 year ago

I am also having this issue. Styles are not being applied. Using inline styles there are no styles being applied when the pdf is downloaded using the "PDFDownloadLink" component.

ZipBrandon commented 1 year ago

I am not seeing fontWeight be applied in my application as well. I'm just getting introduced to react-pdf and this has been the only issue I have noticed so far in this terrific package.

ejkkan commented 8 months ago

Seeing the same thing. Did anyone get around this?

bashbaugh commented 8 months ago

I'm running into weird bugs where fontWeights from unrelated parts (subtrees) of the hierarchy are overriding text further down in the document. @ejkkan Are you noticing this or is it just me?? Something definitely seems broken here

Edit: Just found this #1322 which describes my issue

jadenchant commented 4 months ago

Has anyone been able to get fontWeight to work?

diegomura / react-pdf

Styling (fontWeight) not getting applied #2107