Confluence PDF Export Stylesheet (several) Questions

Matthias Dannhorn

Hello, I'm currently adapting the stylesheet of the PDF export. Now four questions have opened up.

 

1. heading size

• I want to adjust the size of the H4

2. text wrap

• there should be no break in the word

3. inline task padding

• the padding between checkbox and table should be adjusted

4. cell color

• I want to export the highlight colors of the table

 

Confluence site

PDF Export (table only)

Current stylesheet:

.pagetitle h1 { 
font-size: 22px !important;
margin-left: 0px !important;
padding-top: 180px !important;
page-break-after: always; 
background-image: url('/download/attachments/126943996/RGB_Schwarz-Blau_300_200.png?api=v2'); 
background-repeat: no-repeat; 
background-position: 0px 100px; /* distance from left and top */ 
}

@page {
size: 297mm 210mm;

.pagetitle
{
page-break-before: always;
}

@bottom-left {
 content: "© XXX"; 
 font-family: Arial, sans-serif;
 font-size: 8pt;
 }
@bottom-right {
 content: "Page " counter(page) " of " counter(pages);
 font-family: Arial, sans-serif;
 font-size: 8pt;
 }
 /* Generate border between footer and page content */
 border-bottom: 1px solid black;
 border-top: 1px solid black;
 }


 /*TABLE*/
table {
 border-collapse: collapse;
 border: 1px solid #DDDDDD;
 margin-bottom: 1em;
 table-layout:auto !important; 
 width: auto !important;
}

table tr {
 page-break-inside: avoid;
}

table thead tr td {
 background-color: #F0F0F0;
 /*border: 1px solid #DDDDDD;*/
 min-width: 0.6em;
 padding: 5px;
 text-align: left;
 vertical-align: top;
 font-weight: bold;
}

table tbody tr td {
 border: 1px solid #DDDDDD;
 min-width: 0.6em;
 padding: 5px;
 vertical-align: top;
}

tbody tr.even td {
 background-color: transparent;
}

 /*STATUS*/
.aui-lozenge {
 background: #dfe1e6;
 border: 1px solid #dfe1e6;
 border-radius: 3px;
 color: #253858;
 display: inline-block;
 font-size: 11px;
 font-weight: bold;
 line-height: 99%;
 margin: 0;
 padding: 2px 5px;
 text-align: center;
 text-decoration: none;
 text-transform: uppercase;
}

.status-macro {
 min-width: 76px;
 padding: 1px 3px 1px 3px;
}

.aui-lozenge-success { 
 color: #ffffff; 
 background-color: #14892c; 
 border-color: #14892c; 
} 

.aui-lozenge-error { 
 color: #ffffff; 
 background-color: #d04437; 
 border-color: #d04437; 
} 

.aui-lozenge-moved { 
color: #ffffff; 
background-color: #ffd351; 
border-color: #ffd351; 
} 

.aui-lozenge-complete { 
 color: #ffffff; 
 background-color: #4a6785; 
 border-color: #4a6785; 
}

Maybe someone can help me. Thank you!

Tobias Anstett (K15t)

Hi,

Here are some links which will help you further:

1. heading size

• I want to adjust the size of the H4

• h4 { font-size: 15px; }

• https://www.w3schools.com/cssref/pr_font_font-size.asp

2. text wrap

• there should be no break in the word

• p { white-space: nowrap; }

• you might need to add it to more definitions e.g. span etc.
• https://www.w3schools.com/cssref/pr_text_white-space.asp

3. inline task padding

• the padding between checkbox and table should be adjusted
• you'll need to inspect the checkbox element to find out about its class and define a margin-left: 10px;

4. cell color

• I want to export the highlight colors of the table
• I am not sure why this happens

 

As a side note, you may also want to check the Markteplace App Scroll PDF Exporter which comes with an advanced theme editor and allows you to create beautifully styled PDFs >> https://marketplace.atlassian.com/apps/7019/scroll-pdf-exporter-for-confluence

Best,
Tobias