Discussion of PDF Pages 2.0

App Development
6

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.

7

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
8

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

9

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:

10

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.

11

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

12

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
13

@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?

14

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

15

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

16

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.

17

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
18

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

19

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

20

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

21

This feature was much needed!
I’m only the one who’s having stability issue with this feature?
I generated a PDF contract with different fields (text, image, sliders, etc.) and send it to the user by notification once the form is completed.
However, pretty much everytime I have a red error popup that appears when I submit the form (see image).
screenshot
However, the form is recorded perfectly, but the email/PDF doesn’t send.
I tried to isolate every fields through testing, but the problem doesn’t seems to be linked to a specific field; sometimes the email/PDF works, sometime it doesn’t.
This variability makes it really hard to troubleshoot and the error message isn’t really helpful to pinpoint where’s the problem…

Any thoughts?

22

I’ll reply to myself here :slight_smile:
It appears that the problem was caused because the form was within a public layout. The person that received the form link by email didn’t have to be connected to sign. But a CC field in the email notification upon form submission was link to a “connected field user”, so the system didn’t know who to send it to. Thus the error.
I removed that and no errors so far.

23

image
Hi @tim.young I see we can add HTML inside a list component, how to modify that using CSS? ex. if I had h1 inside that HTML, how can modify it, or if I have a field to have a fix height?

Also we saw a bug, it doesn’t show “address” field in html.

24

Hi, I had the same question but didn`t get any answer unfortunately.

Has anyone managed to display images (in a list component) within a PDF? They are limited by default to a thumb size and could not change that with CSS either.

25

@Chem @tim.young @moe