[IMP] web_responsive: Bigger checkboxes in list view

web_responsive/README.rst

@@ -109,6 +109,10 @@ Features for computers:
 
   .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif
 
+* Bigger checkboxes in list view
+
+  .. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/big_checkboxes.gif
+
 **Table of contents**
 
 .. contents::

web_responsive/readme/DESCRIPTION.rst

@@ -81,3 +81,7 @@ Features for computers:
   width preview clicking on the new maximize button.
 
   .. image:: ../static/img/document_viewer.gif
+
+* Bigger checkboxes in list view
+
+  .. image:: ../static/img/big_checkboxes.gif

web_responsive/static/description/index.html

@@ -435,6 +435,9 @@ part for side-by-side reading instead of full screen. You can still put it on fu
 width preview clicking on the new maximize button.</p>
 <img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" />
 </li>
+<li><p class="first">Bigger checkboxes in list view</p>
+<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/big_checkboxes.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/big_checkboxes.gif" />
+</li>
 </ul>
 <p><strong>Table of contents</strong></p>
 <div class="contents local topic" id="contents">

web_responsive/static/src/css/web_responsive.scss

@@ -618,6 +618,39 @@ html .o_web_client .o_main .o_main_content {
     }
 }
 
+// Big checkboxes
+.o_list_view {
+    .o_list_record_selector {
+        .custom-checkbox {
+            margin-right: 10px;
+            .custom-control-label {
+                top: -19px;
+            }
+        }
+    }
+    .o_data_cell {
+        .custom-checkbox .custom-control-label {
+            top: -6px;
+        }
+    }
+    .custom-checkbox {
+        margin-right: 10px;
+
+        .custom-control-label {
+            &::after {
+                width: 24px;
+                height: 24px;
+            }
+            &::before {
+                outline: none !important;
+                border: 1px solid #4c4c4c;
+                width: 24px;
+                height: 24px;
+            }
+        }
+    }
+}
+
 // Waiting Cursor
 .oe_wait {
   cursor: progress;

web_responsive/static/src/js/web_responsive.js

@@ -15,6 +15,7 @@ odoo.define('web_responsive', function (require) {
     var RelationalFields = require('web.relational_fields');
     var Chatter = require('mail.Chatter');
     var DocumentViewer = require('mail.DocumentViewer');
+    var ListRenderer = require('web.ListRenderer');
 
 
     /* Hide AppDrawer in desktop and mobile modes.
@@ -544,4 +545,17 @@ odoo.define('web_responsive', function (require) {
             this.$el.addClass('o_responsive_document_viewer');
         },
     });
+
+    // List Renderer: Big checkboxes
+    ListRenderer.include({
+
+        /**
+         * @override
+         */
+        _renderSelector: function () {
+            var $elm = this._super.apply(this, arguments);
+            $elm.find(".custom-control-label").html('');
+            return $elm;
+        },
+    });
 });