Description

Correct colors usage in Button after web changes.

ref to gb-mobile: wordpress-mobile/gutenberg-mobile#2155

How has this been tested?

Testing HTML:

<!-- wp:button {"customBackgroundColor":"#325766"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-background" style="background-color:#325766">CUSTOM</a></div>
<!-- /wp:button -->

<!-- wp:button {"gradient":"luminous-dusk"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-background has-luminous-dusk-gradient-background">GRADIENT</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"secondary"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-background has-secondary-background-color">PALETTE</a></div>
<!-- /wp:button -->

<!-- wp:button {"customTextColor":"#90318f"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color" style="color:#90318f">TEXT CUSTOM</a></div>
<!-- /wp:button -->

<!-- wp:button {"textColor":"background"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color has-background-color">TEXT PALETTE</a></div>
<!-- /wp:button -->

Paste that HTML on the mobile editor and compare it with that screenshot:

Another way to test:

1. Open post on web
2. Add Buttons block and create a couple of Buttons inside:
   • Button with custom background color
   • Button with color from palette color
   • Button with gradient color
   • Button with text custom color
   • Button with text color from palette color
3. Open HTML view
4. Remove Buttons container to have separated list of Button
5. Save draft
6. Open post on mobile app
7. Expect:
   • Button with custom background color - button should have the same background color
   • Button with color from palette - button should have gray fallback color
   • Button with gradient color - button should have a gradient color
   • Button with text custom color - button text should have text custom color
   • Button with text color from palette - button text should have white text

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR.