Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    logik
    @logikonabstractions
    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
    But if Django doesn’t serve static files, it won’t work
    If you just want to test with no static files served by the server, you can try to use file:// URLs instead of /static/ URLs that are supposed to be served by the HTTP server
    Troulet-Lambert Odile
    @piscvau_gitlab
    OK yes I tried this. But unfortunately I end up with href= "/file:/home/odile/ and I suppose the extra / prevents weasyprint to find the file. Is this correct?
    Guillaume Ayoub
    @liZe
    Right, the URL is probably rewritten by Django :/
    Troulet-Lambert Odile
    @piscvau_gitlab
    The only solution would then be to create manually a CSS object in the test and pass it to the function HTML in some way. Is this correct?
    Guillaume Ayoub
    @liZe
    To test, you can first include some CSS in a <style> tag and see that it works correctly
    If it works, you can then 1) create the CSS object and give it to the HTML class, or 2) create your own url_fetcher that will translate /static/… URLs into filenames and call the original url_fetcher with this filename
    If it doesn’t work, then the problem is elsewhere
    Troulet-Lambert Odile
    @piscvau_gitlab
    Yes but this is not really good testing practice. But I understand weasyprint is not the cause of my problem!.....
    Guillaume Ayoub
    @liZe
    Oh, OK, I didn’t understand that you were creating unit tests, I thought that you were just trying to get a quick and dirty website!
    :)
    Troulet-Lambert Odile
    @piscvau_gitlab
    well I think that creating a CSS object will do it at least for the moment, because I have only one static that is the CSS. Thanks a lot
    Guillaume Ayoub
    @liZe
    No problem!