Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    Guillaume Ayoub
    @liZe
    There are workarounds to get smaller tables, such as reducing the td paddings, or reducing the font size
    If (minimum table width + margin-right) is larger than the page size, then margin-right is useless
    Hmmmm…
    Maybe I didn’t understand your problem
    logik
    @logikonabstractions
    Yes not quite - but nonethless your comment did make me think about something, I'll try that out & get back.
    Guillaume Ayoub
    @liZe
    OK, I think that I get it
    If you add a right-margin to the table, it doesn’t shrink even if the table can be smaller without overflowing
    But that’s normal, because you have a width set to your table
    width doesn’t include the margin, that’s normal
    logik
    @logikonabstractions
    Okay let's take this. I commented out the table since my issue is about the whole layout actually:
    image.png
    This is with a margin-right in the @page set at 50mm. It isn't set at all - if I put a 0 for that margin I get the same image
    However
    image.png
    That's with 250mm for margin-right in the @page css
    Guillaume Ayoub
    @liZe
    Is it possible to you share your HTML+CSS document for your first example?
    It’s hard to know what’s going on without the source :)
    logik
    @logikonabstractions
    <!DOCTYPE html>
    <html lang="en">
    
    
    <!-- a generic template to start from -loads all the libs & css files as needed for the gulp live reload -->
    <head>
    
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="description" content="">
        <meta name="author" content="">
    
        <title>PDF - base</title>
        {% load static %}
        <!-- Custom styles for this template-->
        <link href="css/sb-admin-2.css" rel="stylesheet" type="text/css" >
        <link href="css/pdf.css" rel="stylesheet" type="text/css" >
    
    </head>
    
    <body id="page-top">
    
        <div class="container-fluid">
            <div class="row">
                <div class="col-4">
                     <img src="{% static 'img/voltech.png'%}">
                     <h5>www.voltechint.com</h5>
                </div>
                <div class="col-4">
                    <div class="d-flex flex-direction-row">
                        <h3>Picking</h3>
                        <h3>21868</h3>
                        <h3>-</h3>
                        <h3>1</h3>
                    </div>
                    <div>
                        <h3>*P123345*</h3>
                    </div>                
                </div>
                <div class="col-4 tight ">
                    <h4>{{address.name}}</h4>
                    <p>{{address.addr}}</p>
                    <p>{{address.ville}}</p>
                    <p>{{address.pays}} {{address.zip}}</p>
                    <p>Phone: {{address.tel}}</p>
                    <p>Fax: {{address.fax}}</p>
                    <p>Watt: {{address.watt}}</p>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col-6">
                    <h5>Ship to</h5>
                    <p>Pascal Petit * samples</p>
                </div>
                <div class="col-6">
                    <div>
                        <h5 class="d-inline">Order by</h5>
                        <p class="d-inline">{{entpick.tmp_client}}</p>
                    </div>
                    <div>
                        <h5 class="d-inline">Bill to</h5>
                        <p class="d-inline">{{entpick.fk_clientf.nom1}}</p>
                    </div>
                    <div>
                        <h5 class="d-inline">Ship by</h5>
                        <p class="d-inline">{{entpick.transport.desc_via}}</p>
                    </div>
                    <div>
                        <h5 class="d-inline">PO</h5>
                        <p class="d-inline">{{entpick.po}}</p>
                    </div>
                    <div>
                        <h5 class="d-inline">Contact</h5>
                        <p class="d-inline">{{entpick.contact}}</p>
                    </div>
                    <div class="row">
                        <div class="col-6">
                            <h5>By</h5>
                            <p>{{entpick.par}}</p>
                            <h5>Date</h5>
                            <p>{{entpick.date_pick}}</p>
                        </div>
                        <div class="col-6">
                            <h5>Vendor</h5>
                            <p>{{entpick.fk_vendeur.nom}}</p>
                            <h5>Ship</h5>
                            <p>{{entpick.date_liv}}</p>
                        </div>
                    </div>
                </div>
            </div>
            <hr>
            <div class="row">
                <div class="col">
                    <table>
                        <thead>
                            <tr>
                                <th class="quantity">Quantity</th>
                                <th class="product">Product</th>
                                <th class="description">Description</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for det in detpicks %}
                                <tr>
                                    <td>{{det.qte_cmd}}</td>
                                    <td>{{det.no_prod}}</td>
                                    <td>{{det.tmp_desc}}</td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
    @page {
        size: letter;
        /*padding: 2mm;*/
        margin: 0mm 20mm 0mm 0mm;
        padding: 0mm 0mm 0mm 0mm;
    }
    
    body {
        line-height: 1;
        color: black;
    }
    
    hr {
        margin: 0.5rem 0rem 0.5rem 0rem;
    }
    
    h3 {
        font-size: 1rem;
    }
    h4 {
        font-size: 0.9rem;
    }
    
    h5 {
        font-size: 0.6rem;
        font-weight: bold;
        margin: 0rem 0.2rem 0rem 0.2rem;
    
    }
    p {
        font-size: 0.6rem;
        margin: 0rem 0.2rem 0rem 0.2rem;
    }
    th {
        font-size: 0.8rem;
        font-weight: bold;
    }
    
    td {
        font-size: 0.7rem;
    }
    
    div h3, div h4, div p {
        padding: 0.1rem 0.1rem;
    }
    
    .tight h3, .tight h4, .tight p {
        padding: 0rem;
        margin:  0rem;
    }
    
    img {
        width:  20mm;
    }
    
    table {
        width: 150mm;
        padding: 1rem;
        margin-bottom: 5rem;
    }
    
    thead {
        padding: 1rem;
    }
    
    thead tr {
        border-top: 2px solid black;
        border-bottom: 2px solid black;
    }
    
    th.quantity {
        width: 15%;
    }
    
    th.product {
        width: 25%;
    }
    
    input::before {
        content: attr(value);
    }
    (the html is django templating engine, but you get the idea)
    Guillaume Ayoub
    @liZe
    OK, I’ll check that a bit later
    logik
    @logikonabstractions
    image.png
    (then rendered page as pdf)
    Okay thanks a bunch! If you can think of something
    Guillaume Ayoub
    @liZe
    @logikonabstractions I think that we need another stylesheet
    You probably sent pdf.css, but not sb-admin-2.css
    Michael Lewellen
    @cylon56
    image.png
    logik
    @logikonabstractions

    @liZe armphhhhhhhh......... I can be so dumb at times. That css files is basically a baseline from some frontend template I'm using throughout the project. I guess it just made its way there because.... well copy-past I guess. Removing it does solve the issue w/o really affecting the pdf (since I'm already specifying things I want to see there in my own css).

    Well spotted. It probably set some width or something somewhere that weasy didn't like.

    Benjamin Lok
    @BenjaminLok_gitlab
    Hey there, I have a python project on windows using weasyprint. It was working fine about 2 weeks ago. Since then I haven't changed the project. I have done a windows update though, and now when I try to import weasyprint, I get Fontconfig error: Cannot load default config file - anyone else had this and know what to do?
    Lucie Anglade
    @grewn0uille
    Hello @BenjaminLok_gitlab! Did you have a look at these issues Kozea/WeasyPrint#1472, Kozea/WeasyPrint#1474 and Kozea/WeasyPrint#1464 related to fontconfig with windows?
    2 replies
    Benjamin Lok
    @BenjaminLok_gitlab
    will do now, thank you
    elimboto
    @elimboto
    Hello, the Team. This snippet, HTML(string=output).write_pdf("report.pdf", stylesheets=[CSS(string='@page { size: landscape }')]) can convert a Python HTML table into pdf, but only up to some width. I have encountered the situation where the table is wider than this snippet can accommodate, and hence its width will be cut off. I read somewhere that " A modern PDF file can be 15,000,000 inches in each direction....". What can I do to convert HTML doc into pdf no matter its width?
    Lucie Anglade
    @grewn0uille
    Hello!
    There is no perfect solution for this. You can reduce the font-size of the text in the table to make it fit the page. You can also use named page to have different a bigger page for pages with table
    elimboto
    @elimboto
    @grewn0uille Thank you. Reducing font size may in most cases not help, suppose you have 50 columns, each with a width of at least one inch. Do you have an example of named page usage with WeasyPrint?
    For example, you have page: no-chapter in h1
    It means that h1 tags will be put in special pages called no-chapter
    And you can define the format of these pages in a @page no-chapter rule
    Troulet-Lambert Odile
    @piscvau_gitlab
    Hello I am using the report example to write a css for a template in my application. I do not have very much experience with css. I am struggling with the h2 with string-set. I guess that it says that all h2 text should have a break_before and their content should be considered as having an id = "heading". Could you confirm that this understanding is correct; also the string-set is not described in mozilla css reference and here (https://www.cssportal.com/css-properties/string-set.php) it is said that it is deprecated. I suppose it is correctly handled by weasyprint but is there a more recent alternative? I thank you in advance for your help.
    Lucie Anglade
    @grewn0uille
    Hello!
    In the report sample, each time a h2 tag is encounter, its content is put in a string named "heading" and we break before to have a new page https://github.com/CourtBouillon/weasyprint-samples/blob/d95ca0480c8ad1964065b89496541f7c73e5d251/report/report.css#L95-L99
    This string "heading" is used to put the title of the chapter at the top right of the page https://github.com/CourtBouillon/weasyprint-samples/blob/d95ca0480c8ad1964065b89496541f7c73e5d251/report/report.css#L46
    The id "heading" in the HTML is only used to put a image for this section https://github.com/CourtBouillon/weasyprint-samples/blob/d95ca0480c8ad1964065b89496541f7c73e5d251/report/report.css#L207
    Troulet-Lambert Odile
    @piscvau_gitlab
    OK thanks a lot. That is clear.
    Troulet-Lambert Odile
    @piscvau_gitlab
    Hello I am using weasyprint to create a pdf from a django template. The html generated by django template contains a <link rel='stylesheet" href = "/static/.....". The css seems to never be called. I tried to put a specific url_fetcher but it is never called either. So I am confused.
    Guillaume Ayoub
    @liZe
    Hello! You really should use Django-WeasyPrint, it’s really useful to handle the static files correctly in Django.
    Troulet-Lambert Odile
    @piscvau_gitlab
    Hello yes I tried but it does not help. Django url_fetcher is never called. I guess what I misunderstand is what should go in the django template in the link href to the css
    Guillaume Ayoub
    @liZe
    Hmmm…
    Troulet-Lambert Odile
    @piscvau_gitlab
    or said in another way when does weasyprint.render does consider it should look for a url!....
    Guillaume Ayoub
    @liZe
    I think that you have to call a function instead of using /static/, but I don’t know Django very well…
    Troulet-Lambert Odile
    @piscvau_gitlab
    No but let us say it the other way around. what should be in the html so that weasyprint.HTML considers it should look for an URL. May be I should add that for the moment, I am testing with django test and so django is not really serving the static files.....
    Guillaume Ayoub
    @liZe
    Oh, that’s why Django-WeasyPrint doesn’t work then
    Django-WeasyPrint overrides the function used to serve static files, so that it bypasses the network and just gets the content from the filesystem