[Donation Block]: Selected donation interval and amount is not visible

[karenroldan]

Impacted plugin

Jetpack

Quick summary

The title for the chosen donation interval isn't visible as its color is set to #FFF (white). Similarly, the selected donation amount doesn't stand out, because its color remains the same as when it's inactive. The only indication of a successful selection is the activation of the Donate button.

Steps to reproduce

1. Add a Donation block
2. View the block on the live page
3. Select any interval
4. Choose an amount

A clear and concise description of what you expected to happen.

When a donation interval or amount is selected, I expect a clear visual indication of the selection. The color of the selected option should change, making it distinct from the inactive options.

What actually happened

Selected donation interval and amount are not visible.

Impact

One

Available workarounds?

Yes, easy to implement

Platform (Simple and/or Atomic)

Atomic

Logs or notes

• Third-party theme (Scribe Theme (Kadence) • Restored 316)

.wp-block-jetpack-donations .donations__nav-item.is-active {
    background: var(--wp-admin-theme-color);
    color: #fff;
    cursor: default;
}

.wp-block-jetpack-donations .donations__amount.is-selected {
    box-shadow: 0 0 0 1px #fff,0 0 0 3px var(--wp-admin-theme-color);
    outline: 2px solid transparent;
    outline-offset: -2px;
}

[jeherve]

Could you let us know what theme you were using on your site, to make things easier to reproduce?

Thank you!

[karenroldan]

Could you let us know what theme you were using on your site, to make things easier to reproduce?

Hi! It's a third-party theme: Scribe Theme (Kadence) by Restored 316.