Discussion of PDF Pages 2.0

Hello all,

It is great to hear that the PDF pages 2.0 was finally released yesterday. It will allow us to do so much more than the alpha version.

I think there should be a thread to discuss all things about that feature. I will start off with a question: Is it possible to bring back the option to open the PDF in the browser instead of saving the file everytime?

Thanks,
Alex

1 Like

Good intiative.
I might have found a bug.

I gave it a class of h1, but it didn’t work

@peter

In this new version of PDF Pages, we’ve stripped out all CSS classes and created new, PDF specific classes. This means that any class you assign will need to defined in the CSS tab with whatever CSS you may want for that class :smile:

.h1 {
    font-size: 35px;
    font-weight: 900;
}

Hi @tim.young,
I’m not clear what the procedure is to make the pdf of a table of only child records.

Could you explain it or indicate where to find this information?
Thank you

Hi @DanioA

Sure!

The process is almost identical to the old system, except the PDF is created in Automations / PDF Pages

Here’s how to create PDFs

Here’s how you can access PDFs after you’ve created them

Here’s an example:
I want to print a PDF to show Order Details using the PDF Print Button

  1. Create a Detail PDF and select the Orders Data Table
  2. Build your PDF to show Order Details and connected Order Items (or whatever you want to show)
  3. Back in the Page Builder, navigate to an Order Details app page
  4. Add the PDF Print Button to the page and select the Order Detail PDF created in Step 1.

Hi @tim.young great to see PDF Pages 2.0 released :+1: Great work team TB!

Two questions on this if I may:

Pipe generated PDF Pages?

I want to be able to generate a PDF Pages via a Pipe call and then do something with it. For example, I currently use Pipes to create draft emails in my agents (users) office 365 mailboxes and I’m then attaching Tadabase stored PDF with them however currently this process relies on the agents saving the PDF Page (Alpha) back into Tadabase whereas ideally I want to automatically generate the PDF and pass it onto Office Outlook 365 directly, thus eliminating the manual re-uploading of the PDF.

so… anything in the pipeline to allow you to generate PDF 2 pages on the fly and then access them with a Pipe?

PDF Pages Alpha Deprecated?

What plans are there to retire this feature so we plan the migration of existing PDF’s over to 2.0 implementation?

many thanks,

Graham.

Howdy @tim.young -

Would it be possible to post CSS code of one of the built in themes? For me, this would help in being able to build my own custom layout for the page (e.g., table formatting).

Thoughts?
Adam

3 Likes

I second the deprecation question. I notice that I no longer have access to the old PDF Pages Alpha page to copy the code to move over to the new Pages 2.0. Any guidance on how to access them would be much appreciated!

Adam

Hey @SafetyUniversity what do you mean when you say " I no longer have access to the old PDF Pages Alpha page to copy the code"? You’ve got me worried now… :worried:

When I go to an app that was built with the old PDF Pages, the PDF tab at the top in Page Builder is no longer visible. I have been unable to find where I can access the old PDF Pages content so I can copy/paste into a new PDF Page 2.0.

I am still able to access the old PDFs and edit them.

Hey @SafetyUniversity

In order to have access to the PDF Alpha, alpha features must enabled for your account.

Can you reach out to us via support? I can see alpha features are currently enabled for your account so we need to investigate further.

@GREDDIE @SafetyUniversity

Regarding PDF Alpha depreciation, that’s a great question and I’d be happy to provide more details. PDF Alpha will continue to work as it did previously for those who had access and we do not intend to remove it from the Builder / Apps entirely. It’s possible that may change in time, but we will of course give ample advanced notice should that happen. Since the launch of 2.0, PDF Alpha will be hidden going forward for all new users. Existing users who previously had access will continue to have access although there’s some caveats here.

  1. We strongly recommend using PDF 2.0 for all PDFs inside your app.
  2. The team is no longer developing PDF Alpha. This means that while we will still make efforts to address major breaking issues, any other bugs or annoyances will not be addressed going forward.

PDF 2.0 is significantly more powerful and allows for many more features so our resources will be allocated there. Any PDF Alpha bug that was able to be resolved in PDF 2.0 was fixed by our team so it’s likely that if you were experiencing an issue with PDF Alpha, it’s fixed in 2.0 :smile:

Ok, moving on to the fun stuff. @SafetyUniversity, here is the CSS for the Atlas PDF theme :point_down:

a {
	color: inherit;
	text-decoration: none;
}
label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 5px;
	font-weight: 700;
}
.t-datatable_pdf_pages {
	font-size: 14px;
}
.t-pdf-table-heading,
.t-pdf-list-heading {
	font-weight: 500;
	font-size: 18px;
	color: #181C32;
	margin-top: 20px;
	margin-bottom: 10px;
}
.t-table {
	margin-top: 10px;
	min-width: 400px;
	overflow: hidden;
	border-radius: 15px;
	border: 1px solid #c7c7c7 !important;
	background-color: transparent;
}
.t-table td,
.t-table th {
	padding: 12px 15px;
	color: #555;
}
.t-table thead tr {
	color: #000;
	text-align: left;
	font-weight: 700;
	background-color: #ddd;
}
.t-table thead th {
	font-weight: 600;
	color: #555 !important;
	background: #f9f9f9;
	border: none;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}
.t-table>thead:first-child>tr:first-child>th {
	border-top: 0;
}
.t-table tbody tr:not(:first-child) td {
	border-bottom: none;
	border-left: none;
	border-right: none;
	border-top: 1px solid #f0efef;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}
.t-table img, .t-pdf-list-item img  {
	max-height: 150px;
	max-width: 150px;
	display: block;
	padding: 2px;
	height: auto;
}
.t-list_pdf_pages {
	font-size: 14px;
}
.t-pdf-list-item {
	margin: 5px;
	box-shadow: 0px -1px 5px 0px rgba(0, 0, 0, 0.25);
	overflow: hidden;
}
.t-pdf-list-field-group {
    margin-bottom: 25px;
}
.t-pdf-list-item .t-pdf-list-body {
	padding: 1rem;
}
.t-pdf-list-value {
	padding-top: 3px;
}
.t-card_pdf_pages {
	font-size: 14px;
	max-width:99%;
	margin:0 auto;
}
.af-card-component {
	border-radius: 6px;
	background-color: #fff;
	color: #252422;
	margin-bottom: 20px;
	border: 1px solid #cacaca;
	overflow: hidden;
}
.af-card-component .header {
	border-bottom: 1px solid #cacaca;
	background-color: #fff;
	margin: 5px 0;
	padding: 5px 10px;
}
.t-detail_pdf_pages {
	font-size: 14px;
}
.t-detail_pdf_pages img {
	display: block;
	padding: 2px;
	height: auto;
	max-height: 150px;
	max-width: 150px;
}
.t-pdf-details-field-group {
	border-bottom: 1px solid #dbdfea;
	padding-bottom: 25px;
	margin-bottom: 15px;
}
.t-pdf-list-cover-image {
    display: block;
    height: 300px;
    width: 100%;

}
.t-pdf-list-cover-image img {
    display: block;
    overflow: auto;
    max-width: 100%;
    height: 300px;
    width: 100%;
    object-fit: cover;
}
.t-pdf-image  {
   padding-bottom: 10px;
}
2 Likes

@tim.young
Is there some CSS we can apply for modifying the size and alignment of a logo in the PDF Layout?

How is the class applied to the image in the PDF header called?

fair enough :slight_smile: , I can edit my PDF Alpha Pages so hopefully Tim can investigate that further for you.

Hi, coming back to the CSS formatting of PDF has anyone managed to visualize an image in a details page in List component? The maximum size I get is around 150px by 150px and cannot find a way to modify it with CSS?

Another topic: Is it possible to use app variables in the Footer? I am trying to add the date and time or user who created the file but the page does not understand variables.

Thanks,
Alex

Hi @tim.young ,

Thanks for the reply to my second question, but could you make comment on my first question here, Pipe generated PDF Pages? even if to only confirm nothing new on this front for the time being…? I just wondered with the new capability to now trigger PDF’s via automation tasks whether there is an API Pipe call to call a Task or other way to achieve this?

Thanks in advance,
Graham.

Hey @GREDDIE

The short answer is yes, we do want to do this. From a higher level, we would love to and are actively working on making many processes available through an API - such as Tasks, Logins, and PDFs.

1 Like

Following on to Alex’s question, I too am interested in the ability to use app variables, such as app name, date, time, in the Header and Footer. Is this possible or are there plans to implement this? Thanks.

Andy

Hi,

Is it possible to apply CSS to the images in a list component? Currently, they are limited to 150x150 px and I cannot increase it.

@tim.young

@tim.young do you have a solution for this question?