diff --git a/addons/fleet/views/fleet_vehicle_cost_views.xml b/addons/fleet/views/fleet_vehicle_cost_views.xml
index 2e516aeb3f0..ceb6f99ac65 100644
--- a/addons/fleet/views/fleet_vehicle_cost_views.xml
+++ b/addons/fleet/views/fleet_vehicle_cost_views.xml
@@ -172,7 +172,7 @@
                 <templates>
                     <div t-name="activity-box">
                         <img t-att-src="activity_image('res.partner', 'avatar_128', record.purchaser_id.raw_value)" t-att-title="record.purchaser_id.value" t-att-alt="record.purchaser_id.value"/>
-                        <div>
+                        <div class="ms-2">
                             <field name="vehicle_id" display="full"/>
                         </div>
                     </div>
@@ -349,11 +349,9 @@
                 <templates>
                     <div t-name="activity-box">
                         <img t-att-src="activity_image('fleet.vehicle', 'image_128', record.vehicle_id.raw_value)" role="img" t-att-title="record.vehicle_id.value" t-att-alt="record.vehicle_id.value"/>
-                        <div>
+                        <div class="ms-2">
                             <field name="vehicle_id"/>
-                            <t t-if="record.description.raw_value">
-                                : <field name="description"/>
-                            </t>
+                            <field t-if="record.description.raw_value" name="description" muted="1"/>
                         </div>
                     </div>
                 </templates>
diff --git a/addons/fleet/views/fleet_vehicle_views.xml b/addons/fleet/views/fleet_vehicle_views.xml
index f1f3165d19e..a8b87eeac82 100644
--- a/addons/fleet/views/fleet_vehicle_views.xml
+++ b/addons/fleet/views/fleet_vehicle_views.xml
@@ -328,9 +328,10 @@
                 <field name="id"/>
                 <templates>
                     <div t-name="activity-box">
-                        <img t-att-src="activity_image('fleet.vehicle', 'image_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
-                        <div>
-                            <field name="license_plate"/> : <field name="model_id"/>
+                        <img class="rounded-circle" t-att-src="activity_image('fleet.vehicle', 'image_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
+                        <div class="ms-2">
+                            <field name="license_plate" display="full"/>
+                            <field name="model_id" muted="1"/>
                         </div>
                     </div>
                 </templates>
diff --git a/addons/hr/views/hr_employee_views.xml b/addons/hr/views/hr_employee_views.xml
index fae5a3e2f87..6ebf27690a9 100644
--- a/addons/hr/views/hr_employee_views.xml
+++ b/addons/hr/views/hr_employee_views.xml
@@ -368,8 +368,8 @@
                     <field name="id"/>
                     <templates>
                         <div t-name="activity-box">
-                            <img t-att-src="activity_image('hr.employee', 'avatar_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
-                            <div>
+                            <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <field name="job_id" muted="1" display="full"/>
                             </div>
diff --git a/addons/hr_contract/views/hr_contract_views.xml b/addons/hr_contract/views/hr_contract_views.xml
index 403e37dfd73..d2a98f1b2d0 100644
--- a/addons/hr_contract/views/hr_contract_views.xml
+++ b/addons/hr_contract/views/hr_contract_views.xml
@@ -355,8 +355,8 @@
                     <field name="employee_id"/>
                     <templates>
                         <div t-name="activity-box">
-                            <img t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
-                            <div>
+                            <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <field name="job_id" muted="1" display="full"/>
                             </div>
diff --git a/addons/hr_expense/views/hr_expense_views.xml b/addons/hr_expense/views/hr_expense_views.xml
index 0fce3704b9c..4799dfc43d3 100644
--- a/addons/hr_expense/views/hr_expense_views.xml
+++ b/addons/hr_expense/views/hr_expense_views.xml
@@ -380,8 +380,8 @@
                     <field name="currency_id"/>
                     <templates>
                         <div t-name="activity-box">
-                            <img t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
-                            <div>
+                            <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <field name="total_amount" widget="monetary" muted="1" display="full"/>
                             </div>
@@ -982,8 +982,8 @@
                     <field name="currency_id"/>
                     <templates>
                         <div t-name="activity-box">
-                            <img t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
-                            <div>
+                            <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <field name="total_amount" widget="monetary" muted="1" display="full"/>
                                 <field name="state" display="right"/>
diff --git a/addons/hr_holidays/views/hr_leave_allocation_views.xml b/addons/hr_holidays/views/hr_leave_allocation_views.xml
index ba0b2316cb1..f2b0a96bee7 100644
--- a/addons/hr_holidays/views/hr_leave_allocation_views.xml
+++ b/addons/hr_holidays/views/hr_leave_allocation_views.xml
@@ -408,9 +408,9 @@
                 <field name="employee_id"/>
                 <templates>
                     <div t-name="activity-box">
-                        <img t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
-                        <div>
-                            <field name="employee_id"/> <span class="text-muted">(<field name="number_of_days"/> days)</span>
+                        <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value"/>
+                        <div class="ms-2">
+                            <field name="employee_id" bold="1"/> <span class="text-muted">(<field name="number_of_days"/> days)</span>
                             <field name="holiday_status_id" muted="1" display="full"/>
                         </div>
                     </div>
diff --git a/addons/hr_holidays/views/hr_leave_views.xml b/addons/hr_holidays/views/hr_leave_views.xml
index 8574ee65fff..2d81146854c 100644
--- a/addons/hr_holidays/views/hr_leave_views.xml
+++ b/addons/hr_holidays/views/hr_leave_views.xml
@@ -189,9 +189,9 @@
                 <field name="number_of_days"/>
                 <templates>
                     <div t-name="activity-box">
-                        <img t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value" width="50" height="50"/>
-                        <div>
-                            <field name="name"/> <span class="text-muted">(<field name="number_of_days"/> days)</span>
+                        <img class="rounded-circle" t-att-src="activity_image('hr.employee', 'avatar_128', record.employee_id.raw_value)" t-att-title="record.employee_id.value" t-att-alt="record.employee_id.value" width="50" height="50"/>
+                        <div class="ms-2">
+                            <field name="name" bold="1"/> <span class="text-muted">(<field name="number_of_days"/> days)</span>
                             <div class="text-muted">
                                 <field name="date_from" widget="date"/> <i class="fa fa-long-arrow-right" title="to" /> <field name="date_to" widget="date"/>
                             </div>
diff --git a/addons/hr_recruitment/views/hr_applicant_views.xml b/addons/hr_recruitment/views/hr_applicant_views.xml
index fef13fc61fe..1d940a6ca5e 100644
--- a/addons/hr_recruitment/views/hr_applicant_views.xml
+++ b/addons/hr_recruitment/views/hr_applicant_views.xml
@@ -392,7 +392,7 @@
             <activity string="Applicants">
                 <templates>
                     <div t-name="activity-box">
-                        <div>
+                        <div class="ms-2">
                             <field name="name" display="full"/>
                             <field name="partner_name" muted="1" display="full"/>
                         </div>
diff --git a/addons/mail/static/src/views/activity/activity_compiler.js b/addons/mail/static/src/views/activity/activity_compiler.js
index 904e1e38549..be4b7a9c35f 100644
--- a/addons/mail/static/src/views/activity/activity_compiler.js
+++ b/addons/mail/static/src/views/activity/activity_compiler.js
@@ -1,6 +1,6 @@
 /** @odoo-module **/
 
-import { createElement } from "@web/core/utils/xml";
+import { createElement, extractAttributes } from "@web/core/utils/xml";
 import { toStringExpression } from "@web/views/utils";
 import { toInterpolatedStringExpression, ViewCompiler } from "@web/views/view_compiler";
 
@@ -10,14 +10,35 @@ export class ActivityCompiler extends ViewCompiler {
      */
     compileField(el, params) {
         let compiled;
-        if (!el.hasAttribute("widget")) {
-            // fields without a specified widget are rendered as simple spans in activity records
-            compiled = createElement("div", { "class": "d-inline-block", "t-out": `record["${el.getAttribute("name")}"].value` });
-            if (el.getAttribute("muted")) {
-                compiled.classList.add("text-muted");
-            }
-        } else {
+        if (el.hasAttribute("widget")) {
             compiled = super.compileField(el, params);
+        } else {
+            // fields without a specified widget are rendered as simple spans in activity records
+            compiled = createElement("div", {
+                "t-out": `record["${el.getAttribute("name")}"].value`,
+            });
+        }
+        const classNames = [];
+        const { bold, display, muted } = extractAttributes(el, ["bold", "display", "muted"]);
+        if (display === "right") {
+            classNames.push("float-end");
+        }
+        if (display === "full") {
+            classNames.push("d-block", "text-truncate");
+        } else {
+            classNames.push("d-inline-block");
+        }
+        if (bold) {
+            classNames.push("fw-bold");
+        }
+        if (muted) {
+            classNames.push("text-muted");
+        }
+        if (classNames.length > 0) {
+            const clsFormatted = el.hasAttribute("widget")
+                ? toStringExpression(classNames.join(" "))
+                : classNames.join(" ");
+            compiled.setAttribute("class", clsFormatted);
         }
 
         const attrs = {};
diff --git a/addons/mail/views/res_partner_views.xml b/addons/mail/views/res_partner_views.xml
index 377d3589b84..de0fa3afe83 100644
--- a/addons/mail/views/res_partner_views.xml
+++ b/addons/mail/views/res_partner_views.xml
@@ -79,8 +79,8 @@
                     <field name="id"/>
                     <templates>
                         <div t-name="activity-box">
-                            <img t-att-src="activity_image('res.partner', 'avatar_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
-                            <div>
+                            <img t-att-src="activity_image('res.partner', 'avatar_128', record.id.raw_value)" role="img" t-att-title="record.name.value" t-att-alt="record.name.value"/>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <field name="parent_id" muted="1" display="full"/>
                             </div>
diff --git a/addons/product/views/product_template_views.xml b/addons/product/views/product_template_views.xml
index 124c5abc5c6..742f58810a4 100644
--- a/addons/product/views/product_template_views.xml
+++ b/addons/product/views/product_template_views.xml
@@ -128,7 +128,7 @@
                 <templates>
                     <div t-name="activity-box">
                         <img t-att-src="activity_image('product.template', 'image_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
-                        <div>
+                        <div class="ms-2">
                             <field name="name" display="full"/>
                             <div t-if="record.default_code.value" class="text-muted">
                                 [<field name="default_code"/>]
diff --git a/addons/product/views/product_views.xml b/addons/product/views/product_views.xml
index 05beab4be08..748407828e4 100644
--- a/addons/product/views/product_views.xml
+++ b/addons/product/views/product_views.xml
@@ -440,7 +440,7 @@
                     <templates>
                         <div t-name="activity-box">
                             <img t-att-src="activity_image('product.product', 'image_128', record.id.raw_value)" role="img" t-att-title="record.id.value" t-att-alt="record.id.value"/>
-                            <div>
+                            <div class="ms-2">
                                 <field name="name" display="full"/>
                                 <div t-if="record.default_code.value" class="text-muted">
                                     [<field name="default_code"/>]