Skip to content

Conversation

johnsimons
Copy link
Member

This is to deal with large text display.

The component will automatically add a tooltip based on whether the text overflows.
The ellipses can be added to either side of the text.

This is to deal with large text display
@johnsimons johnsimons requested a review from PhilBastian April 9, 2025 06:51
@johnsimons johnsimons self-assigned this Apr 9, 2025
</script>

<template>
<div ref="textContainer" title="" class="text-container hackToPreventSafariFromShowingTooltip" :class="{ 'left-side-ellipsis': ellipsesStyle === 'LeftSide' }" v-tippy="{ content: tooltipText, maxWidth: 'none' }">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

given the likely usecases of this control, would it make more sense to be a span rather than a div?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It can't be a span, it need to be a block element, I tried it

@johnsimons johnsimons merged commit 5eae586 into master Apr 10, 2025
5 checks passed
@johnsimons johnsimons deleted the john/elipses branch April 10, 2025 06:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants