Making Purchase Ref Font Size bigger + Bold

If I use the following in Global CSS it successfully changes the Purchase Ref Font Size and font to Bold, however when I print and generate the PDF the formatting is lost. Please advise how to rectify this. Thank you.

Global CSS

/* Screen */
tr:nth-child(3) td.invoice-details-right-td.invoice-text {
font-size: 22px !important;
font-weight: bold !important;
}

/* Print/PDF */
@media print {
.td-invoice-text:nth-of-type(2) {
font-size: 22px !important;
font-weight: bold !important;
}
}

As far as I understand it the “Global CSS” only applies to the web UI while you’re browsing it. If you want to customise the CSS of invoices then you do it via the invoice style gallery, the “customise this style” button, and then edit the invoice CSS there.

You shouldn’t need separate screen and print rules, just one rule for

tr.tr-invoice-details-prefno td.invoice-details-right-td.invoice-text {
  font-size: 22px;
  font-weight: bold;
}

should be sufficient for both. You shouldn’t even need the !important as this rule will be higher specificity than the general rule. If you need it to be more specific still then

#lblinvoiceLabels tr.tr-invoice-details-prefno td.invoice-details-right-td.invoice-text {
  font-size: 22px;
  font-weight: bold;
}

should be specific enough to override everything.

Hi Ian

This works for the Invoice(screen + Print), but unfortunately when I view and print a Delivery Note this formatting reverts back to original?

Cheers

Chris

I think I have solved it,

Step by step for anyone not familiar with process,

Creating or editing your Delivery.

Sale:View - Select Invoice style gallery

Create or edit a custom template for your delivery note - e.g. My_Ltd_Company_Del_Note

Customise this style

Insert at the end,

tr.tr-invoice-details-prefno td.invoice-details-right-td.invoice-text {
font-size: 22px;
font-weight: bold;
color: #00ff00;
}

This defines the purchase ref values font size. style and colour

Save changes

Important bit, after editing reselect the style you want for your sales invoice (not the recently edited delivery note)

Sale:View - Select Invoice style gallery

Select your sales invoice template - e.g. My_Ltd_Company_Sales_Invoice

Make the System use your Delivery Note

Additional important bit,

Account Settings:Advanced settings(don’t click the Accounts settings, Advanced setting is in the drop down menu)

under User Interface tab,

Delivery note CSS path,

custom/My_Ltd_Company_Del_Note.css