[Bug] Ellipsis color is wrong in panel UI

Photoshop
1

When using text-overflow: ellipsis the color of ellipsis always turns black when text won’t fit at all
image

It is fine on light themes
image

<style>
.buttons-holder {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

sp-action-button {
    display: flex;
    flex-direction: row;
    justify-content: start;
    flex-grow:1;
    flex-basis:0;
    min-width: 32px;
    max-width: max-content;
    margin: 2.5px;
    white-space: nowrap;
}

sp-action-button .label {
    font-size: 1em;
    font-weight: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
}
</style>

<sp-action-group>
    <sp-action-button>
        <div slot="icon" class="icon">
            <svg xmlns="http://www.w3.org/2000/svg" height="18" viewBox="0 0 18 18" width="18">
                <rect width="18" height="18" style="fill:transparent;stroke: currentColor;stroke-width: 2;" />
                <path d="M12,0 L18,0 L18,18 L6,18Z" />
            </svg>
        </div>
        <div class="label">Huge label</div>
    </sp-action-button>
</sp-action-group>
2

Add color: var(--uxp-host-text-color) to the .label rule and see if that helps any. (Docs: https://www.adobe.io/photoshop/uxp/guides/theme-awareness/#built-in-theme-colors)

DIVs and SPANs are generally not theme aware, so you have to give them some styling to get them to act correctly.

1 Like
3

Nope :frowning: Even setting to color: white; doesn’t help. Of course even on light theme it keeps white text, but ellipsis still turns dark when no letters would fit to label

4

What OS are you running on? Also, what version of Ps?

I’ll note that in my internal build on macOS Big Sur, I can’t replicate this; so the bug may have been fixed internally.

5

Ah, sorry, forgot to mention :man_facepalming:

Currently latest Ps v22.4.3 on Win10 Pro

6

Ps v23
Still not fixed :frowning:

Same happens on API v2 and manifest v5

7

Apparently same issue with picker too
image image

image image

8

Any plans to fix this? It’s been almost a year now. I don’t believe it’s so time consuming and difficult to solve :confused: Buttons still look awful :frowning:
image

9

@pkrishna FYI ^^^^^^^^

1 Like