Search code examples
cssreportodooqweb

How to add CSS file to qweb report in Odoo 10?


i want to add custom css file to qweb report template. I tried to add like below but it didn't work :

    <?xml version="1.0" encoding="utf-8"?>
<odoo>
    <data>
        <report id="my_module.report_id" model="my_module.report_model" string="Some Model Report" report_type="qweb-pdf" name="my_module.report_name" file="my_module.report_name_file" menu="False"/>
        <template id="my_module_inherit_id" inherit_id="report.minimal_layout">
            <xpath expr="." position="inside">
                <link rel='stylesheet' href="/my_module/static/src/css/report_style.css"/>
            </xpath>
        </template>
        <template id="my_module.report_name">
            <t t-call="report.html_container">
                <t t-call="report.internal_layout">
                    <div class="page">
                        <style>
                        .test_class{color:blue;}
                        </style>
                        <!-- <div class="header">
                        </div> -->

                        <div class="body">
                            <h1 class="test_class" t-esc="test_variable['subVariable']"/>
                            <h1 class="test_class2" t-esc="test_variable['subVariable']"/>

                        </div>
                    </div>
                </t>
            </t>
        </template>
    </data>
</odoo>

defined style in page classed div is working well. But i want to add css file too. I tried below inherit ids as well but none of them worked :

report.minimal_layout
report.internal_layout
report.assets_common
web.assets_backend
report.style
report.external_layout

css file :

.test_class2{
    color: red;
}

css file path:

/my_module/static/src/css/report_style.css

Solution

  • I solved the issue :

    <template id="report_style_inherit" inherit_id="report.internal_layout">
                <xpath expr="." position="inside">
    
                    <link href="http://127.0.0.1:8069/module_name/static/src/css/libs/custom.css" rel="stylesheet" />
    
                </xpath>
            </template>
    

    using "report.internal_layout" as an inherit_id and adding odoo server link to css path solved my issue.