Woocommerce Product tabs – night mode css changes light mode as well

  • Resolved sugilite

    (@sugilite)


    4 years, 7 months ago

    Hi Marko,
    first of all, thank you for making such an amazing plugin, it is simply fantastic!

    I’m having an issue I have not been able to get around, probably due to lack of css skills lol.
    My issue is when I put the night mode css in for the Woocommerce product tabs, those changes then show in the normal light mode too. I have tinkered away for hours trying to sort it and feel like I’m up against an adversary that has a really good jab!

    Here is the product tab example image below…

    The css I’m using is…..
    body.wp-night-mode-on body.woocommerce div.product .woocommerce-tabs .panel, body.woocommerce #content-area div.product .woocommerce-tabs .panel {
    padding: 30px;
    margin: 0;
    background-image: linear-gradient(180deg, #184a73 0%, #343f4d 100%);
    border-style: solid;
    border-radius: 0px 0px 15px 15px;
    box-shadow: 8px 19px 31px -12px #343f4d !important;
    color: #fff;
    }

    An example page is https://test-site.majestic-quartz.com/product/terminated-tanzanite-crystal-5/

    Hoping you can help – Thank you!
    Anthony

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author markoarula

    (@markoarula)

    Hi,

    you just need to remove ‘body.woocommerce’.

    Please try with this CSS:

    body.wp-night-mode-on div.product .woocommerce-tabs .panel,
body.wp-night-mode-on  #content-area div.product .woocommerce-tabs .panel {
    padding: 30px;
    margin: 0;
    background-image: linear-gradient(180deg,#184a73 0%,#343f4d 100%);
    border-style: solid;
    border-radius: 0 0 15px 15px;
    box-shadow: 8px 19px 31px -12px #343f4d!important;
    color: #fff;
}
    Thread Starter sugilite

    (@sugilite)

    Hi Marko,
    You sir are a star! That worked perfectly.
    Again, Thank You so very much for making and supporting such an outstanding plugin!

    Plugin Author markoarula

    (@markoarula)

    No problem, glad that I could help ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Woocommerce Product tabs – night mode css changes light mode as well’ is closed to new replies.