[FIX] web, *: use correct DOM for m2m tags

* mail, calendar

- Fix traceback when clicking on a tag without color field (introduced
  in recent changes)
- Properly allow to delete tags on firefox (a button obviously cannot
  contain another button)

Closes https://github.com/odoo/odoo/pull/26547
Thanks to @hbh-odoo

1 files changed, 12 insertions, 4 deletions

diff --git a/addons/web/static/src/scss/fields.scss b/addons/web/static/src/scss/fields.scss
index 3681c38eb47..f85fd04d505 100644
--- a/addons/web/static/src/scss/fields.scss
+++ b/addons/web/static/src/scss/fields.scss
@@ -99,15 +99,21 @@
             flex: 0 0 auto;
             border: 0;
             font-size: 12px;
-            color: white;
             cursor: pointer;
+            user-select: none;
+
+            a {
+                color: inherit;
+            }
 
-            > .o_badge_text {
+            .o_badge_text {
                 @include o-text-overflow(inline-block);
                 max-width: 200px;
+                color: inherit;
             }
 
             .o_delete {
+                color: inherit;
                 cursor: pointer;
             }
         }
@@ -168,13 +174,15 @@
                 } @else {
                     &, &::after {
                         background-color: nth($o-colors, $size);
+                        color: $white;
                     }
                 }
             }
         }        
-        > .o_tag_error{ 
+        .o_tag_error {
             box-shadow: inset 0 0 0 2px #FF0000;
-            > .o_delete {
+
+            .o_delete {
                 color: #FF0000;
             }
         }