Removing SVG icon in thead of hazardstatements in PDF

[Sergio_7]

Dear Oxygen team,
I would like to hide the little svg icon that always appears in the header of a hazard statement. I can use all css codes (see below), which works fine for HTML but not for PDF. Could you please give me a hint on how to hide this icon for pdf output?

I have tried almost everything but it remained untouched. All these codes work for html, but not for pdf:

Code: Select all

.hazardstatement th svg {
    display:none;
}

OR

Code: Select all

.hazardstatement thead tr th svg {
    display:none;
}

OR

Code: Select all

.hazardstatement thead svg:first-of-type {
    display:none;
}

Thank you in advance!
Best regards!

svg-icon-in-th.PNG (4.48 KiB) Viewed 225 times

[julien_lacour]

Hello,

If you followed our user guide topic you should just remove/comment the following property:

Code: Select all

/* Show logo in the header. */
*[othertype ~= "HIGH_VOLTAGE"] .hazardstatement--other::before {
  padding: .5rem;
  /*content: url("electricity_icon.svg");*/
}

Regards,
Julien

[Sergio_7]

Hi Julien,
Thank you for your reply. I don't use customized symbols, I just want to remove the standard symbols that are always generated with types like “Warning”, “Caution” etc. All my efforts were unsuccessful with these attempts:

Code: Select all

.hazardstatement--warning::before {
  display: none;
  content: none;
}

Code: Select all

.hazardstatement_warning td:first-of-type {
  display: none;
  content: none;
}

Code: Select all

.hazardstatement td:first-of-type {
  display: none;
  content: none;
}

Code: Select all

.hazardstatement th:first-of-type {
  display: none;
  content: none;
}

Code: Select all

*[type ~= "warning"] .hazardsymbol {
    display: none;
    content: none;
}

Thanks!

svg-icon-in-th.PNG (4.48 KiB) Viewed 228 times

[xephon]

Sergio, there is a section named “ How to Remove the Hazard Symbol” in the linked topic.

[Sergio_7]

svg-icon-in-th.PNG (4.48 KiB) Viewed 209 times

Hi,
thanks for your reply. I have read the section and it is not working on my site.
Please check if this CSS code works correctly for PDF to remove the small icon in the header of the warning before the “Warning” hazard statement:

Code: Select all

.hazardstatement_warning .hazardstatement--logo-col {
  display: none;
}
.hazardstatement_warning th {
  table-column-span: 1
}
.hazardstatement_warning td:first-of-type {
  display: none;
}

Thanks!

[julien_lacour]

Hello,

Currently this is only possible using an XSLT Extension Point:

1. Create an XSLT stylesheet with the following content:

   Code: Select all

   <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
     xmlns:xs="http://www.w3.org/2001/XMLSchema"
     xmlns:svg="http://www.w3.org/2000/svg"
     exclude-result-prefixes="xs svg"
     version="3.0">
     
     <xsl:template match="tr[1]" mode="hazard-table">
       <colgroup>
         <col class="hazardstatement--logo-col"/>
         <col class="hazardstatement--msg-col"/>
       </colgroup>
       <thead>
         <xsl:copy>
           <xsl:copy-of select="@*"/>
           <xsl:apply-templates mode="#current"/>
         </xsl:copy>
       </thead>
     </xsl:template>
   
     <xsl:template match="svg:svg" mode="hazard-table">
       <span class="hazardsymbol-container">
         <xsl:copy-of select="."/>
       </span>
     </xsl:template>
     
   </xsl:stylesheet>
   

2. Declare the stylesheet as merged2html5 extension:

   Code: Select all

   <xslt>
     <extension file="custom.xsl" id="com.oxygenxml.pdf.css.xsl.merged2html5"/>
   </xslt>
   

3. Hide the logo with the following CSS rule:

   Code: Select all

   .hazardsymbol-container {
     display: none;
   }
   

If you never did such customization you can check the following topics in our user-guide:

• How to Create a Publishing Template
• XSLT Extensions for PDF Transformations

Regards,
Julien

[julien_lacour]

Hello,

I added an improvement so that in Oxygen 27.1 you will just need to set the CSS, the symbol will be wrapped by default in the output.
I will notify this thread once the improvement will be available, if you do the update you will be able to remove the XSLT stylesheet from your publishing template and only keep the CSS.

Regards,
Julien