Odoo 10 change field colour

Question

I am trying to change the color of a field in Odoo10. here is my code

<xpath expr="//field[@name='order_line']/form//field[@name='analytic_tag_ids']" position="after">
                <label for="squarebox"/>
                <div>
                    <field name="squarebox"/>
                </div>
                <label for="squaremtrsold"/>
                <div>
                    <field name="squaremtrsold"/>
                </div>
            </xpath>

I tried <field name="squarebox"style="background:Blue;"/>

But this did not work?

Answer 1

Try adding the style for the div containing the field definition, since the field tag will not appear on the final html.

You could also add a class to the containing div and with some CSS rules you could target the field dom nodes to add the proper style rules

Answer 2

Try this module https://apps.odoo.com/apps/modules/10.0/web_widget_color_field/

using above module widget you can change the filed colour as per your interest.

Answer 3

You can give it a class, for instance 'squarebox', and then write your css code in your static folder, taking into account that your field will be rendered as an input tag later. So the next code should do the trick.

<label for="squarebox"/>
<div>
    <field name="squarebox" class="squarebox"/>
</div>

And then in your css file:

input.squarebox {
    background-color: blue;
}

Pay attention to append your custom css to the assets, something like this:

<?xml version="1.0" encoding="utf-8" ?>
<odoo>
    <template id="assets_backend" name="My Module Assets" inherit_id="web.assets_backend">
        <xpath expr="//link[last()]" position="after">
             <link rel="stylesheet" href="your_module_name/static/src/css/styles.css"/>
        </xpath>
    </template>
</odoo>

And finally to the manifest.py

'data': [
    'views/your_custom_assets.xml',
    ],
'css': ['static/src/css/styles.css'],

You should upgrade your modulea, and if not working, enter in ?debug=assets mode