Support » Theme: Astra » Last update turned buttons outline black

Viewing 7 replies - 1 through 7 (of 7 total)
  • Same here. New Block Library CSS overrides custom Astra settings:

    ../wp-includes/css/dist/block-library/style.min.css

    .wp-block-button.is-style-outline .wp-block-button__link, .wp-block-button__link.is-style-outline {
        color: #32373c;
        background-color: transparent;
        border: 2px solid;
    }

    Hi @jiquaglia, @captaincrispycrunch,

    Could please let us know the specific step to reproduce this as I tried this on our end and we had no such issue?
    
    Kind regards,
    Herman 🙂

    I create a new button, set the design to “outline” and then I change the button text color (which should change the color of both the text and the outline) but the color doesn’t change in the frontend. It remains black. It did change in the editor.

    • This reply was modified 2 months, 1 week ago by Luis García.
    captaincrispycrunch

    (@captaincrispycrunch)

    Customizer > Globals > Buttons

    Color:
    Normal:
    Text Color: #ffffff
    BG Color: rgba(234,234,234,0) = transparent

    Hover:
    Text Color: #a80529
    BG Color: #fff

    Border:
    Width: 1px 1px 1px 1px
    Color: #ffffff
    Hover Color: #ffffff
    Border Radius: 0

    Padding: 20px 40px 20px 40px

    —-

    Page edit > Gutenberg Editor

    Add Block > Design > Button

    Styles: Outline
    Text Color: none
    BG Color: none

    —-

    <div class="wp-block-buttons">
    <div class="wp-block-button is-style-outline">
    <a class="wp-block-button__link">Learn more...</a>
    </div>
    </div>

    ../wp-includes/css/dist/block-library/style.min.css:1

    .wp-block-button.is-style-outline .wp-block-button__link, .wp-block-button__link.is-style-outline {
    color: #32373c;
    background-color: transparent;
    border: 2px solid;
    }

    ../wp-content/themes/child_theme_name/style.css:117

    .wp-block-button .wp-block-button__link {
    padding-top: 20px;
    padding-right: 40px;
    padding-bottom: 20px;
    padding-left: 40px;
    }

    ../index:18

    .wp-block-button .wp-block-button__link {
    border-style: solid;
    border-top-width: 1px;
    border-right-width: 1px;
    border-left-width: 1px;
    border-bottom-width: 1px;
    border-color: #ffffff;
    color: #ffffff;
    font-family: inherit;
    font-weight: inherit;
    line-height: 1;
    font-size: 18px;
    font-size: 1.125rem;
    border-radius: 0;
    padding-top: 20px;
    padding-right: 40px;
    padding-bottom: 20px;
    padding-left: 40px;
    }

    Hi @jiquaglia, @captaincrispycrunch,

    Would you mind reaching out to us through our Support Portal so we can take a look further? Please also mention about this topic when you create a ticket, so we can monitor them both.
    
    Kind regards,
    Herman 🙂

    I sent the ticket. I’d like to add that adding the following custom CSS solved the issue for me:

    .wp-block-button__link.has-white-color {
    color: white !important;
    }

    But ofc the bug remains and should be solved

    Hi @jiquaglia,

    I notice that one of our support agents has already replied to your ticket. Please continue the communication related to this using the ticket and mark the topic as resolved.

    Have a nice day and stay safe!

    Kind regards,
    Herman 🙂

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.