fleet/changes/25283-update-device-users-tooltip
Scott Gress 8bab38b75a
Update "used by" display and tooltip styling (#26262)
For #25283 

# Checklist for submitter

- [X] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/Committing-Changes.md#changes-files)
for more information.

## Details

This PR updates the styling on the "Used by" line of the host details
page in the following ways:

* Updated color of the "more..." text
* Truncated long email address with ellipses
* Tooltip displays _all_ email addresses (in case the first one was
truncated)

## Screenshots

With extra long email:
<img width="353" alt="image"
src="https://github.com/user-attachments/assets/1e6dc535-c40d-44b6-a3ad-86920ac06772"
/>

---

Tooltips:
<img width="386" alt="image"
src="https://github.com/user-attachments/assets/8138e666-18f9-4e3b-a26a-99dc5b0492e7"
/>
<img width="455" alt="image"
src="https://github.com/user-attachments/assets/ef3ac552-b4ee-42ca-a522-aefacb4c9227"
/>

---

With regular email:
<img width="273" alt="image"
src="https://github.com/user-attachments/assets/88fae2c8-a2c8-4dd7-8a67-a8d9e33b7f08"
/>

---

With one email:
<img width="220" alt="image"
src="https://github.com/user-attachments/assets/198cf108-a8b7-4856-aa46-46e4a7676ef5"
/>

---

With one long email:
<img width="314" alt="image"
src="https://github.com/user-attachments/assets/0d781689-3140-41e2-be8c-a0c9b2542b35"
/>
2025-02-20 12:08:25 -06:00

1 line
123 B
Text

- Updated the styling of the "Used by" line on host details page to be easier to read and include more data in the tooltip