erp5_corporate_identity: add space between <p> and align span when it's too long

bt5/erp5_corporate_identity/SkinTemplateItem/portal_skins/erp5_corporate_identity/template_css/book.css.css

@@ -772,10 +772,12 @@ NOTE: logos will disappear in wkhtmltopdf if they go beyond the available space
 }
 .ci-book .ci-book-img > img ~ span {
   margin-left: 3cm;
+  display:inline-block;
 }
 
 .ci-book .ci-book-img + span {
   margin-left: 3cm;
+  display:inline-block;
 }
 
 .ci-book table caption,
@@ -791,8 +793,14 @@ NOTE: logos will disappear in wkhtmltopdf if they go beyond the available space
 /* editor adding <p>... */
 html .ci-book table td p {
   margin: 0;
-  padding: 0;
   text-indent: 0;
+  display:inline-block;
+}
+html .ci-book table td p:first-child {
+  padding: 0;
+}
+html .ci-book table td p:not(:first-child){
+  padding-left: 5px;
 }
 /* === code boxes === */
 .ci-book pre {

bt5/erp5_corporate_identity/SkinTemplateItem/portal_skins/erp5_corporate_identity/template_css/book.pdf.css.css

@@ -800,10 +800,12 @@ NOTE: logos will disappear in wkhtmltopdf if they go beyond the available space
 }
 .ci-book .ci-book-img > img ~ span {
   margin-left: 3cm;
+  display:inline-block;
 }
 
 .ci-book .ci-book-img + span {
   margin-left: 3cm;
+  display:inline-block;
 }
 .ci-book table caption,
 .ci-book .ci-book-caption {
@@ -818,8 +820,15 @@ NOTE: logos will disappear in wkhtmltopdf if they go beyond the available space
 /* editor adding <p>... */
 html .ci-book table td p {
   margin: 0;
-  padding: 0;
   text-indent: 0;
+  display:inline-block;
+}
+
+html .ci-book table td p:first-child {
+  padding: 0;
+}
+html .ci-book table td p:not(:first-child){
+  padding-left: 5px;
 }
 /* === code boxes === */
 .ci-book pre {

[Nicolas Wavrant]

Hi @xiaowu.zhang

I have a display issue when exporting a web page to book with this CSS rule:

html .ci-book table td p:not(:first-child){
  padding-left: 5px;
}

I see that you removed this rule the same day, but only in bt5/erp5_corporate_identity/SkinTemplateItem/portal_skins/erp5_corporate_identity/template_css/book.pdf.css.css (commit 3186f488).

Is there a reason to keep it in bt5/erp5_corporate_identity/SkinTemplateItem/portal_skins/erp5_corporate_identity/template_css/book.css.css ? If not, can I (or you) remove it, and could you port the change to Nexedi ERP5 ?

Regards,

Nicolas

(cc: @tb )

[Xiaowu Zhang]

hello,

I see that you removed this rule the same day, but only in bt5/erp5_corporate_identity/SkinTemplateItem/portal_skins/erp5_corporate_identity/template_css/book.pdf.css.css (commit 3186f488).

it's because i defined in other place, the padding-left for p existes always

if i have such text,

<td>
    <p>today is monday</p>
    <p>tomorrow is Tuesday</p>
    <p>after tomorrow is Wednesday</p>
</td> 

without padding, the result will be: today is mondaytomorrow is Tuesdayafter tomorrow is Wednesday, it's strange

what's your issue?

[Nicolas Wavrant]

The issue I see in the parapraph highlighted in this screenshot (taken from the preview in the "Export Book" action):

All paragraphs except the first have a white space on the left, which looks inconsistent.

I render the table in PDF. It's interesting, all the content of the table cell is extra-padded on the left, even the first paragraph:

The source HTML is simple and doesn't contain extra tags or attributes:

<table border="1" cellpadding="1" cellspacing="1">
	<tbody>
		<tr>
			<td><strong>N&deg;</strong></td>
			<td><strong>Titre</strong></td>
			<td><strong>Description</strong></td>
			<td><strong>Acteur</strong></td>
		</tr>
		<tr>
			<td>1</td>
			<td>Acc&egrave;s &agrave; l&#39;opportunit&eacute; de vente</td>
			<td>[...]</td>
			<td>[...]</td>
		</tr>
		<tr>
			<td>2</td>
			<td>Enregistrement d&#39;une souscription</td>
			<td>[...]</td>
			<td>[...]</td>
		</tr>
		<tr>
			<td>3</td>
			<td>Cr&eacute;ation de la souscription</td>
			<td>
			<p>ERP5 [...]</p>

			<p>Si le type [...]</p>
			</td>
			<td>[...]</td>
		</tr>
	</tbody>
</table>

without padding, the result will be: today is mondaytomorrow is Tuesdayafter tomorrow is Wednesday, it's strange

Isn't it a side-effect of the display:inline-block; ? The padding just controls the space around blocks, not their disposition.

[Xiaowu Zhang]

i added a new class no-padding, you can add class to td to not have padding for p

<td class='no-padding'>
    <p>ERP5 [...]</p>
    <p>Si le type [...]</p>
</td>

I render the table in PDF. It's interesting, all the content of the table cell is extra-padded on the left, even the first paragraph:

the css used in export to PDF is different to export to html

in export to PDF the layout is smaller and it use old version of firefox(don't remember the version)

Isn't it a side-effect of the display:inline-block; ? The padding just controls the space around blocks, not their disposition.

yes, p is block level element, display:inline-block; makes p next to another p

[Nicolas Wavrant]

Xiaowu,

I don't think that adding a class to fix a displaying bug is a good solution. I think the CSS rule display:inline-block; introduced a bug, and it should be removed. Then there is no need for the padding-left rule.

I believe that the render should look like what I see in ckeditor, I don't want to have to remember that if I type a new line in a table, I need to also edit the source code to add a new class.

If you confirm there is no justification for the randomly left-padding, I'll fix it. Could you provide me the HTML source that made you introduce it, so I don't break your use case when I'll do ?

Regards,

Nicolas

[Xiaowu Zhang]

Could you provide me the HTML source that made you introduce it

i don't remember, it was probably required by jp for his web page

you can check all the tests here

[Nicolas Wavrant]

Thanks Xiaowu ! If there is a test it's perfect :)