From 954c0aaa9ed64235e944a2b7878d64144cfcfe27 Mon Sep 17 00:00:00 2001
From: Sandrine Barrucand <esther.stephan88@gmail.com>
Date: Thu, 23 Jul 2026 16:19:37 +0200
Subject: [PATCH] fix(xo6): add separator between label and hint in table
 actions (#10143)

---
 @xen-orchestra/web-core/lib/assets/css/base.pcss         | 5 +++++
 .../web-core/lib/components/menu/VtsActionsMenu.vue      | 4 ++--
 .../components/form/new/NewTrafficRuleForm.vue           | 9 +--------
 .../vm/components/actions/reboot/VmRebootButton.vue      | 2 +-
 .../vm/components/actions/shutdown/VmShutdownButton.vue  | 2 +-
 .../vm/components/actions/suspend/VmSuspendButton.vue    | 2 +-
 6 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/@xen-orchestra/web-core/lib/assets/css/base.pcss b/@xen-orchestra/web-core/lib/assets/css/base.pcss
index 78dd2d04a1..bf3fd6bcbe 100644
--- a/@xen-orchestra/web-core/lib/assets/css/base.pcss
+++ b/@xen-orchestra/web-core/lib/assets/css/base.pcss
@@ -90,3 +90,8 @@ pre {
     --scrollbar-border: 0.2rem;
   }
 }
+
+.em-dash-prefix::before {
+  content: '\2014'; /* em dash — */
+  margin-inline-end: 0.8rem;
+}
diff --git a/@xen-orchestra/web-core/lib/components/menu/VtsActionsMenu.vue b/@xen-orchestra/web-core/lib/components/menu/VtsActionsMenu.vue
index 03f5a2c053..2feacc02ac 100644
--- a/@xen-orchestra/web-core/lib/components/menu/VtsActionsMenu.vue
+++ b/@xen-orchestra/web-core/lib/components/menu/VtsActionsMenu.vue
@@ -22,7 +22,7 @@
         :on-click="action.onClick"
       >
         {{ action.label }}
-        <i v-if="action.hint">{{ action.hint }}</i>
+        <i v-if="action.hint" class="em-dash-prefix">{{ action.hint }}</i>
         <template v-if="isGroupAction(action)" #submenu>
           <MenuItem
             v-for="(child, childIndex) of action.children"
@@ -33,7 +33,7 @@
             :on-click="child.onClick"
           >
             {{ child.label }}
-            <i v-if="child.hint">{{ child.hint }}</i>
+            <i v-if="child.hint" class="em-dash-prefix">{{ child.hint }}</i>
           </MenuItem>
         </template>
       </MenuItem>
diff --git a/@xen-orchestra/web/src/modules/traffic-rules/components/form/new/NewTrafficRuleForm.vue b/@xen-orchestra/web/src/modules/traffic-rules/components/form/new/NewTrafficRuleForm.vue
index 6854be8782..98a4fe9980 100644
--- a/@xen-orchestra/web/src/modules/traffic-rules/components/form/new/NewTrafficRuleForm.vue
+++ b/@xen-orchestra/web/src/modules/traffic-rules/components/form/new/NewTrafficRuleForm.vue
@@ -31,7 +31,7 @@
             <span class="option-content">
               <VtsIcon v-if="option.properties.icon" :name="option.properties.icon" size="medium" />
               {{ option.properties.label }}
-              <span v-if="option.properties.disabled" class="no-vif typo-body-regular-small">{{
+              <span v-if="option.properties.disabled" class="em-dash-prefix typo-body-regular-small">{{
                 t('no-vif-detected')
               }}</span>
             </span>
@@ -112,13 +112,6 @@ async function onSubmit() {
   display: inline-flex;
   align-items: center;
   gap: 0.8rem;
-
-  .no-vif {
-    &::before {
-      content: '\2014';
-      margin-inline-end: 0.8rem;
-    }
-  }
 }
 
 .new-traffic-rule-form {
diff --git a/@xen-orchestra/web/src/modules/vm/components/actions/reboot/VmRebootButton.vue b/@xen-orchestra/web/src/modules/vm/components/actions/reboot/VmRebootButton.vue
index 6119675731..23b18c3d98 100644
--- a/@xen-orchestra/web/src/modules/vm/components/actions/reboot/VmRebootButton.vue
+++ b/@xen-orchestra/web/src/modules/vm/components/actions/reboot/VmRebootButton.vue
@@ -1,7 +1,7 @@
 <template>
   <MenuItem v-if="canDisplay" :disabled="!canReboot" icon="action:reboot" :busy="isRunning" @click="openModal()">
     {{ t('action:reboot') }}
-    <i v-if="!canReboot">{{ t('vm-tools-missing') }}</i>
+    <i v-if="!canReboot" class="em-dash-prefix">{{ t('vm-tools-missing') }}</i>
   </MenuItem>
 </template>
 
diff --git a/@xen-orchestra/web/src/modules/vm/components/actions/shutdown/VmShutdownButton.vue b/@xen-orchestra/web/src/modules/vm/components/actions/shutdown/VmShutdownButton.vue
index d3f3d6df57..d3688e0922 100644
--- a/@xen-orchestra/web/src/modules/vm/components/actions/shutdown/VmShutdownButton.vue
+++ b/@xen-orchestra/web/src/modules/vm/components/actions/shutdown/VmShutdownButton.vue
@@ -1,7 +1,7 @@
 <template>
   <MenuItem v-if="canDisplay" :disabled="!canShutdown" icon="action:shutdown" :busy="isRunning" @click="openModal()">
     {{ t('action:shutdown') }}
-    <i v-if="!canShutdown" class="typo">{{ t('vm-tools-missing') }}</i>
+    <i v-if="!canShutdown" class="em-dash-prefix">{{ t('vm-tools-missing') }}</i>
   </MenuItem>
 </template>
 
diff --git a/@xen-orchestra/web/src/modules/vm/components/actions/suspend/VmSuspendButton.vue b/@xen-orchestra/web/src/modules/vm/components/actions/suspend/VmSuspendButton.vue
index df6e6e19f5..50b45b5a31 100644
--- a/@xen-orchestra/web/src/modules/vm/components/actions/suspend/VmSuspendButton.vue
+++ b/@xen-orchestra/web/src/modules/vm/components/actions/suspend/VmSuspendButton.vue
@@ -1,7 +1,7 @@
 <template>
   <MenuItem v-if="canDisplay" :disabled="!canSuspend" icon="fa:moon" :busy="isRunning" @click="openModal()">
     {{ t('action:suspend') }}
-    <i v-if="!canSuspend">{{ t('vm-tools-missing') }}</i>
+    <i v-if="!canSuspend" class="em-dash-prefix">{{ t('vm-tools-missing') }}</i>
   </MenuItem>
 </template>