[FIX] web: properly align fields in calendar popover

Previously, the fields in the calendar popover were misaligned.
This fix ensures proper alignment of the fields.

Task-4315829

closes odoo/odoo#190234

X-original-commit: 2bcc3056
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

addons/web/static/src/views/calendar/calendar_common/calendar_common_popover.scss

@@ -6,14 +6,6 @@ $o-cw-popup-avatar-size: 16px;
     z-index: $zindex-modal - 1;
     font-size: $font-size-base;
 
-    .role-container span {
-        display: block;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        max-width: 100%;
-    }
-
     .card-header,
     .card-header .popover-header {
         font-size: 1.05em;
@@ -50,6 +42,10 @@ $o-cw-popup-avatar-size: 16px;
         border: none;
     }
 
+    .o_cw_popover_field .o_field_widget {
+        @include o-text-overflow(block);
+    }
+
     .o_cw_popover_fields_secondary {
         max-height: 170px; // Fallback for old browsers
         max-height: 25vh;

addons/web/static/src/views/calendar/calendar_common/calendar_common_popover.xml

@@ -55,8 +55,8 @@
                                     <t t-esc="fieldInfo.string" />
                                 </t>
                             </span>
-                            <div class="flex-grow-1 role-container text-truncate">
-                                <Field name="fieldInfo.name" class="'w-100'" record="slot.record" fieldInfo="fieldInfo" type="fieldInfo.widget" />
+                            <div class="flex-grow-1 o_cw_popover_field overflow-hidden">
+                                <Field name="fieldInfo.name" record="slot.record" fieldInfo="fieldInfo" type="fieldInfo.widget" />
                             </div>
                         </li>
                     </t>