[Resolved] styling ‘woo mini cart’ block

Home Forums Support [Resolved] styling ‘woo mini cart’ block

Home Forums Support styling ‘woo mini cart’ block

  • This topic has 4 replies, 2 voices, and was last updated 1 week ago by Fernando.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #2299019
    Stephen

    Hi, Ive put the little Gutenberg “woo mini cart” block after navigation in my header and it works OK.

    I’ve given it a class in additional CSS classes – mini-cart-hook

    Ive tried styling it as below but my CSS styling does not work ?

    Am I getting something wrong ?

    .mini-cart-hook {
    background-color: grey;
    font-size: 35px;
    }

    or

    .mini-cart-hook a {
    background-color: grey;
    font-size: 35px;
    }

    Thank you

    #2299234
    Fernando
    Customer Support

    Hi Stephen,

    It seems like there’s an issue with that Block in terms of adding CSS classes. The additional CSS isn’t being added. This is a WooCommerce Block though.

    What we can do is add the Mini Cart Block within a Container Block, and add the CSS class to the Container Block instead.

    #2299529
    Stephen

    Hi – I’ll try that instead.

    Thank you

    #2300069
    Stephen

    For anyone who wants to style the woocommerce mini basket block you can use class – wc-block-mini-cart

    /* style header mini basket */
    .wc-block-mini-cart {
    font-size: 19px;
    background: #e8e8e8;
    }
    .wc-block-mini-cart :focus {
    background: #dbdbdb;
    color: black;
    }

    #2300250
    Fernando
    Customer Support

    Glad you resolved the issue!

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