Home › Forums › Pro Themes › Pet Business Pro › Price Section Colors

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • October 27, 2021 at 3:49 pm #159669
    John Barbagallo
    Participant

    Is it possible to change the color of the boxes and buttons in the price section?

    For example the demo each Pet Package Box has a different color and button color. I would like to make them all the same

    October 27, 2021 at 11:31 pm #159675
    sanam
    Keymaster

    @JBARBAGALLO, Yes it is possible to change the color of the boxes and buttons in the price section.

    Please add this CSS into additional CSS to change the color.

    
#pricing-table article:nth-child(1n) .price,
#pricing-table article:nth-child(2n) .price,
#pricing-table article:nth-child(3n) .price,
#pricing-table article:nth-child(1n) .price-table-wrapper ul li,
#pricing-table article:nth-child(1n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(2n) .price-table-wrapper ul li,
#pricing-table article:nth-child(2n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(3n) .price-table-wrapper ul li,
#pricing-table article:nth-child(3n) .price-table-wrapper .entry-title {
	color: #82868b;
}

#pricing-table article:nth-child(1n) .price-table-wrapper,
#pricing-table article:nth-child(2n) .price-table-wrapper,
#pricing-table article:nth-child(3n) .price-table-wrapper {
	background-color: #fff;
}

#pricing-table article:nth-child(1n) .btn,
#pricing-table article:nth-child(2n) .btn,
#pricing-table article:nth-child(3n) .btn {
    background-color: #ff8737;
    border-color: #ff8737;
    color: #fff;
}

    Please change the background colors and text colors as per your requirements. You can find color code references on this link https://www.computerhope.com/htmcolor.htm.

    November 2, 2021 at 11:46 am #159939
    John Barbagallo
    Participant

    Thank you Sanam, this worked perfectly. Could you also tell me how to adjust the text color of the Title in the same Pricing section?

    November 3, 2021 at 2:00 am #170546
    sanam
    Keymaster

    @JBARBAGALLO, could you please replace the CSS given below:

    OLD CSS

    
#pricing-table article:nth-child(1n) .price,
#pricing-table article:nth-child(2n) .price,
#pricing-table article:nth-child(3n) .price,
#pricing-table article:nth-child(1n) .price-table-wrapper ul li,
#pricing-table article:nth-child(1n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(2n) .price-table-wrapper ul li,
#pricing-table article:nth-child(2n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(3n) .price-table-wrapper ul li,
#pricing-table article:nth-child(3n) .price-table-wrapper .entry-title {
	color: #82868b;
}

    NEW CSS

    
#pricing-table article:nth-child(1n) .price,
#pricing-table article:nth-child(2n) .price,
#pricing-table article:nth-child(3n) .price,
#pricing-table article:nth-child(1n) .price-table-wrapper ul li,
#pricing-table article:nth-child(2n) .price-table-wrapper ul li,
#pricing-table article:nth-child(3n) .price-table-wrapper ul li {
	color: #82868b;
}

/*
Please insert the color code here to change the text color of the title in the same Pricing section as 
per your requirement.
*/

#pricing-table article:nth-child(1n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(2n) .price-table-wrapper .entry-title,
#pricing-table article:nth-child(3n) .price-table-wrapper .entry-title {
	color: #FF00FF;
}

    Hope this helps

    If you have any confusion please let us know

    • This reply was modified 2 years, 2 months ago by sanam.
    November 3, 2021 at 3:19 pm #170619
    John Barbagallo
    Participant

    Thank for the response but I do not think this is what I was looking for. I would like to change the font color of the “Title” of the Pricing Section, not the title of the products.

    November 4, 2021 at 8:49 pm #170697
    John Barbagallo
    Participant

    I would like to change the font color of just the “Title” of the Pricing Section, not the title of the products. Let me know if you need more clarification

    November 7, 2021 at 10:15 pm #170762
    sanam
    Keymaster

    @JBARBAGALLO, please add the following CSS into additional CSS.

    For Title

    
#pricing-table .section-title {
color: #A52A2A
}

    For Subtitle

    
#pricing-table .section-subtitle {
    color: #800000
}

    Hope this helps

    If you have any confusion please let us know.

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