[Bug] Ellipsis color is wrong in panel UI

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

It is fine on light themes

.buttons-holder {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;

sp-action-button {
    display: flex;
    flex-direction: row;
    justify-content: start;
    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;

        <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" />
        <div class="label">Huge label</div>

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.

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

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.

Ah, sorry, forgot to mention :man_facepalming:

Currently latest Ps v22.4.3 on Win10 Pro